sound, plug-ins:
playing sounds

When Netscape released Navigator 3, it bundled with the software a special plug-in called "LiveAudio." Compatible with most major sound formats, the LiveAudio plug-in enables web designers to include audio content in their web pages without requiring their users to download additional plug-ins or launch external applications.

Simply by employing the <embed> tag, providing audio content in web pages is easy. The code shown below is all you need to get started:

<embed src="sound.au" autostart=true>

the LiveAudio plug-in

On browsers equipped with the LiveAudio, this single tag displays an attractive audio control panel and plays the clip automatically. By itself, the plug-in -- actually an applet -- has a high degree of functionality. Users can start, stop, and pause the sound, and even adjust the volume.

But what if you want your web pages to play sounds without showing a huge, bulky control panel? It's pretty simple, actually -- all you have to do is add the phrase "hidden=true" to the <embed> tag, and the browser "magically" plays the sound in an invisible applet. This makes it possible to add "background sounds" to web pages.

Now before you rush off and add invisible sound players to your web pages, let me advise you that without additional considerations, this is a very bad idea. There are users who will curse your name -- and your web pages, too -- if your pages play sounds that can't be stopped.

LiveAudio is LiveConnect-enabled

This is where JavaScript comes in handy. Netscape's LiveAudio plug-in is "LiveConnect-enabled," which means that the plug-in has a JavaScript interface. And because you can control the plug-in's behavior with JavaScript calls, you can also forgo the default control panel and supply your own, customized controller instead.

Before continuing with the next section, take some time to study the "simple LiveAudio plug-in demo." You'll be surprised how much you can figure out on your own.

LiveAudio syntax

Welcome back. If you carefully examined the source, you probably noticed that the properties

name=invisible

and

mastersound

were defined for the hidden player, but not for the visible player. They weren't defined for the visible player because JavaScript was not used to control it. The hidden player, on the other hand, was activated through JavaScript, and therefore required a name. The name property makes it possible for you, the JavaScript programmer, to reference the plug-in as a property of the document object.

The mastersound property is required for less obvious reasons. I won't go into the details, because it really isn't important. For now, just remember that every LiveAudio plug-in defined with a unique name must also have the mastersound property. (If you really want to know why, take a look at Netscape's LiveAudio Syntax spec, and remember that I used the word "unique.")

In JavaScript, plug-ins are treated like properties of the document object. Therefore, if a plug-in has the property name=ambiance, then a JavaScript program should refer to it as document.ambiance.

A partial listing of LiveAudio's LiveConnect methods is shown below. For a more complete list, consult Netscape's spec, LiveAudio Syntax.

method	description
`play ()`	Starts or resumes audio playback.
`pause ()`	Suspends audio playback.
`stop ()`	Stops audio playback and "rewinds" the sound clip.
`setvol (percent)`	Sets the playback volume to the indicated percentage (1-100).
`IsReady ()`	Returns `true` if the plug-in is loaded, `false` otherwise.
`IsPlaying ()`	Returns `true` if the sound is playing, `false` otherwise.
`IsPaused ()`	Returns `true` if the sound is paused, `false` otherwise.
`GetVolume ()`	Returns the current playback volume as a percentage (1-100).

building a custom controller

Now that you know the methods, let's build a page containing an invisible plug-in that plays a background sound. As a courtesy to our users, we'll provide a visible switch which can be used to turn the sound on and off.

First, we'll code up the embedded object.

Note that I included the loop=true property so that the background sound will repeat itself.

Next, let's define some simple JavaScript functions to turn the sound on and off.

<script>

function start_ambiance ()
{
	document . ambiance . play ();
}

function stop_ambiance ()
{
	document . ambiance . stop ();
}

Pretty simple, right? We're almost done.

Next, it would be nice if we had a function to toggle the sound, without actually knowing whether it's playing or not.

function toggle_ambiance ()
{
	if (! document . ambiance . IsReady ())
		return;
	if (document . ambiance . IsPlaying ())
		stop_ambiance ();
	else
		start_ambiance ();
}

</script>

Note that in toggle_ambiance (), we carefully avoid errors by not responding until the applet is fully loaded.

The next step is to create a visible button that is attached to the toggle_ambiance () function. In order to keep it unobtrusive, well make it small and stash it in the upper-right corner.

Finally, we can add the main content of our page.

<p>Welcome to our web page.
Blah, blah, blah, ...</p>

</body>
</html>

Putting the pieces together results in a web page with a background sound. The sound plays automatically, but the user can quickly turn off if he doesn't like it. Furthermore, the actual plug-in playing the sound is hidden so that it doesn't detract from the rest of the page. After all, sounds should be heard, not seen!

Charlton Rose
July 24, 1997

sound, plug-ins: playing sounds

LiveAudio is LiveConnect-enabled

LiveAudio syntax

building a custom controller

sound, plug-ins:
playing sounds