0

On my page I load some tracks in a music player ( http://dev.upcoming-djs.com ) on page load.

Which is working fine.

However when people go to the following URL: http://dev.upcoming-djs.com/track/1/artist/title I would like to load another track in the player on page load.

Currently the JS code for the player is:

var tracks = [];
tracks.push({'url':trackurl, 'title':trackurl});

$('.upcoming-player-container').theplayer({
  links: tracks // contains an array with url's
});

Which is static.

What would be the best way (not meant to be subjective, just don't know how to rephrase it) of making it dynamic.

I was thinking of adding some hyperlinks in a (hidden) container on the page which I retrieve with JS.

Is this a good way to do it? (Since I think Google might add the text to the search results).

Or perhaps there is a better way of doing it?

1 Answer 1

1

Assuming that the player will play the tracks in order, here's some code that will shift the track specified by the URL /track/##/artist/title to the front of the playlist, presumably playing it first on page load:

var tracks = [],
    trackMatch
    trackPlay;

tracks.push({'url': trackurl,'title': trackurl});
// tracks.push etc...

// find the track number
trackMatch = window.location.href.match(/track\/(\d+)/i);

// if found store as integer
if (trackMatch) {
    trackPlay = parseInt(trackMatch[1], 10);
}

// if found move selected track to front of tracks array
if (trackPlay) {
    tracks = [tracks[trackPlay - 1]]
             .concat(tracks.slice(0, trackPlay - 1))
             .concat(tracks.slice(trackPlay));
}

$('.upcoming-player-container').theplayer({
    links: tracks // contains an array with url's
});
Sign up to request clarification or add additional context in comments.

1 Comment

Getting it directly from the URL. I like this solution. +1

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.