Go Premium for a chance to win a PS4. Enter to Win

x
?
Solved

Playing Midi from a list

Posted on 1998-12-09
9
Medium Priority
?
238 Views
Last Modified: 2010-04-09
I have a pull down list of MIDI or WAV files for selecting.  Once the selection is made you press a play button to play the selected tune.  In a function, What is the syntax to play the selected file from the list?
0
Comment
Question by:MCSEMan
  • 5
  • 2
  • 2
9 Comments
 
LVL 12

Expert Comment

by:Otta
ID: 1840382
It sounds like you need <FORM> processing,
and a 'SUBMIT' button relabelled as 'Play'.

Code like the following copied/edited
from WWW.ALTAVISTA.COM, could be a starting-point:

<FORM method="GET" action="/cgi-bin/player">
Folk-song player -- select a country:
<SELECT NAME="kl">
<OPTION VALUE="da">Danish
<OPTION VALUE="fi">Finnish
<OPTION VALUE="is">Icelandic
<OPTION VALUE="no">Norwegian
<OPTION VALUE="sv">Swedish
</SELECT>
<INPUT TYPE="submit" VALUE="Play">
</FORM>

will setup for the "pull-down",
and will submit the selected value to the CGI program.
The program could return an HTML page,
which contains the appropriate <EMBED> command.




0
 
LVL 3

Expert Comment

by:bigelos
ID: 1840383
Take a look at
http://www.geocities.com/PicketFence/2400/jukebox/jukebox.html

and

http://www.geocities.com/CapeCanaveral/Launchpad/5545/Fjukebox.html

This will do more of what you are asking...
Copied from
http://www.experts-exchange.com/topics/comp/www/html/Q.10100661
with a slight correction...

<html>

<head>
<title></title>
<script language="JavaScript">
      <!--
      ns = (navigator.appName == "Netscape");
      loaded = false;
      runningNow = null;
      function play() {
        if (!document.embeds) return;
        if (loaded) {
          stop();
          sound = document.jukeForm.songs.options[document.jukeForm.songs.selectedIndex];
          s = document.embeds[sound.value];
          if (ns)
            s.play(false);
          else
            s.Run();
          runningNow = s;
          setText("Sound \"" + sound.text + "\" started");
        }
      }
      function stop() {
        if (runningNow == null) {
          setText("No song is currently being played");
          return;
        }
        if (ns)
          runningNow.stop();
        else
          runningNow.stop();
        runningNow = null;
        setText("Jukebox stopped");
      }

      function setText(text) {
        if (document.layers) {
          document.layers[0].document.open();
          document.layers[0].document.write(text);
          document.layers[0].document.close();
        }
        else if (document.all)
          d.innerHTML = text;
        else
          status = text;
      }
      // -->
      </script>
</head>

<body onload="loaded=true">

<form name="jukeForm">
  <p><select name="songs" size="1">
    <option value="jukebox1.wav">Sound 1 </option>
    <option value="jukebox2.wav">Sound 2 </option>
    <option value="jukebox3.wav">Sound 3 </option>
  </select> <input type="BUTTON" value="Start" onclick="play()"> <input type="BUTTON"
  value="Stop" onclick="stop()"> </p>
</form>
<div name="d"></div><LAYER>
</LAYER>
<script language="JavaScript">
      <!--
      f = document.jukeForm.songs;
      for (i=0;i<f.options.length+1;i++) {
        src = f.options[i].value;
        document.write('<EMBED SRC="' + src + '" HIDDEN="TRUE" AUTOSTART="FALSE"
      LOOP="FALSE" NAME="' + src + '">');
      }
      // -->
      </script>

</body>
</html>

0
 

Author Comment

by:MCSEMan
ID: 1840384
In this example, all of the sound files are loaded when the page is.  I am looking for a fast loading page that I can have a list of (let's say) 20 MIDI files listed.  And when ONE is selected, ONE is loaded and played.  Also, by copy and paste of this answer into a new page (with file name changes), errors are returned. Unterminated string constant... and d is undefined.

PS.  PicketFence generates errors... the other is not a drop list.

Is There An Answer?
0
What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

 
LVL 3

Accepted Solution

by:
bigelos earned 150 total points
ID: 1840385
The other is not a drop list, but it can be easily implemented as such.  Just a few code changes, etc.  If you look at the coding, it is *VERY* similiar to the code posted above.

However, I have another solution for you.  Bear in mind that it is not a drop list, but can *easily* be implemented as such.  I will change it if requested, but the idea is there.

Take a look at
http://members.tripod.com/~HTML_Expert/midi_player/Player_PopUp.html
and

http://members.tripod.com/~HTML_Expert/midi_player/1mid.html


0
 
LVL 3

Expert Comment

by:bigelos
ID: 1840386
I now have the dropbox form completed.  It just needs to be uploaded.
0
 
LVL 12

Expert Comment

by:Otta
ID: 1840387
> I am looking for a fast loading page
> the other is not a drop list.

The code proposed by OTTA seems to satisfy both requirements.

If it doesn't, please explain why.
0
 
LVL 3

Expert Comment

by:bigelos
ID: 1840388
Otta,

Your code requires CGI -- not hard but not always available.

MCSEman,
The dropbox is at
http://members.tripod.com/~HTML_Expert/midi_player/Player_Dropbox.html

Please ignore the tripod pop up advertisements.  Right now, the midiplayer pops up in a seperate window.  If you don't want that, just look at
http://members.tripod.com/~HTML_Expert/midi_player/1mid_drop.html

-bigelos
0
 

Author Comment

by:MCSEMan
ID: 1840389
Bigelos
Your example on Tripod worked fine.  My intention was not to build a page for every song that I had but this example will work for me, which is MUCH better than any other item that I have found on the web.  Most places that I visit, an error occurs on their web page... and I did not want that to happen on any of my pages. You have given me a soloution that will work fine (or perhaps better than I had planned ) for my purpose.  I would like to discuss this further with you if at all possible.  Let me know how.
0
 
LVL 3

Expert Comment

by:bigelos
ID: 1840390
This is as good as a forum as any for discussion.  I'm posting the code here just for reference for anyone that "buys" the question later.  Player_Dropbox.html has javascript that calls 1mid_drop.html.  1mid_drop.html can call any other file....

Player_Dropbox.html
<html>
<head>
<title>Midi Player PopUp</title>
<SCRIPT>
 window.open('1mid_drop.html','MidiPlayer','WIDTH=150 HEIGHT=300','toolbar=0,location=0,directories=0,status=0,menubar=0,scrollbars=0,resizable=1,copyhistory=0');
</SCRIPT>
</head>
Put your page here....

You will have to look at 1mid.html, 2mid.html, 3mid.html, and 4mid.html as well.  
In addition, you will have to change the refresh tag to coincide with your sounds.
</html>


1mid_drop.html
<html>
<head>
<meta http-equiv="refresh" content="96; url=2mid_drop.html">
<title>Welcome</title>
<bgsound hidden="true" src="action3.mid">
</head>
<body bgcolor="#000000" text="#FFF000" alink="#FFFFFF" vlink="#808080">
<p><br>
<form NAME="Form1" method="post" action="">
<select name="songs" size="1">
    <option value="1mid_drop.html">Welcome</option>
    <option selected value="2mid_drop.html">Jesse James</option>
    <option value="3mid_drop.html">Edo Bridge</option>
    <option value="4mid_drop.html">Eroica</option>
</select>
<input type="button" value="Play" OnClick="location=songs.options[songs.selectedIndex].value"></p>
</form>
<br>
Choose a song to play or just let them play in sequence. Close this window to shut music
off.<br>
</p>
<hr>
<embed src="action3.mid" width="107" hidden largeconsole="true" height="49"
autostart="true" loop="true">
</EMBED>
Now Playing Welcome
</body>
</html>


2mid_drop.html
<html>
<head>
<meta http-equiv="refresh" content="37; url=3mid_drop.html"></a>
<title>Jesse James</title>
<bgsound src="Jesse_James.mid" hidden="true">
</head>
<body bgcolor="#000000" Text="#FFF000" ALINK="#FFFFFF" VLINK="#808080">
<br>
<form NAME="Form1" method="post" action="">
<select name="songs" size="1">
    <option value="1mid_drop.html">Welcome</option>
    <option value="2mid_drop.html">Jesse James</option>
    <option selected value="3mid_drop.html">Edo Bridge</option>
    <option value="4mid_drop.html">Eroica</option>
</select>
<input type="button" value="Play" OnClick="location=songs.options[songs.selectedIndex].value"></p>
</form>
<br>
Choose a song to play or just let them play in sequence. Close this window to shut music
off.<br>
<hr>
<embed src="Jesse_James.mid" width=200 hidden="true" largeconsole=true height=200 autostart=true loop=true></embed>
Now Playing Jesse James
</body>
</html>
0

Featured Post

Free Tool: Path Explorer

An intuitive utility to help find the CSS path to UI elements on a webpage. These paths are used frequently in a variety of front-end development and QA automation tasks.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

Question has a verified solution.

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

Finding original email is quite difficult due to their duplicates. From this article, you will come to know why multiple duplicates of same emails appear and how to delete duplicate emails from Outlook securely and instantly while vital emails remai…
Q&A with Course Creator, Mark Lassoff, on the importance of HTML5 in the career of a modern-day developer.
In this Micro Tutorial viewers will learn how to create navigation buttons that change on rollover, using CSS (Continuation of the CSS Image Sprite tutorial) Create a parent ID for all the list items       - Specify position: absolute and display: block…
In this tutorial viewers will learn how to embed videos in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: "<!DOCTYPE html>": Use the <video> tag to insert a video. Define the src as the URL of your video; this is similar to …

971 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