$(document).ready(function() {
	players = $('.player').length;
	
	$(':focusable').focus(function() {
		$('.player').find('.volume').removeClass("focus");
		$('.player').removeClass('focus');
	});
	
  i = 0;
  for (i = 0; i < players; i++) {
    player = $('.player:eq(' + i + ')');
    
    audio = player.find('audio');
    loadingIndicator = player.find('.buffered');
    tracker = player.find('.tracker');
    positionIndicator = player.find('.progress');
    timeleft = player.find('.timeleft');
    play = player.find('.play');
    pause = player.find('.pause');
    stop = player.find('.stop');
    level = player.find('.level');
    volume = player.find('.volume');
    description = player.find('.description');
		
		player.find('*').focus(function() {
			player = $(this).parents('.player');
			
			player.addClass('focus');
			
			volume = player.find('.volume');
			description = player.find('.description');
			
			volume.addClass("focus");
		});
		
    play.click(function(event) {
      event.preventDefault();
      
      $('.player').find('.pause').trigger('click');
      
      player = $(this).parents('.player');
      
      player.find('audio')[0].play();
      
      player.find('.play').hide();
      player.find('.pause').show();
			player.find('.pause').focus();
      player.find('.stop').show();
      player.find('.tracker').show();
      player.find('.timeleft').show();
    });
 
    pause.click(function(event) {
	    event.preventDefault();
	    
	    player = $(this).parents('.player');
	    
      player.find('audio')[0].pause();
      
      player.find('.play').show();
			player.find('.play').focus();
      player.find('.pause').hide();
    });
 
    stop.click(function(event) {
      event.preventDefault();
      
      player = $(this).parents('.player');
      
	    player.find('audio')[0].pause();
	    player.find('audio')[0].currentTime = 0;
	    
      player.find('.play').show();
			player.find('.play').focus();
      player.find('.pause').hide();
      player.find('.stop').hide();
      player.find('.tracker').hide();
      player.find('.timeleft').hide();
    });
    
    tracker.hide();
    timeleft.hide();
    stop.hide();
    pause.hide();
       /*
    if ((audio[0].buffered != undefined) && (audio[0].buffered.length != 0)) {
      audio.bind('progress', function() {
        var loaded = parseInt(((audio[0].buffered.end(0) / audio[0].duration) * 100), 10);
        loadingIndicator.css({width: loaded + '%'});
      });
    } else {
      loadingIndicator.remove();
    }*/
    
    audio.bind('timeupdate', function() {
      player = $(this).parents('.player');
      
      audio = player.find('audio');
      loadingIndicator = player.find('.buffered');
      tracker = player.find('.tracker');
      positionIndicator = player.find('.progress');
      timeleft = player.find('.timeleft');
      play = player.find('.play');
      pause = player.find('.pause');
      stop = player.find('.stop');
      level = player.find('.level');
      volume = player.find('.volume');
      description = player.find('.description');
      
      if (player.data('manualSeek') == "undefined" || !player.data('manualSeek')) {
        positionIndicator.slider({ value: audio[0].currentTime });
        
        var rem = parseInt(audio[0].duration - audio[0].currentTime, 10),
        pos = (audio[0].currentTime / audio[0].duration) * 100,
        mins = Math.floor(rem/60,10),
        secs = rem - mins*60;
        
        timeleft.text('-' + mins + ':' + (secs > 9 ? secs : '0' + secs));
      }
      if (player.data('loaded') == "undefined" || !player.data('loaded')) {
        player.data('loaded', true);
        
        positionIndicator.slider({
          orientation: "horizontal",
          value: 0,
          min: 0,
          step: 0.1,
          range: "min",
          max: audio[0].duration,
          animate: true,
          start: function() {
            player = $(this).parents('.player');
            
            player.data('manualSeek', true);
            volumeSliding = true;
          },
          stop: function(e, ui) {
            player = $(this).parents('.player');
            audio = player.find('audio');
            
            player.data('manualSeek', false);
            volumeSliding = false;
            
            audio[0].currentTime = ui.value;
            
            for (i = 0; i < players; i++) {
              player = $('.player:eq(' + i + ')');
              volume = player.find('.volume');
              description = player.find('.description');
            }
          },
          slide: function(e, ui) {
            player = $(this).parents('.player');
            audio = player.find('audio');
            timeleft = player.find('.timeleft');
            
            var rem = parseInt(audio[0].duration - ui.value, 10),
            pos = (ui.value / audio[0].duration) * 100,
            mins = Math.floor(rem/60,10),
            secs = rem - mins*60;
            
            timeleft.text('-' + mins + ':' + (secs > 9 ? secs : '0' + secs));
          }
        });
      }
    });
    
    level.slider({
      orientation: "horizontal",
      value: 0.75,
      min: 0,
      step: 0.01,
      range: "min",
      max: 1,
      animate: true,
      start: function() {
        volumeSliding = true;
      },
      stop: function(e, ui) {
        player = $(this).parents('.player');
        audio = player.find('audio');
        
        audio[0].volume = ui.value;
        volumeSliding = false;
      },
      slide: function(e, ui) {
        player = $(this).parents('.player');
        audio = player.find('audio');
        
        audio[0].volume = ui.value;
      }
    });
    
    volumeSliding = false;
    player.data('volumeIsOver', false);
    audio[0].volume = 0.75;
  }
});