/*
*   SoundCloud Custom Player jQuery Plugin
*   Author: Matas Petrikas, matas@soundcloud.com
*   Copyright (c) 2009  SoundCloud Ltd.
*   Licensed under the MIT license:
*   http://www.opensource.org/licenses/mit-license.php
*
*   Usage:
*   <a href="http://soundcloud.com/matas/hobnotropic" class="sc-player">My new dub track</a>
*   The link will be automatically replaced by the HTML based player
*/
;(function(jQuery) {
  // Convert milliseconds into Hours (h), Minutes (m), and Seconds (s)
  var timecode = function(ms) {
    var hms = function(ms) {
          return {
            h: Math.floor(ms/(60*60*1000)),
            m: Math.floor((ms/60000) % 60),
            s: Math.floor((ms/1000) % 60)
          };
        }(ms),
        tc = []; // Timecode array to be joined with '.'

    if (hms.h > 0) {
      tc.push(hms.h);
    }

    tc.push((hms.m < 10 && hms.h > 0 ? "0" + hms.m : hms.m));
    tc.push((hms.s < 10  ? "0" + hms.s : hms.s));

    return tc.join('.');
  };
  
  var debug = true,
      useSandBox = false,
      log = function(args) {
        if(debug && window.console && window.console.log){
          window.console.log.apply(window.console, arguments);
        }
      },
      domain = useSandBox ? 'sandbox-soundcloud.com' : 'soundcloud.com',
      scApiUrl = function(url, apiKey) {
        return (/api\./.test(url) ? url + '?' : 'http://api.' + domain +'/resolve?url=' + url + '&') + 'format=json&consumer_key=' + apiKey +'&callback=?';
      };

  
  var audioEngine = function() {
    var html5AudioAvailable = function() {
        var state = false;
        try{
          var a = new Audio();
          state = a.canPlayType && (/maybe|probably/).test(a.canPlayType('audio/mpeg'));
          // let's enable the html5 audio on selected mobile devices first, unlikely to support Flash
          // the desktop browsers are still better with Flash, e.g. see the Safari 10.6 bug
          // comment the following line out, if you want to force the html5 mode
          state = state &&  (/iPad|iphone|mobile|pre\//i).test(navigator.userAgent);
        }catch(e){
          // there's no audio support here sadly
        }
        return state;
    }(),
    callbacks = {
      onReady: function() {
        jQuery(document).trigger('scPlayer:onAudioReady');
      },
      onPlay: function() {
        jQuery(document).trigger('scPlayer:onMediaPlay');
      },
      onPause: function() {
        jQuery(document).trigger('scPlayer:onMediaPause');
      },
      onEnd: function() {
        jQuery(document).trigger('scPlayer:onMediaEnd');
      },
      onBuffer: function(percent) {
        jQuery(document).trigger({type: 'scPlayer:onMediaBuffering', percent: percent});
      }
    };
    
    var html5Driver = function() {
      var player = new Audio(),
          onTimeUpdate = function(event){
            var obj = event.target,
                buffer = ((obj.buffered.length && obj.buffered.end(0)) / obj.duration) * 100;
            // ipad has no progress events implemented yet
            callbacks.onBuffer(buffer);
            // anounce if it's finished for the clients without 'ended' events implementation
            if (obj.currentTime === obj.duration) { callbacks.onEnd(); }
          },
          onProgress = function(event) {
            var obj = event.target,
                buffer = ((obj.buffered.length && obj.buffered.end(0)) / obj.duration) * 100;
            callbacks.onBuffer(buffer);
          };
        
      jQuery('<div class="sc-player-engine-container"></div>').appendTo(document.body).append(player);
      
      // prepare the listeners
      player.addEventListener('play', callbacks.onPlay, false);
      player.addEventListener('pause', callbacks.onPause, false);
      player.addEventListener('ended', callbacks.onEnd, false);
      player.addEventListener('timeupdate', onTimeUpdate, false);
      player.addEventListener('progress', onProgress, false);

      
      return {
        load: function(track) {
          player.pause();
          player.src = track.stream_url;
          player.load();
          player.play();
        },
        play: function() {
          player.play();
        },
        pause: function() {
          player.pause();
        },
        seek: function(relative){
          player.currentTime = player.duration * relative;
          player.play();
        },
        getDuration: function() {
          return player.duration;
        },
        getPosition: function() {
          return player.currentTime;
        },
        setVolume: function(val) {
          if(a){
            a.volume = val / 100;
          }
        }
      };

    };
    

    
    var flashDriver = function() {
      var engineId = 'scPlayerEngine',
          player,
          flashHtml = function(url) {
            var swf = 'http://player.' + domain +'/player.swf?url=' + url +'&amp;enable_api=true&amp;player_type=engine&amp;object_id=' + engineId;
            if (jQuery.browser.msie) {
              return '<object height="100%" width="100%" id="' + engineId + '" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" data="' + swf + '">'+
                '<param name="movie" value="' + swf + '" />'+
                '<param name="allowscriptaccess" value="always" />'+
                '</object>';
            } else {
              return '<object height="100%" width="100%" id="' + engineId + '" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000">'+
                '<embed allowscriptaccess="always" height="100%" width="100%" src="' + swf + '" type="application/x-shockwave-flash" name="' + engineId + '" />'+
                '</object>';
            }
          };

      
      
      // listen to audio engine events
      // when the loaded track is ready to play
      soundcloud.addEventListener('onPlayerReady', function(flashId, data) {
        player = soundcloud.getPlayer(engineId);
        callbacks.onReady();
      });
    
      // when the loaded track finished playing
      soundcloud.addEventListener('onMediaEnd', callbacks.onEnd);
    
      // when the loaded track is still buffering
      soundcloud.addEventListener('onMediaBuffering', function(flashId, data) {
        callbacks.onBuffer(data.percent);
      });
    
      // when the loaded track started to play
      soundcloud.addEventListener('onMediaPlay', callbacks.onPlay);
    
      // when the loaded track is was paused
      soundcloud.addEventListener('onMediaPause', callbacks.onPause);
      
      return {
        load: function(track) {
          var url = track.permalink_url;
          if(player){
            player.api_load(url);
          }else{
            // create a container for the flash engine (IE needs this to operate properly)
            jQuery('<div class="sc-player-engine-container"></div>').appendTo(document.body).html(flashHtml(url));
          }
        },
        play: function() {
          player && player.api_play();
        },
        pause: function() {
          player && player.api_pause();
        },
        seek: function(relative){
          player && player.api_seekTo((player.api_getTrackDuration() * relative));
        },
        getDuration: function() {
          return player && player.api_getTrackDuration && player.api_getTrackDuration();
        },
        getPosition: function() {
          return player && player.api_getTrackPosition && player.api_getTrackPosition();
        },
        setVolume: function(val) {
          if(player && player.api_setVolume){
            player.api_setVolume(val);
          }
        }

      };
    };
    
    return html5AudioAvailable? html5Driver() : flashDriver();

  }();
  
  
  
  var autoPlay = false,
      players = [],
      updates = {},
      currentUrl,

      loadTracksData = function(jQueryplayer, links, apiKey) {
        var index = 0,
            playerObj = {node: jQueryplayer, tracks: []},
            loadUrl = function(link) {
              jQuery.getJSON(scApiUrl(link.url, apiKey), function(data) {
                // log('data loaded', link.url, data);
                index += 1;
                if(data.tracks){
                  // log('data.tracks', data.tracks);
                  playerObj.tracks = playerObj.tracks.concat(data.tracks);
                }else if(data.duration){
                  // a secret link fix, till the SC API returns permalink with secret on secret response
                  data.permalink_url = link.url;
                  // if track, add to player
                  playerObj.tracks.push(data);
                }else if(data.username){
                  // if user, get his tracks or favorites
                  if(/favorites/.test(link.url)){
                    links.push({url:data.uri + '/favorites'});
                  }else{
                    links.push({url:data.uri + '/tracks'});
                  }
                }else if(jQuery.isArray(data)){
                  playerObj.tracks = playerObj.tracks.concat(data);
                }
                if(links[index]){                    
                  // if there are more track to load, get them from the api
                  loadUrl(links[index]);
                }else{
                  // if loading finishes, anounce it to the GUI
                  playerObj.node.trigger({type:'onTrackDataLoaded.scPlayer', playerObj: playerObj});
                }
             });
           };
        // update the players queue
        players.push(playerObj);
    
        // load first tracks
        loadUrl(links[index]);
      },
      /*artworkImage = function(track, usePlaceholder) {
        if(usePlaceholder){
          return '<div class="sc-loading-artwork">Loading Artwork</div>';
        }else if (track.artwork_url) {
          return '<img src="' + track.artwork_url.replace('-large', '-t300x300') + '"/>';
        }else{
          return '<div class="sc-no-artwork">No Artwork</div>';
        }
      },*/
      updateTrackInfo = function(jQueryplayer, track) {
        // update the current track info in the player
        // log('updateTrackInfo', track);
        jQuery('.sc-info', jQueryplayer).each(function(index) {
          jQuery(this).html('<a href="' + track.permalink_url +'">' + track.title + '</a> by <a href="' + track.user.permalink_url +'">' + track.user.username + '</a> ' + track.playback_count + ' plays ' + timecode(track.duration));
        });
        // update the artwork
        /*jQuery('.sc-artwork-list li', jQueryplayer).each(function(index) {
          var jQueryitem = jQuery(this),
              itemTrack = jQueryitem.data('sc-track');
      
          if (itemTrack === track) {
            // show track artwork
            jQueryitem
              .addClass('active')
              .find('.sc-loading-artwork')
                .each(function(index) {
                  // if the image isn't loaded yet, do it now
                  jQuery(this).removeClass('sc-loading-artwork').html(artworkImage(track, false));
                });
          }else{
            // reset other artworks
            jQueryitem.removeClass('active');
          }
        });*/
        // cache the references to most updated DOM nodes in the progress bar
        updates = {
          jQuerybuffer: jQuery('.sc-buffer', jQueryplayer), 
          jQueryplayed: jQuery('.sc-played', jQueryplayer), 
          position:  jQuery('.sc-position', jQueryplayer)[0]
        };
        // update the track duration in the progress bar
        jQuery('.sc-duration', jQueryplayer).html(timecode(track.duration));
        // put the waveform into the progress bar
        jQuery('.sc-waveform-container', jQueryplayer).html('<img src="' + track.waveform_url +'" />');
    
        jQueryplayer.trigger('onPlayerTrackSwitch.scPlayer', [track]);
      },
      play = function(track) {
        var url = track.permalink_url;
        if(currentUrl === url){
          // log('will play');
          audioEngine.play();
        }else{
          currentUrl = url;
          // log('will load', url);
          audioEngine.load(track);
          autoPlay = true;
        }
      },
      getPlayerData = function(node) {
        return players[jQuery(node).data('sc-player').id];
      },
      updatePlayStatus = function(player, status) {
        if(status){
          // reset all other players playing status
          jQuery('div.sc-player.playing').removeClass('playing');
        }
        jQuery(player)
          .toggleClass('playing', status)
          .trigger((status ? 'onPlayerPlay' : 'onPlayerPause') + '.scPlayer');
      },
      onPlay = function(player, id) {
        var track = getPlayerData(player).tracks[id || 0];
        updateTrackInfo(player, track);
        updatePlayStatus(player, true);
        play(track);
      },
      onPause = function(player) {
        updatePlayStatus(player, false);
        audioEngine.pause();
      },
      onSeek = function(player, relative) {
        audioEngine.seek(relative);
      },
      soundVolume = function() {
        var vol = 80,
            cooks = document.cookie.split(';'),
            volRx = new RegExp('scPlayer_volume=(\\d+)');
        for(var i in cooks){
          if(volRx.test(cooks[i])){
            vol = parseInt(cooks[i].match(volRx)[1], 10);
            break;
          }
        }
        return vol;
      }(),
      onVolume = function(volume) {
        var vol = Math.floor(volume);
        // save the volume in the cookie
        var date = new Date();
        date.setTime(date.getTime() + (365 * 24 * 60 * 60 * 1000));
        soundVolume = vol;
        document.cookie = ['scPlayer_volume=', vol, '; expires=', date.toUTCString(), '; path="/"'].join('');
        // update the volume in the engine
        audioEngine.setVolume(soundVolume);
      },
      positionPoll;
  
    // listen to audio engine events
    jQuery(document)
      .bind('scPlayer:onAudioReady', function(event) {
        log('onPlayerReady: audio engine is ready');
        audioEngine.play();
        // set initial volume
        onVolume(soundVolume);
      })
      // when the loaded track started to play
      .bind('scPlayer:onMediaPlay', function(event) {
        clearInterval(positionPoll);
        positionPoll = setInterval(function() {
          var duration = audioEngine.getDuration() * 1000;
          var position = audioEngine.getPosition();
          updates.jQueryplayed.css('width', ((position / audioEngine.getDuration()) * 100) + '%');
          updates.position.innerHTML = timecode(position * 1000); 
        }, 50);
      })
      // when the loaded track is was paused
      .bind('scPlayer:onMediaPause', function(event) {
        clearInterval(positionPoll);
      })
      // change the volume
      .bind('scPlayer:onVolumeChange', function(event) {
        onVolume(event.volume);
      })
      .bind('scPlayer:onMediaEnd', function(event) {
        log('track finished get the next one');
        if(autoPlay){      
          jQuery('.sc-trackslist li.active').next('li').click();
        }
      })
      .bind('scPlayer:onMediaBuffering', function(event) {
        updates.jQuerybuffer.css('width', event.percent + '%');
      });
    

  // Generate custom skinnable HTML/CSS/JavaScript based SoundCloud players from links to SoundCloud resources
  jQuery.scPlayer = function(options, node) {
    var opts = jQuery.extend({}, jQuery.scPlayer.defaults, options),

        playerId = players.length,
        jQuerysource = node && jQuery(node),
        links = opts.links || jQuery.map(jQuery('a', jQuerysource).add(jQuerysource.filter('a')), function(val) { return {url: val.href, title: val.innerHTML}; }),

        jQueryplayer = jQuery('<div class="sc-player loading"></div>').data('sc-player', {id: playerId}),
				jQueryslide = jQuery('<div class="sc-slide"></div>').appendTo(jQueryplayer),
				jQuerycontainer = jQuery('<div class="sc-container"></div>').appendTo(jQueryplayer),
				jQuerycontent = jQuery('<div class="sc-content"></div>').appendTo(jQuerycontainer),
        jQueryinfo = jQuery('<div class="sc-info"></div>').appendTo(jQuerycontent),
				jQuerytimespan = jQuery('<div class="sc-time-span hidden"></div>').appendTo(jQuerycontent),
        jQuerycontrols = jQuery('<div class="sc-controls"></div>').appendTo(jQuerycontainer),
				jQuerylogo = jQuery('<div class="sc-logo hidden"><img src="'+ root +'images/logo_sc.png"></div>').appendTo(jQuerycontainer),
				jQueryclear = jQuery('<div style="clear:both;"></div>').appendTo(jQueryplayer),
				jQuerylist = jQuery('<ol class="sc-trackslist"></ol>').appendTo(jQueryplayer);
        
        // enable autoplay if set in the options
        autoPlay = opts.autoPlay;

				jQueryplayer
					.find('.sc-controls')
            .append('<a href="#play" class="sc-play"></a><a href="#pause" class="sc-pause"></a>').end()
					.find('.sc-time-span')
            .append('<div class="sc-waveform-container"></div><div class="sc-buffer"></div><div class="sc-played"></div>')
						.append('<div class="sc-time-indicators"><span class="sc-position"></span> | <span class="sc-duration"></span></div>');
        
        // load and parse the track data from SoundCloud API
        loadTracksData(jQueryplayer, links, opts.apiKey);
        // init the player GUI, when the tracks data was laoded
        jQueryplayer.bind('onTrackDataLoaded.scPlayer', function(event) {
          // log('onTrackDataLoaded.scPlayer', event.playerObj, playerId, event.target);
          var tracks = event.playerObj.tracks;
          jQuery.each(tracks, function(index, track) {
            var active = index === 0;
            // create an item in the playlist
            jQuery('<li><a href="' + track.permalink_url +'">' + track.title + '</a><span class="sc-track-duration">' + timecode(track.duration) + '</span></li>').data('sc-track', {id:index}).toggleClass('active', active).appendTo(jQuerylist);
            // create an item in the artwork list
            //jQuery('<li></li>')
              //.append(artworkImage(track, index >= opts.loadArtworks))
              //.appendTo(jQueryartworks)
              //.toggleClass('active', active)
              //.data('sc-track', track);
          });
          jQueryplayer
            .removeClass('loading')
            .trigger('onPlayerInit.scPlayer');
          
          // update the element before rendering it in the DOM
          jQueryplayer.each(function() {
            if(jQuery.isFunction(opts.beforeRender)){
              opts.beforeRender.call(this, tracks);
            }
          });
          // set the first track's duration
          jQuery('.sc-duration', jQueryplayer)[0].innerHTML = timecode(tracks[0].duration);
          jQuery('.sc-position', jQueryplayer)[0].innerHTML = timecode(0);
          // set up the first track info
          updateTrackInfo(jQueryplayer, tracks[0]);
        });


    // replace the DOM source (if there's one)
    jQuerysource.each(function(index) {
      jQuery(this).replaceWith(jQueryplayer);
    });

    return jQueryplayer;
  };
  
  // stop all players, might be useful, before replacing the player dynamically
  jQuery.scPlayer.stopAll = function() {
    jQuery('.sc-player.playing a.sc-pause').click();
  };
  
  // plugin wrapper
  jQuery.fn.scPlayer = function(options) {
    return this.each(function() {
      jQuery.scPlayer(options, this);
    });
  };

  // default plugin options
  jQuery.scPlayer.defaults = jQuery.fn.scPlayer.defaults = {
    // do something with the dom object before you render it, add nodes, get more data from the services etc.
    beforeRender  :   function(tracksData) {
      var jQueryplayer = jQuery(this);
    },
    // initialization, when dom is ready
    onDomReady  : function() {
     // jQuery('a.sc-player, div.sc-player').scPlayer();
    },
    autoPlay: false,
    loadArtworks: 5,
    // the default Api key should be replaced by your own one
    // get it here http://soundcloud.com/you/apps/new
    apiKey: 'htuiRd1JP11Ww0X72T1C3g'
  };
  
  
  // the GUI event bindings
  //--------------------------------------------------------
  
  // toggling play/pause
  jQuery('a.sc-play, a.sc-pause').live('click', function(event) {
	
    var jQuerylist = jQuery(this).closest('.sc-player').find('ol.sc-trackslist');
    // simulate the click in the tracklist
    jQuerylist.find('li.active').click();
    return false;

  });

  // selecting tracks in the playlist
  jQuery('.sc-trackslist li').live('click', function(event) {
	
    var jQuerytrack = jQuery(this),
        jQueryplayer = jQuerytrack.closest('.sc-player'),
        trackId = jQuerytrack.data('sc-track').id,
        play = jQueryplayer.is(':not(.playing)') || jQuerytrack.is(':not(.active)');

    if (play) {
	
			jQuery('.sc-info').addClass('hidden');
			jQuery('.sc-logo').removeClass('hidden');
			jQuery('.sc-slide').animate({ width: "100%" }, "slow", function(){jQuery('.sc-time-span').removeClass('hidden');} );
	
      onPlay(jQueryplayer, trackId);

    }else{
	
			jQuery('.sc-info').removeClass('hidden');
			jQuery('.sc-time-span').addClass('hidden');
			jQuery('.sc-logo').addClass('hidden');
			jQuery('.sc-slide').css({width: "18px"});
	
      onPause(jQueryplayer);

    }
    jQuerytrack.addClass('active').siblings('li').removeClass('active');
    //jQuery('.artworks li', jQueryplayer).each(function(index) {
    //  jQuery(this).toggleClass('active', index === trackId);
    //});
    return false;
  });
  
  var scrub = function(node, xPos) {
    var jQueryscrubber = jQuery(node).closest('.sc-time-span'),
        jQuerybuffer = jQueryscrubber.find('.sc-buffer'),
        jQueryavailable = jQueryscrubber.find('.sc-waveform-container img'),
        jQueryplayer = jQueryscrubber.closest('.sc-player'),
        relative = Math.min(jQuerybuffer.width(), (xPos  - jQueryavailable.offset().left)) / jQueryavailable.width();
    onSeek(jQueryplayer, relative);
  };
  
  var onTouchMove = function(ev) {
    if (ev.targetTouches.length === 1) {
      scrub(ev.target, ev.targetTouches && ev.targetTouches.length && ev.targetTouches[0].clientX);
      ev.preventDefault();
    }
  };
  
  // seeking in the loaded track buffer
  jQuery('.sc-time-span')
    .live('click', function(event) {
      scrub(this, event.pageX);
      return false;
    })
    .live('touchstart', function(event) {
      this.addEventListener('touchmove', onTouchMove, false);
      event.originalEvent.preventDefault();
    })
    .live('touchend', function(event) {
      this.removeEventListener('touchmove', onTouchMove, false);
      event.originalEvent.preventDefault();
    });
  
  // changing volume in the player
  /*var startVolumeTracking = function(node, startEvent) {
    var jQuerynode = jQuery(node),
        originX = jQuerynode.offset().left,
        originWidth = jQuerynode.width(),
        getVolume = function(x) {
          return Math.floor(((x - originX)/originWidth)*100);
        },
        update = function(event) {
          jQuery(document).trigger({type: 'scPlayer:onVolumeChange', volume: getVolume(event.pageX)});
        };
    jQuerynode.bind('mousemove.sc-player', update);
    update(startEvent);
  };
  
  var stopVolumeTracking = function(node, event) {
    jQuery(node).unbind('mousemove.sc-player');
  };
  
  jQuery('.sc-volume-slider')
    .live('mousedown', function(event) {
      startVolumeTracking(this, event);
    })
    .live('mouseup', function(event) {
      stopVolumeTracking(this, event);
    });
  
  jQuery(document).bind('scPlayer:onVolumeChange', function(event) {
    jQuery('span.sc-volume-status').css({width: event.volume + '%'});
  });*/
  // -------------------------------------------------------------------

  // the default Auto-Initialization
  jQuery(function() {
    if(jQuery.isFunction(jQuery.scPlayer.defaults.onDomReady)){
      jQuery.scPlayer.defaults.onDomReady();
    }
  });

})(jQuery);

var root = 'http://jl.colrec.com/';
