soundcloud / soundcloud-custom-player

The SoundCloud custom javascript based player
http://soundcloud.com
704 stars 231 forks source link

Seek / Player Switch Problem with Multiple Players #42

Open keroberts opened 11 years ago

keroberts commented 11 years ago

When a page has multiple players, clicking on the wav form of any player that isn't the "active" player seeks / restarts the active players track, rather than starts the track / seeks in the player that was clicked.

This can be seen in the example: sc-player-standard.html

Qbrain commented 11 years ago

I fixed this issue myself today. I did not need to start/seek the new file however, only stop the others from playing the current active one.

Go to sc-player.js and find the following code:

// 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(); })

then add '.playing' before the .sc-time-span, like this:

$('.playing .sc-time-span')

hope it helps greets,

-Q

keroberts commented 11 years ago

Thanks QBrain, much appreciated..

For my project i was using only 1 track per player, and needed it to jump tracks / player if the user clicked another wav.

In the end i added:

onPlay($player);

to the scrub code:

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($player, relative); onPlay($player); // Added onPlay to start playing the track clicked. };

I'm not sure if this is the best way (i'm no javascript expert!) but it seemed to work at the time :)

Thanks again for your post,

Keith