[Contents] [Previous] [Next] [Index]

Appendix D
LiveAudio and LiveConnect

LiveAudio is LiveConnect aware. This appendix describes how you use JavaScript to control embedded LiveAudio elements.

Using LiveConnect, LiveAudio, and JavaScript, you can:

Essentially, any event that can be described programmatically using the already rich JavaScript framework can trigger a sound event.

JavaScript Methods for Controlling LiveAudio

LiveAudio provides the following major JavaScript controlling methods. For these methods to be available to JavaScript (and the web page), you must embed a LiveAudio console (any console will do, it can even be hidden) somewhere on your page.

The following JavaScript state indication methods do not control the LiveAudio plug-in, but they give you information about the current state of the plug-in:

Using the LiveAudio LiveConnect Methods

One example of using JavaScript to control a LiveAudio plug-in is to have JavaScript play a sound. In the following example, all of the HTML is needed to make the plug-in play a sound.

<HTML>
<BODY>
<EMBED SRC="sound1.wav"
   HIDDEN=TRUE>
<A HREF="javascript:document.embeds[0].play(false)">
Play the sound now!</A>
</BODY>
</HTML>
The preceding method of playing a sound file is probably the simplest, but can pose many problems. If you are using the document.embeds array, Navigator 2.0 will generate an error, because the embeds array is a Navigator 3.0 feature. Rather than use the embeds array, you can identify the particular <EMBED> tag you would like to use in JavaScript by using the NAME and MASTERSOUND attributes in your original <EMBED> tag, as follows:

<HTML>
<BODY>
<EMBED SRC="sound1.wav"
   HIDDEN=TRUE
   NAME="firstsound"
   MASTERSOUND>
<A HREF="javascript:document.firstsound.play(false)">
Play the sound now!</A>
</BODY>
</HTML>
This is a much more descriptive way to describe your plug-in in JavaScript, and can go a long way towards eliminating confusion. If, for example you had several sounds embedded in an HTML document, it may be easier for developers to use the NAME attribute rather than the embeds array. In the preceding example, notice that the MASTERSOUND attribute in the <EMBED> tag is used. This is because any time a NAME attribute is used referencing LiveAudio, an accommodating MASTERSOUND tag must be present as well.

Another common example of using LiveConnect and LiveAudio is to defer loading a sound until a user clicks the "play" button. To do this, try the following:

<HTML>
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
<!-- Hide JavaScript from older browsers
function playDeferredSound() {
   document.firstsound.play(false,
      'http://url_to_new_sound_file/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>
The stub file, stub1.wav, is loaded relatively quickly. (For a description of how to create a stub file, see the EmeraldNet LiveAudio information at http://emerald.net/liveaudio/.) The play method then loads the sound file only when it is called. Using this example, the sound file is loaded only when the user wants to hear it.

Web designers might want to create entire new interfaces with LiveConnected LiveAudio. To create an alternate console for sound playing and interaction, a designer might do the following:

<HTML>
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
<!-- Hide JavaScript from older browsers
function playSound() {
   document.firstSound.play(false);
}
function pauseSound() {
   document.firstSound.pause();
}
function stopSound() {
   document.firstSound.stop();
}
function volup() {
   currentVolume = document.firstSound.GetVolume();
   newVolume = (currentVolume + 10);
   if (document.firstSound.GetVolume() == 100) {
      alert("Volume is already at maximum");
   }
   if (newVolume < 90) {
      document.firstSound.setvol(newVolume);
   }
   else
   {
      if ((newVolume <= 100) && (newVolume > 90)) {
         document.firstSound.setvol(100);
      }
   }
}
function voldown() {
   currentVolume = document.firstSound.GetVolume();
   newVolume = (currentVolume - 10);
   if (document.firstSound.GetVolume() == 0) {
      alert("Volume is already at minimum");
   }
   if (newVolume > 10) {
      document.firstSound.setvol(newVolume);
   }
   else {
      if ((newVolume >= 0) && (newVolume < 10)) {
         document.firstSound.setvol(0);
      }
   }
}
// -->
</SCRIPT>
</HEAD>
<BODY>
<EMBED 
   SRC="sound1.wav"
   HIDDEN=TRUE
   AUTOSTART=FALSE
   NAME="firstSound"
   MASTERSOUND>
<P><A HREF="javascript:playSound()">Play the sound now!</A></P>
<P><A HREF="javascript:pauseSound()">Pause the sound now!</A></P>
<P><A HREF="javascript:stopSound()">Stop the sound now!</A></P>
<P><A HREF="javascript:volup()">Increment the Volume!</A></P>
<P><A HREF="javascript:voldown()">Decrement the Volume!</A></P>
</BODY>
</HTML>
The preceding example illustrates how you might create your own method of controlling a sound file. The possibilities are really endless; you can use images and onClick event handlers to simulate your own sound player.


[Contents] [Previous] [Next] [Index]

Last Updated: 11/26/97 09:26:10


Copyright © 1997 Netscape Communications Corporation