Link to home
Start Free TrialLog in
Avatar of Paul Konstanski
Paul KonstanskiFlag for United States of America

asked on

Do a default load for AngularJS soundmanager2 - passed thru query string.

I am trying to figure out how this Sound Player works.  
Raw Files for Sound Manager 2 - angular

I can get this working fine on my server, but I'm new to Angular and need some help getting something to work.

First load this example:
working example

You'll see that this has a list of songs that you must "add" to the player for it to play.

What I'm looking to do is get rid of the "song list" on the top of this page and instead pass a song ID through a query string to have that song play.

So for example, I would send: http://perminder-klair.github.io/angular-soundmanager2/example.html?id=one and it would then play the "rain" song which has ID of one.  
 
I would also like this to "auto-play" upon load. So the progress bar and buttons would appropriately reflect that it was playing.

In summary. I want to do two things:

1) Be able to pass the sound I want to play via a query string.
2) Be able to have that sound autoplay upon load.

Thanks.
Avatar of Julian Hansen
Julian Hansen
Flag of South Africa image

What I'm looking to do is get rid of the "song list" on the top of this page and instead pass a song ID through a query string to have that song play.
I don't understand what you mean by "send" - send where?

Can you elaborate on this bit.
Avatar of Paul Konstanski

ASKER

By "send" I mean, that the custom URL will "send" a song ID to the browser so that song is loaded.  So I'm not technically "sending" it anywhere to be recorded.  The better word would have been "passed."

Maybe this explains it better.

Current Model
  1. Five sounds are presented at the top of the page.
  2. User manually adds on or more songs to the queue for the playlist.
  3. When you hit the "play" button it then loads the first song and plays it. All controls now manage that individual song.
  4. Upon completion the next sound plays.

Desired Model
  1. Pass an ID through the url that indicates which sound from the playlist to load. (e.g. example.html?id=one would call up the first sound).
  2. Have that passed sound value call up the individual sound to play.

So basically I want to create a one-song player in which the song can be assigned by passing a url value.

Does that make sense?
SOLUTION
Avatar of Julian Hansen
Julian Hansen
Flag of South Africa image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
What I am asking is how do I  change this example script so that It receives the song ID from the URL and  acts as a player for that single song.

An example of usage would be if The URL link is then sent to a user via an email. When they click the link in the email, it will open a browser and then play that single song/sound. They would have the controls to stop and start but would not have to pick the song from a list like the script currently requires.

So step one in changing the script is for it to read which song to play for the URL.
The second change is to begin auto playing that song.
ASKER CERTIFIED SOLUTION
Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
There probably is a better way using Angular, but for now this works.
Remember Angular is a framework for writing Single Page Applications - that is where the magic of Angular comes to the fore. With respect to things like the sound manager I doubt Angular has a solution that is any better than going a plain scripted route.
Some day I may revisit this dialog to see how to put what I did actually into the Angular Context.