Solved

Propagating mouse clicks through an object

Posted on 2011-09-28
15
382 Views
Last Modified: 2012-05-12
I'm using an audio player that was implemented with Flash. It displays the selections available and when you click one it begins playing.  I would now also like to show the words for the song when it plays.  But since I don't have access to the Flash code I can't intercept the mouse click and have it display the words.  If I put another object over the player, where I can detect mouse clicks, I block the mouse clicks from being seen by the player and the player doesn't respond by playing the song.  

Does anyone see a way to display the song words when I click the song in the player?

Thanks for any ideas.
Steve
0
Comment
Question by:steva
  • 8
  • 6
15 Comments
 
LVL 29

Expert Comment

by:dgofman
ID: 36720569
Steve, is that possible to share your existing code. I will prefer to get FLA file for reproducing your problem
0
 

Author Comment

by:steva
ID: 36720620
You can see the page at  http://www.upayahouse.com/music/Poets/poets.php .  Since the player is from a third party I don't have the FLA. And anyway, I want the words to appear in a different part of the page than the player.  It seems that what I need is a way to propagate the "click" event to other objects in the DOM, as well as to the player..  
0
 
LVL 29

Expert Comment

by:dgofman
ID: 36720679
What words do you want to display when is playing?
0
 

Author Comment

by:steva
ID: 36720690
I want to display the words to the song that is currently playing. And I would like them to appear in the area below the player.
0
 
LVL 29

Expert Comment

by:dgofman
ID: 36720698
so, you want to display the subtitles (words of the song) how you will synchronize with a music?
0
 

Author Comment

by:steva
ID: 36741861
I just want all the words of the song to be visible while that song is playing.  So if you select the first song in the player it begins playing and a box appears that contains all of the lyrics to that song.
0
 
LVL 29

Expert Comment

by:dgofman
ID: 36813086
if you will set flashvar variable to autoLoad=false (instead true) you will able to get events to JavaScript functions

Add these functions

function onMediaStart(){
            alert("onMediaStart");
      }

      function onMediaStop(){
            alert("onMediaStop");
      }
      
      function onMediaPause(){
            alert("onMediaPause");
      }

and modify flashvars to

fontSize=large&strokeColor=000000&playlistXmlPath=playlist.xml&autoPlayNext=false&autoLoad=false
0
Highfive + Dolby Voice = No More Audio Complaints!

Poor audio quality is one of the top reasons people don’t use video conferencing. Get the crispest, clearest audio powered by Dolby Voice in every meeting. Highfive and Dolby Voice deliver the best video conferencing and audio experience for every meeting and every room.

 

Author Comment

by:steva
ID: 36814654
dgofman,

Thanks.  What you wrote looks interesting.  But instead of "onMediaStart()" I think I need something like "onTrack1Sart()", "onTrack2Start()".   If you look at the page again since I added some things - http://www.upayahouse.com/music/Poets/poets.php - you can see the effect I'm after.  But instead of clicking the external box to the right of the selection I'd like to be able to have the words appear when the song is selected in the player.
0
 
LVL 29

Expert Comment

by:dgofman
ID: 36816213
That player doesn't such function call onTrack1Sart, onTrack2Start :)
I gave you API of the player how you can track when song starts
0
 

Author Comment

by:steva
ID: 36816681
So it looks like I need to go a different route, or maybe stay with what I have so far.

Just curious, how did you determine what functions were available in the PremiumBeat player?
0
 
LVL 29

Expert Comment

by:dgofman
ID: 36817026
You have three options
1) wait if someone give you better example
2) modify playlist.xml to some servlet what will registered on the backend the last user request to the file (for example using Java servlet) and when you will get JavaScript call make a request to the server using AJAX to get user selected file name
3) Accept my answer #36813086, because I gave you an answer how to "Propagating mouse clicks through an object" (intercept) and open a new thread "How to determinate selected song name?
And in this thread I will give you another solution how you can listen dispatch events from your player without using JavaScript and any servlets. It takes for me to go to different direction what I implemented now. That reason why I would like to split this question.
0
 

Author Comment

by:steva
ID: 36853764
Your 36813086 response did not answer my question.  It described a way  to sense when the media starts, stops, or pauses,  but this is not the same as propagating through the mouse click, with all of its parameters, including its x and y values, which I need to determine the actual selection.  

If you describe a way to determine which song was clicked I'll be glad to give you the points.

 
0
 

Accepted Solution

by:
steva earned 0 total points
ID: 37051471
I have solved this myself.  I purchased the Longtail JW player which has excellent documentation and excellent support. With this player  I was able to receive and process the end-of-track events and synchronize the music to the words.
0
 

Author Closing Comment

by:steva
ID: 37075000
Sorry for not giving out the points but I had to eventually solve this myself.
0

Featured Post

IT, Stop Being Called Into Every Meeting

Highfive is so simple that setting up every meeting room takes just minutes and every employee will be able to start or join a call from any room with ease. Never be called into a meeting just to get it started again. This is how video conferencing should work!

Join & Write a Comment

This article discusses four methods for overlaying images in a container on a web page
Boost your ability to deliver ambitious and competitive web apps by choosing the right JavaScript framework to best suit your project’s needs.
The viewer will learn how to create a basic form using some HTML5 and PHP for later processing. Set up your basic HTML file. Open your form tag and set the method and action attributes.: (CODE) Set up your first few inputs one for the name and …
In addition to being a great web-based presentation tool, Prezi also makes it easy to save your presentation as a PDF to share with others as well. Learn how in this tutorial. Select the share icon from the top menu in your Prezi editor: Select "D…

760 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

20 Experts available now in Live!

Get 1:1 Help Now