Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 7 of 7
  1. #1
    Regular Coder
    Join Date
    Jun 2002
    Posts
    113
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Determining variables from drop-downs

    Okay, I have a simple request, I think. I have a simple code to play wav files on my site, and I have it working with multiple occurences of the code so that for each wav file you see the player. However, not only is this cluttered, but it allows for multiple wav's to be playing at once which sounds bad. So instead of 12 player bars, I want to change to a drop down menu to select the wav, and then have a single player bar below the menu to play the currently selected track.

    the code I currently have is this:
    Code:
    <script language="JavaScript"><!--
    if(navigator.plugins.length>0){
    if (navigator.mimeTypes["audio/wav"] && navigator.mimeTypes["audio/wav"].enabledPlugin) document.write('<embed src="track01.wav" autostart="false" loop="0" controls="LargeConsole" width=180 height=35></embed>');}
    else {
    document.write('<embed src="track01.wav" autostart="false" loop="0" width=180 height=45></embed>');}
    
    //-->
    </script>
    Of course it is repeated for each track, with the source wav file changed. I would like to instead replace it with something like this;
    Code:
    <script language="JavaScript"><!--
    if(navigator.plugins.length>0){
    if (navigator.mimeTypes["audio/wav"] && navigator.mimeTypes["audio/wav"].enabledPlugin) document.write('<embed src="'+soundFile+'" autostart="false" loop="0" controls="LargeConsole" width=180 height=35></embed>');}
    else {
    document.write('<embed src="'+soundFile+'" autostart="false" loop="0" width=180 height=45></embed>');}
    
    //-->
    </script>
    Of course with this method, I have to set var soundFile somehow - and I would like to do it with a drop down menu; but I have never done that so would like suggestions on how to...

    Here is a list of what I would like to happen in the finished product: a drop-down menu has a list of tracks. Below it is the player bar to listen to the currently selected track. Whenever the 'play' button is pressed, it plays the track currently displayed in the drop-down menu; however if the menu is changed while playing, I don't want it to stop the music playing, nor change the music playing... only change the variable so that if the user stops the track, or lets it end, and then presses play again, the new choice is played.

    I'm not sure if I said that clearly enough; I am a bit tired...but anyway;

    Thanks for your help!
    Last edited by kargrafx; 07-05-2004 at 09:15 AM.

  • #2
    Kor
    Kor is offline
    Red Devil Mod Kor's Avatar
    Join Date
    Apr 2003
    Location
    Bucharest, ROMANIA
    Posts
    8,478
    Thanks
    58
    Thanked 379 Times in 375 Posts
    Try, for the beggining, something like this:

    PHP Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <
    html>
    <
    head>
    <
    script language="JavaScript"><!--
    function 
    sound(sel,soundFile){
    if(
    sel!=0){
    if(
    navigator.plugins.length>0){
        if (
    navigator.mimeTypes["audio/wav"] && navigator.mimeTypes["audio/wav"].enabledPlugin){ 
    document.getElementById('emb').innerHTML='<embed src="'+soundFile+'" autostart="false" loop="0" controls="LargeConsole" width=180 height=35></embed>';
        }
        else {
    document.getElementById('emb').innerHTML='<embed src="'+soundFile+'" autostart="false" loop="0" width=180 height=45></embed>';
        }
    }
    }
    }
    //-->
    </script>
    </head>
    <body>
    <div id="emb">
    </div>
    <select onchange="sound(this.selectedIndex,this.options[this.selectedIndex].text)">
      <option>--select track--</option>
      <option>track01.wav</option>
      <option>track02.wav</option>
      <option>track03.wav</option>
    </select>
    </body>
    </html> 
    KOR
    Offshore programming
    -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*

  • #3
    Regular Coder
    Join Date
    Jun 2004
    Posts
    565
    Thanks
    0
    Thanked 18 Times in 18 Posts
    You may also try this:

    Code:
    <html>
    	<head>
    		<script type="text/javascript">
    			window.onload = init;
    			function init() {
    				control = (navigator.mimeTypes["audio/wav"] && navigator.mimeTypes["audio/wav"].enabledPlugin) ? " controls='LargeConsole'": "";
    				url_select = document.forms["music"]["url"];
    			}
    			function startMusic() {
    				var selection = url_select[url_select.selectedIndex].value;
    				document.getElementById("player").innerHTML = (selection) ? "<embed src='" + selection + "'" + control + " autostart='true' loop='0' width='180' height='45'>" : "";
    			}
    		</script>
    	</head>
    	<body>
    		<form name="music">
    			<select name="url">
    				<option value="0">No music</option>
    				<option value="url_to_track1">track1</option>
    				<option value="url_to_track2">track2</option>
    			</select>
    			<input type="button" value="Play" onClick="startMusic();">
    			<div width="180" height="45" id="player"></div>
    		</form>
    	</body>
    </html>

  • #4
    Regular Coder
    Join Date
    Jun 2002
    Posts
    113
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thanks for the suggestions! I got it working, but now I have a second dillema. Most of the tracks I have are small, and load quickly enough on a high-speed connection to seem instant, and even on a dial-up seem fast; but a couple are larger, one is a full megabyte, and it takes about 3 seconds of waiting on a dial-up before the music starts, and then it plays faster than it loads, making it pause every few seconds. Is there a way to pre-load audio files, like you can pre-load images?

  • #5
    Banned
    Join Date
    Sep 2003
    Posts
    3,620
    Thanks
    0
    Thanked 0 Times in 0 Posts
    This is what I have done to preload:

    Code:
    <script type="text/javascript">
     <!--//
        function loadWavs(){
          var count = 0;
          var wav= new Array();
              wav[0] = "Denied.wav";
              wav[1] = "SecurityScan.wav";
              wav[2] = "Please.wav";
              wav[3] = "ThankYou.wav";
              wav[4] = "LetsDuitt.wav";
    
          while(count<wav.length){
            document.writeln('<div style="display:none">');
            document.writeln('<embed autostart="false" loop="false" hidden="true"');
            document.writeln('id="wav'+count+'" src="'+wav[count]+'">');
            document.writeln('</div>');
            count++;
          }
        }   window.onLoad = loadWavs();
     //-->
    </script>
    .....Willy

  • #6
    Regular Coder
    Join Date
    Dec 2003
    Location
    America
    Posts
    544
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Here's one i have used:

    Code:
    function playFile( file   ) {
    	if( document.all ){
    	document.all['sound1'].src = file  ;
    	}
    	else
    	{
    	document.embeds['sound2'].src = file  ;
    	}
    }
    Then to call the function, i do this:

    Code:
    <INPUT type=button  value="Play!" onclick="playFile(song.options[song.options.selectedIndex].value);"/>
    Finally, the actual drop down menu looks like this:

    Code:
    <SELECT name="song">
    
    <OPTION selected value="2001spce.mid">Space Oddesy
    <OPTION value="20fox.mid">20 Fox
    <OPTION value="90210v2.mid">90210
    <OPTION value="adam.mid">Adams Fam
    <OPTION value="apollo13.mid">Apollo 13
    <OPTION value="airwolf.mid> Air Wolf
    <OPTION value="baywatch.mid"> Baywatch
    <OPTION value="baywatch2.mid"> Baywatch 2
    
    <OPTION value="btfuture.mid"> B_toTheFuture
    <OPTION value="btfuture2.mid"> B_toTheFuture2
    <OPTION value="chicagobull.mid"> Chicagobull
    <OPTION value="dancewolf.mid"> Dancewolf
    <OPTION value="deepspace9.mid"> Deep Space 9
    <OPTION value="mimpossible.mid"> Mission Impssble
    <OPTION value="mkombat.mid"> Mortal Kombat
    <OPTION value="xfile.mid"> xfile
    </SELECT>
    That's about it.
    Last edited by SpiritualStorms; 07-08-2004 at 05:05 AM.
    LovesWar

  • #7
    Regular Coder
    Join Date
    Jun 2002
    Posts
    113
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thanks again for all the help, I think I have it up and running fine now!
    (which means a day or two before I figure out how it is broken, lol)


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •