var controlNames = ['play', 'pause', 'stop', 'loadBar', 'playBar', 'volumeMin', 
    'volumeMax', 'volumeBar', 'volumeBarValue'];

function setControls(player, prefix) {
    $(controlNames).each(function() {
        player.jPlayerId(this, prefix + '_' + this);
    });
}

function playNext(playlist) {
    var size = $(playlist).find('li').length;
    var current_index = $(playlist).find('li').index($(playlist).find('li.playlist_current'));
    var next_index =  current_index < size - 1 ?  current_index + 1 : 0;
    li = $(playlist).find('li').get(next_index);
    $(li).children(0).click();
}

function playPrevious(playlist) {
    var size = $(playlist).find('li').length;
    var current_index = $(playlist).find('li').index($(playlist).find('li.playlist_current'));
    var previous_index =  current_index > 0 ?  current_index - 1 : size - 1;
    li = $(playlist).find('li').get(previous_index);
    $(li).children(0).click();    
}

$(function() {
    //console.log('Initializing playlists');
    $('.playlist').each(function() {
        var prefix = $(this).attr('id');
        //console.log('Setting up #' + prefix);
        var playlist = this;
        template = '\
        <div id="${prefix}_jplayer"></div> \
            <div id="${prefix}_container" class="jp_container"> \
            <ul id="${prefix}_controls" class="jp_controls"> \
                <li id="${prefix}_play" class="jp_play">play</li> \
                <li id="${prefix}_pause" class="jp_pause">pause</li> \
                <li id="${prefix}_stop" class="jp_stop">stop</li> \
                <li id="${prefix}_volumeMin" class="jp_volumeMin">min volume</li> \
                <li id="${prefix}_volumeMax" class="jp_volumeMax">max volume</li> \
                <li id="${prefix}_ctrlPrev" class="jp_ctrlPrev">previous</li> \
                <li id="${prefix}_ctrlNext" class="jp_ctrlNext">next</li> \
            </ul> \
            <div id="${prefix}_playTime" class="jp_playTime"></div> \
            <div id="${prefix}_totalTime" class="jp_totalTime"></div> \
            <div id="${prefix}_progress" class="jp_progress"> \
                <div id="${prefix}_loadBar" class="jp_loadBar"> \
                <div id="${prefix}_playBar" class="jp_playBar"></div> \
            </div> \
        </div> \
        <div id="${prefix}_volumeBar" class="jp_volumeBar"> \
            <div id="${prefix}_volumeBarValue" class="jp_volumeBarValue"></div> \
        </div>';
        var listHTML = template.replace(/\$\{prefix\}/g, prefix);
        $(listHTML).insertBefore(this);
        var player = $('#' + prefix + '_jplayer').jPlayer({
            ready: function() {
                var a = $(playlist).find('li:first a');
                var href = $(a).attr('href');
                $(this).setFile(href);
                $(a).parent().addClass('playlist_current');
            }
        });
        setControls(player, prefix);
        player.onProgressChange( function(loadPercent, playedPercentRelative, playedPercentAbsolute, playedTime, totalTime) {
            var myPlayedTime = new Date(playedTime);
            var ptMin = (myPlayedTime.getUTCMinutes() < 10) ? "0" + myPlayedTime.getUTCMinutes() : myPlayedTime.getUTCMinutes();
            var ptSec = (myPlayedTime.getUTCSeconds() < 10) ? "0" + myPlayedTime.getUTCSeconds() : myPlayedTime.getUTCSeconds();
            $('#' + prefix + '_playTime').text(ptMin+":"+ptSec);

            var myTotalTime = new Date(totalTime);
            var ttMin = (myTotalTime.getUTCMinutes() < 10) ? '0' + myTotalTime.getUTCMinutes() : myTotalTime.getUTCMinutes();
            var ttSec = (myTotalTime.getUTCSeconds() < 10) ? '0' + myTotalTime.getUTCSeconds() : myTotalTime.getUTCSeconds();
            $('#' + prefix + '_totalTime').text(ttMin+':'+ttSec);
        });
        player.onSoundComplete(function() {
            playNext(playlist);
        });
        // Set up each of the links to set the file
        $(playlist).find('li a').each(function () {
            a = this;
            $(a).click(function() {
                href = $(this).attr('href');
                //console.log('Setting the player file to ' + href);
                player.setFile(href);
                $(this).closest('ul').find('.playlist_current').removeClass('playlist_current');
                $(this).closest('li').addClass('playlist_current');
                player.play();
                return false;
            });
        });
        // Set up the controls
        $('#' + prefix + '_ctrlPrev').click(function() {
            playPrevious(playlist);
            return false;
        });
        $('#' + prefix + '_ctrlNext').click(function() {
            playNext(playlist);
            return false;
        });
    });
});