shahzeb1 / soundcloud-player Goto Github PK

Under the "Change song" button, have 3 album covers for songs from SoundCloud. Once album is clicked, that song should queue up, info should change, and it should play.

• Implement UI via bootstrap rows for 3 albums under the button
• When album is clicked, change the info (artist / song name)
• When album is clicked, play that song from soundcloud
• Bootstrap grid sin't broken on #7

If the song is playing then show the pause button.
If the song is paused (or not playing) then show the play button.

The section/code you should focus on: These lines.

Good issue for beginners!

Currently new songs can be played by copying the link of new songs from soundcloud.com, but once the page is refreshed, it only shows the predefined three songs. So things needed to be implemented.

1. Add new songs to the playlist by the user.
2. User Can make different playlist according to there choice.
3. Users can add favourites (use star symbol like in github)
4. The UI needs to be made attractive. (optional)
5. Search tab to search directly rather than copying link

So right now mySC.js includes both the code for (a) interacting with SoundCloud (getting info / playing actual song) and (b) interacting with our UI (managing the play / pause button getting clicked.

(a) and (b) should be split up. (a) should be placed into its own soundcloud-player.js module. It should include the key functions which should allow for anyone to include the <script> and grab info / play music.

• Separate mySC.js and soundcloud-player.js into two distinct files
• Make it so that soundcloud-player.js includes all the soundcloud related functions
• Write some unit tests for soundcloud-player.js
• Update the README.md with the appropriate changes as to how to use the API functions from the soundcloud-player.js module.

Instead of the user having to place an <iframe> in their HTML webpage, have our soundcloud-player.js insert the iFrame into the page, along with its accompanying style.

To be taken on after #3 is complete.