Link to home
Start Free TrialLog in
Avatar of p_delmas
p_delmas

asked on

play sound with JavaScript in MSIE 4.0

I would like to play a WAV or MIDI file in Internet Explorer 4.0 with JavaScript Code. I've designed a HTML page to make a game and I want to play a "winner" sound when the game is succeeded (excuse my bad english ...).
Thank You !
Avatar of tecbuilder
tecbuilder

This script will work on MSIE or NS 4.x.  Note:  This is an updated script for LiveUpdate that just came out this month.  The old script doesn't work with NS 4.x.  Put this script in the heading on your page.

<SCRIPT LANGUAGE="JavaScript">
<!--

// Script to generate proper tags for MIDI playing, preferably with Crescendo.
// Note: spaces inside quotes *are* significant and should not be deleted.
// Version 1.2 -- See http://www.liveupdate.com/playmidi.html.

function PlayMIDI(SongURL) // Copyright (C) 1996, 1997 LiveUpdate division of LABTECH
                           // Permission for use granted to all music lovers on the net
                           // Now including playlist & other Crescendo Version 3.0 support
{
  var WriteLegend = "yes"        //  Change to "no" if you don't want legend.
  var PlayIfNoCrescendo = "no"   // Change to "yes" to try to play if Crescendo is not present.
  var NotCrescendo = "You don't have Crescendo, the <B>only</B><BR>" +
        "streaming MIDI player for the web.<BR>" +
        "<B><A HREF='http://www.liveupdate.com/dl.html'>Download Crescendo now</A> -- it's free!</B>"
  var CrescendoIsPresent = "no"
  var CrescendoIndex = 0
  var SongIndex = 1
  var CrescendoVersion = ""
  var Legend = ""
  var DocString = ""
  var args = PlayMIDI.arguments

  document.open();
  if (navigator.appName == "Netscape") {                  // Find out if the browser is Navigator.
    var NSMajorVersion = navigator.appVersion.charAt(0)   // Find major version number.
    if (NSMajorVersion > "2") {                           // Is major version greater than 2?
      // This is version 3 of Netscape (or greater).
      // See if Crescendo is present.
      for (var i = 0; i < navigator.plugins.length; i++) {
        if (navigator.plugins[i].name.substring(0,20) == "LiveUpdate Crescendo") {
          CrescendoIsPresent = "yes"
          CrescendoIndex = i
          CrescendoVersion =
            navigator.plugins[i].name.substring(21,navigator.plugins[i].name.length)
          break
          }
      }
      if (CrescendoIsPresent == "yes") {
        if (navigator.plugins[CrescendoIndex][0].type == "music/crescendo") {
          // This is version 2.3 of Crescendo or greater.
          DocString = '<EMBED TYPE="music/crescendo" '
          // Set the following to to "true" _only_ if you need to control Crescendo
          // through LiveConnect.  In most cases, this should be left as "false".
          DocString = DocString + 'JAVA="false" '
          DocString = DocString + 'RANDOM="false" '
          DocString = DocString + 'SONG="' + SongURL + '" '
          if (args.length > 1)
              for (var i = 0; i < args.length; i++) {
                 DocString = DocString + "SONG" + (i+1) + "=" + '"' + args[i] + '" ' }
          Legend = "This is Crescendo " + CrescendoVersion
                   //  " running on Netscape " + NSMajorVersion
          if (CrescendoVersion.length > 5)
             Legend = Legend + " with auto-detach."
        } else {
          // This is a pre-2.3 version of Crescendo.
          DocString = '<EMBED SRC="' + SongURL + '" '
          Legend = "This is a pre-2.3 version of Crescendo -" +
            " running on Netscape " + NSMajorVersion + ".<BR>" +
            "<B><A HREF='http://www.liveupdate.com/dl.html'>Upgrade Crescendo now</A> -- it's free!</B>"
        }
      } else {
        if (PlayIfNoCrescendo == "yes") {
          // This is some other plug-in besides Crescendo, so use MIME type to load the first
          // MIDI plug-in that matches the file's MIME type or, if the file MIME type is
          // not matched by any plug-in, Mplayer.exe will be OLE-embedded on Windows.
          DocString = '<EMBED SRC="' + SongURL + '" '
        }
        Legend = NotCrescendo
      }
    } else {
      // This is version 2 of Netscape, so use MIME type to load the first
      // MIDI plug-in that matches the file's MIME type or, if the file MIME type is
      // not matched by any plug-in, Mplayer.exe will be OLE-embedded on Windows.
      DocString = DocString + 'SRC="' + SongURL + '" '
      // Legend = "This could be any MIDI plug-in, or the Windows Media Player."
      Legend = NotCrescendo
    }
    if (DocString.substring(0,6) == "<EMBED") {
      DocString = DocString + 'PLUGINSPAGE="http://www.liveupdate.com/dl.html" '
      DocString = DocString + 'HEIGHT=55 WIDTH=200 '   // Use HEIGHT=2 WIDTH=0 for invisible.
      // Optional Crescendo parmeters -- See http://www.liveupdate.com//cpauth.html for docs.
      // DocString = DocString + 'AUTOSTART="false" ' // Uncomment this for no autostart.
      // DocString = DocString + 'DELAY=5 '           // Uncomment this for start delay (5 s).
      // DocString = DocString + 'BGCOLOR="#000000" ' // Uncomment this for black color.
      DocString = DocString + 'DETACH="true" '     // Uncomment this for auto-detach.
      DocString = DocString + '>'
    }

  } else {   // Find out if the browser is Microsoft Internet Explorer 3.0 or greater.
    if (navigator.appName == "Microsoft Internet Explorer") {
       // Load the ActiveX version of Crescendo or Crescendo PLUS if it's installed.
          DocString = '<OBJECT ID=Crescendo '
          DocString = DocString + 'CLASSID="clsid:0FC6BF2B-E16A-11CF-AB2E-0080AD08A326" '
          var NSMajorVersion = navigator.appVersion.charAt(0)   // Find major version number.
          if (NSMajorVersion > "3") {                           // Is major version greater than 3?
              DocString = DocString + 'CODEBASE="http://activex.liveupdate.com/controls/cres.cab#Version=3,0,0,70" ' }          
          else {
              DocString = DocString + 'CODEBASE="http://activex.liveupdate.com/controls/cres.cab#Version=2,3,0,35" ' }
          DocString = DocString + 'HEIGHT=55 '
          DocString = DocString + 'WIDTH=200>'
          DocString = DocString + '<PARAM NAME="RANDOM" VALUE="false">'
          DocString = DocString + '<PARAM NAME="Song" VALUE="' + SongURL + '">'
          if (args.length > 1)
              for (var i = 0; i < args.length; i++) {
                 DocString = DocString + '<PARAM NAME="SONG' + (i+1) + '" VALUE="' + args[i] + '"> ' }
          // Optional parmeters -- See http://www.liveupdate.com//cpauth.html for docs.
          // DocString = DocString + '<PARAM NAME="AUTOSTART" VALUE="false">'
          // DocString = DocString + '<PARAM NAME="DELAY" VALUE="5">'
          // DocString = DocString + '<PARAM NAME="BGCOLOR" VALUE="#000000">'
          DocString = DocString + '<PARAM NAME="DETACH" VALUE="true">'

          // If the ActiveX Crescendo is not installed, this EMBED tag will cause MSIE
          // to load any Netscape plug-in that is associated with *.MID files.
          // The browser will only "see" this EMDED tag if the ActiveX Crescendo is not
          // registered.  This is for versions of MSIE that don't see <OBJECT> but do see <EMBED>.
          DocString = DocString + '<EMBED SRC="' + SongURL + '" '
          DocString = DocString + 'PLUGINSPAGE="http://www.liveupdate.com/dl.html" '
          DocString = DocString + 'HEIGHT=55 WIDTH=200>'
          DocString = DocString + '</OBJECT>'  // Close the OBJECT tag.
        Legend = "This is Crescendo - running on Microsoft with auto-detach."
    } else {

      // The browser may be Netscape 1.x, or MSIE 2.0, or some other browser.  For MSIE 2.0,
      DocString = DocString + '<BGSOUND SRC="' + SongURL + '">' + '<BR>'
      }
  }
  DocString = DocString + "\n"
  document.write(DocString)
  // Write legend.
  if (WriteLegend == "yes")  document.write("<BR><FONT SIZE=-1>" + Legend + "</FONT>")
  document.close()
}
//-->

</SCRIPT>

To send a midi file to play use the script below.

<SCRIPT LANGUAGE="JavaScript">
<!--
  PlayMIDI("yourfilename.mid");
//-->
</SCRIPT>

You can also use the <embed> tag to play a sound which will also work on MSIE.  Below is the script to set the <embed> tag up and a way to use it.

<HTML>
<HEAD>
<SCRIPT LANGUAGE=JavaScript>
<!-- Hide JavaScript from older browsers
function playDeferredSound() {
   document.firstsound.play(false, 'http://sound1.wav');
}
// -->
</SCRIPT>
</HEAD>
<BODY>
<EMBED SRC="stub1.wav" HIDDEN=TRUE NAME="firstsound" MASTERSOUND>
<A HREF="javascript:playDeferredSound()">Load and play the sound</A>
</BODY>
</HTML>
Avatar of p_delmas

ASKER

"Proposed answer" works, but the current HTML page disapears when the "PlayMIDI" function is called. HTML page becomes white !

"Comment" solution doesn't work and produce an error

I would like to keep the current page on the screen. Thank You
This script goes in the body, my apologies for not making that clear.  I use this on many of my pages.  As for the comment that I added, that came right out of the JavaScript Guide, so I'm not sure why this didn't work.

<BODY>
<SCRIPT LANGUAGE="JavaScript">
<!--
  PlayMIDI("yourfilename.mid");
//-->
</SCRIPT>
</BODY>
It still does'nt work ...
When mouse pointer is over the link, music plays, but in a new page !

Her is my HTML code, can you try whith it please ?
Thank You


<html>

<head>
<meta http-equiv="Content-Type"
content="text/html; charset=iso-8859-1">
<meta name="GENERATOR" content="Microsoft FrontPage Express 2.0">
<title>Game</title>
</head>

<body>
<script language="JavaScript">
var son='<embed src="quizz2.mid" hidden="true" autostart="true">';
function playMIDI()
{
      document.open();
      document.write(son);
      document.close();
}
</script>

<p><a href="menu.htm" onmouseover="playMIDI()">test</a> </p>
</body>
</html>

Oh, you didn't say you wanted this for an onMouseOver event.  That makes a difference.  The scripts I gave you won't work for an onMouseover event because they expect everything to already be loaded to the browser window.  The playMidi function isn't loaded until after the browser already has written it's contents.  Hence the reason this went to a new window.

I or someone will be along with an answer for you.  I'll have to do a bit of looking for this one.
ASKER CERTIFIED SOLUTION
Avatar of kollegov
kollegov

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