Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people, just like you, are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
Solved

javascript cross browser element array like getElementsByTagName

Posted on 2007-04-01
5
451 Views
Last Modified: 2013-11-19
Hi,

I am trying to provide a number of audio files for streamin playback, the files are .swf. Since there will be multiple <EMBED> tags my 1st problem was that all tracks could be played at the same time, and despite setting the autostart property to false all of the embedded sounds played on page load. I read that to prevent this to use the following javascript in body onload: document.elementid.rewind(). This indeed worked and nothing plays now till document.elementid.play() is called.

Now, since the embed tags are dynamically generated there could be any number of them, i needed a way to stop any playing track before starting another and i wrote these functions:

function stop_all()
      {
      //stop any other tracks
      var arrEmbedArray=document.getElementsByTagName("embed");
      for(var i=0;i<arrEmbedArray.length;i++)
            {
            arrEmbedArray[i].rewind()
            alert(i)
            }
      }

function start_track(strEmbedID)
      {
      stop_all()
      //start selected track
      var objCurrentEmbed=document.getElementById(strEmbedID);
      objCurrentEmbed.play()
      }

Really i wanted an "if" in the loopin stop_all() so the rewind is only called for the one playing track but i couldn't find a way so it is being called for each and every embed element, i'd like to change this but it works... Well, it's working in IE, but not in netscape, firefox, or opera. The alert in the loop was to test the loop was running and it isnt running in any other browser than IE.

I read that getElementsByTagName is supported as follows: IE v5 +, Firefox v1 + and opera v9 +. I think i may need to do things differently for these browsers, hope someone can help! thanks all.

0
Comment
Question by:s1desh0w
  • 3
  • 2
5 Comments
 
LVL 26

Expert Comment

by:DireOrbAnt
ID: 18834238
Why don't you keep the current track and change like this:

var CurrentEmbedID = '';

function stop_track()
      {
       if (CurrentEmbedID != '')
        {
         document.getElementById(CurrentEmbedID).rewind();
         CurrentEmbedID = '';
        }
      }

function start_track(strEmbedID)
      {
      stop_track();
      //start selected track
      CurrentEmbedID = strEmbedID;
      document.getElementById(CurrentEmbedID).play()
      }
0
 

Author Comment

by:s1desh0w
ID: 18836123
yes, thanks, i did think of keeping the current track as a global var after making the post, i havnt tried it yet, i will let you know if that works, more importantly will this work cross browser because there is some problem in all browsers except ie that is preventing the code in my for loop from running (getElementsByTagName). In addition all tracks will play onload unless i call .rewind() for each one onload as well, thats what stop_all() is doing, so i should keep this function as is?

thanks for your help
0
 
LVL 26

Accepted Solution

by:
DireOrbAnt earned 125 total points
ID: 18838511
I see now, are those Flash movies? getElementsByTagName works on IE and all others. The issue here is that IE will "hide" the embed tag from the DOM tree if it's inside an object tag (like flash movies should be if you use embed). Another option is to use getElementsByClassName, get the function here:
http://www.robertnyman.com/2005/11/07/the-ultimate-getelementsbyclassname/

And the give all embeds AND objects a class="MyClips" or something...
0
 

Author Comment

by:s1desh0w
ID: 18854725
i've used a workaround to get round this problem by using the following javescript to write the flash object to a <div> from an onclick event: It saves having to stop the tracks on load and on play.

function start_track(strEmbedSource)
      {
      objLayer=document.getElementById("obj_layer")
      objLayer.innerHTML='<OBJECT classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" WIDTH=0 HEIGHT=0><PARAM NAME=movie VALUE="' + strEmbedSource + '" /><PARAM NAME=loop VALUE=false /><PARAM NAME=volume VALUE=100 /><PARAM NAME=quality VALUE=high /><EMBED src="' + strEmbedSource + '" loop=false volume=100 quality=high width=0 height=0 hidden=true type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash"></embed></object>'
      }

the only problem i have remaining is that in the same way as setting <param name=autostart value=false> doesnt prevent these files from playing on load, setting <param name=loop value=false> doesnt prevent the track from looping either. as you can see from the code above i have included these values in both the param name and the embed tag, the files by the way are only audio but converted from mp3 to swf at a lower quality to save bandwidth on streaming, i used MP3 Stream trial version to do this, thanks again for ure help.
0
 

Author Comment

by:s1desh0w
ID: 18854728
p.s. i will award the points for your previous answer tho since i believe it would solve my original problem. cheers
0

Featured Post

The New “Normal” in Modern Enterprise Operations

DevOps for the modern enterprise offers many benefits — increased agility, productivity, and more, but digital transformation isn’t easy, especially if you’re not addressing the right issues. Register for the webinar to dive into the “new normal” for enterprise modern ops.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Nothing in an HTTP request can be trusted, including HTTP headers and form data.  A form token is a tool that can be used to guard against request forgeries (CSRF).  This article shows an improved approach to form tokens, making it more difficult to…
This article discusses how to create an extensible mechanism for linked drop downs.
The viewer will receive an overview of the basics of CSS showing inline styles. In the head tags set up your style tags: (CODE) Reference the nav tag and set your properties.: (CODE) Set the reference for the UL element and styles for it to ensu…
In this fifth video of the Xpdf series, we discuss and demonstrate the PDFdetach utility, which is able to list and, more importantly, extract attachments that are embedded in PDF files. It does this via a command line interface, making it suitable …

839 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