').appendTo($controlsWrapper),
$mindContent = $('').appendTo($controlsWrapper);
// enable autoplay if set in the options
autoPlay = opts.autoPlay;
// adding controls to the player
$player
.find('.sc-controls')
.append('PlayPause');
$player
.find('.sc-mid')
.append('')
.append('')
.find('.sc-scrubber')
.append('
');
$player
.find('.sc-track')
.append('' + track.title + '' + timecode(track.duration) + '')
// create an item in the artwork list
if(opts.loadArtwork)
{
$(artworkImage(track, opts.loadArtwork))
.appendTo($artworks)
.data('sc-track', track);
}
$player.trigger('onPlayerInit.scPlayer');
// update the element before rendering it in the DOM
$player.each(function() {
if ($.isFunction(opts.beforeRender)) {
opts.beforeRender.call(this, track);
}
});
if (!opts.defaultFlash) {
// set the first track's duration
$('.sc-duration', $player)[0].innerHTML = timecode(track.duration);
$('.sc-position', $player)[0].innerHTML = timecode(0);
}
// set up the first track info
updateTrackInfo($player, track, false);
//
return $player;
}
// Generate custom skinnable HTML/CSS/JavaScript based SoundCloud players from links to SoundCloud resources
$.scPlayer = function(options, node) {
var opts = $.extend({},
$.fn.scPlayer.defaults, options),
$source = node && $(node),
$wrapper = $('
Loading
'),
links = opts.links || $.map($('a', $source).add($source.filter('a')),
function(val) {
return {
url: val.href,
title: val.innerHTML
};
});
log('using flash as default :', opts.defaultFlash);
// init the player GUI, when the tracks data was laoded
$wrapper.bind('onTrackDataLoaded.scPlayer',
function(event) {
log('onTrackDataLoaded.scPlayer', event.playerObj);
$(this).data('screen',-1);
$(this).data('playerObj', event.playerObj);
//
showPlaylist( true, $(this) );
});
// load and parse the track data from SoundCloud API
loadTracksData($wrapper, links);
// replace the DOM source (if there's one)
$source.each(function(index) {
$(this).replaceWith($wrapper);
});
return $wrapper;
};
// plugin wrapper
$.fn.scPlayer = function(options) {
return this.each(function() {
$.scPlayer(options, this);
});
};
// default plugin options
$.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 $player = $(this);
},
// initialization, when dom is ready
onDomReady: function() {
log('Dom Ready');
// update default flash opt if we have flash avaliable
this.defaultFlash = (typeof swfobject == 'object' && swfobject.hasFlashPlayerVersion("9.0.18") && this.defaultFlash) ? true: false;
//
if(gup('noFlash') == '1')
this.defaultFlash = false;
// add audioevents if needed
if (!this.defaultFlash) addAudioEngineEvents();
//
addEventsTracking();
// create players
$('a.sc-player, div.sc-player').scPlayer();
},
autoPlay: false,
loadArtwork: false,
defaultFlash: true,
color:'FF70E5',
limit:5
};
// the GUI event bindings
//--------------------------------------------------------
//
$('.sc-navigation a.sc-next').live('click',function(event){
log('navigaiton click');
showPlaylist( true, $(this).closest('.sc-player-wrapper') );
return false;
});
//
$('.sc-navigation a.sc-previous').live('click',function(event){
log('navigaiton click');
showPlaylist( false, $(this).closest('.sc-player-wrapper') );
return false;
});
// toggling play/pause
$('a.sc-play, a.sc-pause').live('click',
function(event) {
// simulate the click in the tracklist
var $track = $(this).closest('.sc-player').find('.sc-track').click();
return false;
});
// selecting tracks in the playlist
$('.sc-track').live('click',
function(event) {
var $track = $(this),
$player = $track.closest('.sc-player'),
play = $player.is(':not(.playing)') || $track.is(':not(.active)');
if (play) {
onPlay($player);
} else {
onPause($player);
}
//
$track.toggleClass('active');
//
$('.artworks', $player).each(function(index) {
$(this).toggleClass('active');
});
return false;
});
var scrub = function(node, xPos) {
var $scrubber = $(node).closest('.sc-time-span'),
$buffer = $scrubber.find('.sc-buffer'),
$available = $scrubber.find('.sc-waveform-container img'),
$player = $scrubber.closest('.sc-player'),
relative = Math.min($buffer.width(), (xPos - $available.offset().left)) / $available.width();
//
onSeek(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
$('.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();
});
// -------------------------------------------------------------------
// the default Auto-Initialization
$(function() {
if ($.isFunction($.fn.scPlayer.defaults.onDomReady)) {
$.fn.scPlayer.defaults.onDomReady();
}
});
})(jQuery);