JSFIDDLE
$(function() {
// Setup the player to autoplay the next track
var a = audiojs.createAll({
trackEnded: function() {
var next = $('article > ul li.playing').next();
var title = $('img', this).attr("title");
$("a.songtitle").text(title);
if (!next.length) next = $('article > ul li').first();
audio.load($('a', next).attr('data-src'));
audio.play();
}
});
// Load in the first track
var audio = a[0];
first = $('article > ul li a').attr('data-src');
$('article > ul li').first();
audio.load(first);
// Load in a track on click
$('article > ul li').click(function(e) {
e.preventDefault();
var title = $('img', this).attr("title");
$("a.songtitle").text(title);
audio.load($('a', this).attr('data-src'));
audio.play();
});
// Keyboard shortcuts
$(document).keydown(function(e) {
var unicode = e.charCode ? e.charCode : e.keyCode;
// right arrow
if (unicode == 39) {
var next = $('article > ul li.playing').next();
if (!next.length) next = $('article > ul li').first();
next.click();
// back arrow
} else if (unicode == 37) {
var title = $('img', this).attr("title");
$("a.songtitle").text(title);
var prev = $('article > ul li.playing').prev();
if (!prev.length) prev = $('article > ul li').last();
prev.click();
// spacebar
} else if (unicode == 32) {
audio.playPause();
}
})
});
It looks like you were trying to modify THIS SCRIPT and I wish I knew more about Wordpress or the AUDIO.JS script to help you. It doesn't seem to want to recognize anything outside the parent <li>
but I can get it to play the second song in your code. Good luck, I hope this helps.
edit minor accomplishment... with a few edits (and a an updated fiddle), I can get it to play both songs but only with the left arrow. Weird, I know.. but it's progress.