Help with a script

[Gaffer]

I almost have the below script working fine. When the webpage loads you need
to click on the button to start the music, which it does, and then click on
the button to turn it off again. However, when you click the 'turn music
off' button the music does go off, but the button doesn't change back to the
'turn music on' one. So the music can't be turned back on again unless you
refresh the page. Thanks.




--------------------------------------------------------

<script language="JavaScript"><!--
function musicOff() {
document.midi.stop()
}function musicOn() {
document.midi.play()
}


function changeButton() {
if (document.onoff.B1.value=='Turn music on')
{
document.onoff.B1.value='Turn music off';
musicOn()
}


else {
document.onoff.B1.value='Turn music off';
musicOff()
}
}
//-->
</script>
<embed name="midi" src="psychotune.mp3" width="0" height="0"
autostart="false">
<form name="onoff">
<input type="button" value="Turn music on" name="B1"
onClick="changeButton()" style="color: #000000; background-color: #FFFFFF;
font-family: Tahoma; font-size: 7pt">

</form>

 

[Neredbojias]

With neither quill nor qualm, Gaffer quothed:

I almost have the below script working fine. When the webpage loads you need
to click on the button to start the music, which it does, and then click on
the button to turn it off again. However, when you click the 'turn music
off' button the music does go off, but the button doesn't change back to the
'turn music on' one. So the music can't be turned back on again unless you
refresh the page. Thanks.




--------------------------------------------------------

<script language="JavaScript"><!--
function musicOff() {
document.midi.stop()
}function musicOn() {
document.midi.play()
}


function changeButton() {
if (document.onoff.B1.value=='Turn music on')
{
document.onoff.B1.value='Turn music off';
musicOn()
}


else {
document.onoff.B1.value='Turn music off';
musicOff()
}
}
//-->
</script>
<embed name="midi" src="psychotune.mp3" width="0" height="0"
autostart="false">
<form name="onoff">
<input type="button" value="Turn music on" name="B1"
onClick="changeButton()" style="color: #000000; background-color: #FFFFFF;
font-family: Tahoma; font-size: 7pt">

</form>


--------------------------------------------------------

To begin with, you're using archaic javascript. Update your code by
using document.getElementById("xxx"). etc., so you can address any real
problem logically.

 

[Gaffer]

With neither quill nor qualm, Gaffer quothed:


To begin with, you're using archaic javascript. Update your code by
using document.getElementById("xxx"). etc., so you can address any real
problem logically.

OK, I don't exactly know how to update the code at this time, it's all new
to me. Can my original problem in hand be fixed?

 

[Jonathan N. Little]

Neredbojias wrote:
<snip>

Also stop(), play(), etc are old LiveConnect|LiveAudio functions for
which support ended with Netscape 4.x!

As suggesting in OP's earlier posts, please--please--please don't put
background music in your webpage! It *rarely* enhances the page.

 

[Gaffer]

Neredbojias wrote:

<snip>

Also stop(), play(), etc are old LiveConnect|LiveAudio functions for which
support ended with Netscape 4.x!

As suggesting in OP's earlier posts, please--please--please don't put
background music in your webpage! It *rarely* enhances the page.

I sort of agree with you that background music is annoying, that's why it
won't be 'on' when the page loads. There will be an option to turn it on. If
you can give me a URL for a similar updated code then I'd be glad to take a
look at it, but I'm a total amateur when it comes to javascripts. Is there
any way my script can be toggled to do what I originally asked for?????

 

[Neredbojias]

With neither quill nor qualm, Gaffer quothed:

OK, I don't exactly know how to update the code at this time, it's all new
to me. Can my original problem in hand be fixed?

Not so it works in all browsers, no. Unless you js around it
(complicated), background sound pretty much works *either* in IE or
Mozilla et al.

I think it's best to stream (optional) music with a regular link (-which
can be an image-button, whatever.) True, a player opens on the
visitor's computer, but this avoids other problems that bgsound or embed
can cause as well.

To stream, you make an ascii text file with the full path to the
mp3/etc. in it, give this file an .m3u extension, and link to it from
your page. It's easy and relatively reliable.

 

[X l e c t r i c]

To give your visitors the option of hearing the music I recommend just
displaying a player with minimum dimensions. And if you want your page
to validate then do so with a javascript, which of course won't work if
javascript is disabled.

You can put a function like this in the head:

<script type="text/javascript">
function startAudio()
{
document.write('<embed src="psychotune.mp3" autostart="false"
width="125" height="15"><\/embed>');
}
</script>

Change the width and height to your preferences.

Then in the body where you want it to appear you put:

<script type="text/javaScript">
startAudio();
</script>

or you can simply put the function in the body with a call to it:

<script type="text/javaScript">
function startAudio()
{
document.write('<embed src="psychotune.mp3" autostart="false"
width="125" height="15"><\/embed>');
}
startAudio();
</script>

You could reduce your program from three functions to one like this:

function musicOnOff()
{
var bgs_emb = document.getElementById("midi");
var bgs_but = document.getElementById("b1");
if (bgs_but.value == "Turn music on")
{
bgs_but.value = "Turn music off";
bgs_emb.play();
}
else
{
bgs_but.value = "Turn music on";
bgs_emb.stop();
}
}

(The play() and stop() will probably only work for IE and WebTV.)

Although using the DOM is the preferred way, dot notation and the forms
array still work. I haven't seen anything from a reliable source that
they are deprecated.

Then in the body:

<embed id="midi" src="psychotune.mp3" autostart="false" width="125"
height="15"></embed>

(But it won't validate)

and change your form to this:

<form action="">
<input type="button" value="Turn music on" id="b1"
onclick="musicOnOff();">
</form>

Embed your style sheet instead of using inline (or use an external css
file):

<style type="text/css">
<!--
#b1 {
background: #ffffff;
color: #000000;
font-family: Tahoma;
font-size: 7pt;
}
-->
</style>

(I'm not sure if those comments are still required for CSS.)

The bgsound shouldn't even be a consideration, as the latest versions of
the major browsers recognize embed. Using object for media would be the
best approach. But that requires a series of nested object/embed or
object/object elements to include the classid for windows media player
(and the lack of it for the other players) and the various paramater
names and values that the different players recognize.

Later, Art.

 

[Wings]

I don't know about the script, but if a user turns your music off, it
probably isn't too likely that he will want to turn it back on, so I
wouldn't concern myself about turning it back on.