PDA

View Full Version : can't get page to load before embed sound

tpeck
08-27-2005, 12:24 PM
Hi. I am trying to have background music play onload.

For complicated reasons that I won't go into (unless I have to!) I want to have the background sound occur:

a) via a javascript function
b) the function must not be in an external file.

My (greatly pared down) script is below.

My questions are:

1. why doesn't the page load and the graphic display as it does when the whole thing is in an external file?
2. how do i get it to work like it does if the document.write is in an external javascript file? (i.e I see the graphic?)

The embed is preventing the page from loading first.


*****************************************

<html>

<head>
<title></title>
<script>
function audio() {
document.write ('<embed src= "file:///C:/MEDIA/AUDIO/music/1.mp3" hidden=true autostart=true loop=true>');
}
</script>

</head>

<body onload="audio();">
<img border="0" src="../21.images/cover.gif" width="797" height="558">
</body>

</html>

********************************************

Thanks,

Terry
martin_narg
08-27-2005, 12:37 PM
The reason you are running into problems is that you are using document.write to write the tag to the page. Simply put, document.write kicks in and writes to the page when it is called. If you put this after the page has loaded, then document.write will kick in and essentially start writing a new page - the only contents of which will be your embed tag.

This is a funkier fix, i've not tested it but in theory should work just fine:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
<script type="text/javascript">
function audio() {
var e = document.createElement("embed");
e.setAttribute("src", "/music/1.mp3");
e.setAttribute("hidden", "true");
e.setAttribute("autostart", "true");
e.setAttribute("loop", "true");
document.getElementsByTagName("body")[0].appendChild(e);
}

window.onload = function() {
audio();
}
</script>
</head>

<body>
<img border="0" src="../21.images/cover.gif" width="797" height="558">
</body>
</html>

Edit:
The audio() function is fully portable into an external js file. If you require any help with this, please just yell. I should also point out that this method I have shown is dynamic - you can re-use this function and insert more sounds onto the page without having to have the page reload.

Hope this helps

m_n
iota
08-27-2005, 12:39 PM
You must escape charecters like double quotes.



<script>
function audio() {
document.write ("<embed src='file:\/\/\/C:\/MEDIA\/AUDIO\/music\/1.mp3' hidden=true autostart=true loop=true>");
}
</script>
iota
08-27-2005, 12:42 PM
The reason you are running into problems is that you are using document.write to write the tag to the page. Simply put, document.write kicks in and writes to the page when it is called. If you put this after the page has loaded, then document.write will kick in and essentially start writing a new page - the only contents of which will be your embed tag.
m_n

:thumbsup:
tpeck
08-27-2005, 12:44 PM
Holy Cow!

I'll report on all of this and let you know. It's going to take a while.

Much obliged...

Not sure if the back slashes are necessary - I've been pretty careful about them in the past, but then again...

Thanks
tpeck
08-27-2005, 01:19 PM
Martin - in case you are interested - here is the entire piece of code which now works - thanks to your input!

Basically, it locates the audio files for the embed on a particular drive (via a file called driveletter.js residing on whatever is the drive you wish to nominate by placing it there).

It chooses one of 50 music files chosen at random.

And (can you believe it?) it actually plays the things and displays the page!

Many, many thanks!

*************************

<html>

<head>
<title></title>
<script>
function noErrorMessages () { return true; }
window.onerror = noErrorMessages;
var letter=false;
var a=new Array("B", "C", "D", "E", "F", "G", "H", "I", "J", "K", "L", "M", "N", "O", "P", "Q", "R", "S", "T", "U", "V", "W", "X", "Y", "Z");
var i=0;
</script>
<script src="file:///B:/driveletter.js"></script>
<script>i++;</script>
<script src="file:///C:/driveletter.js"></script>
<script>i++;</script>
<script src="file:///D:/driveletter.js"></script>
<script>i++;</script>
<script src="file:///E:/driveletter.js"></script>
<script>i++;</script>
<script src="file:///F:/driveletter.js"></script>
<script>i++;</script>
<script src="file:///G:/driveletter.js"></script>
<script>i++;</script>
<script src="file:///H:/driveletter.js"></script>
<script>i++;</script>
<script src="file:///I:/driveletter.js"></script>
<script>i++;</script>
<script src="file:///J:/driveletter.js"></script>
<script>i++;</script>
<script src="file:///K:/driveletter.js"></script>
<script>i++;</script>
<script src="file:///L:/driveletter.js"></script>
<script>i++;</script>
<script src="file:///M:/driveletter.js"></script>
<script>i++;</script>
<script src="file:///N:/driveletter.js"></script>
<script>i++;</script>
<script src="file:///O:/driveletter.js"></script>
<script>i++;</script>
<script src="file:///P:/driveletter.js"></script>
<script>i++;</script>
<script src="file:///Q:/driveletter.js"></script>
<script>i++;</script>
<script src="file:///R:/driveletter.js"></script>
<script>i++;</script>
<script src="file:///S:/driveletter.js"></script>
<script>i++;</script>
<script src="file:///T:/driveletter.js"></script>
<script>i++;</script>
<script src="file:///U:/driveletter.js"></script>
<script>i++;</script>
<script src="file:///V:/driveletter.js"></script>
<script>i++;</script>
<script src="file:///W:/driveletter.js"></script>
<script>i++;</script>
<script src="file:///X:/driveletter.js"></script>
<script>i++;</script>
<script src="file:///Y:/driveletter.js"></script>
<script>i++;</script>
<script src="file:///Z:/driveletter.js"></script>
<script type="text/javascript">

function audio() {
var now=new Date()
var random_num=(now.getSeconds())%50
var random_num=random_num+1
var e = document.createElement("embed");
e.setAttribute("src", 'file:///'+letter+':/MEDIA/AUDIO/music/' + random_num + '.mp3');
e.setAttribute("hidden", "true");
e.setAttribute("autostart", "true");
e.setAttribute("loop", "true");
document.getElementsByTagName("body")[0].appendChild(e);
}

window.onload = function() {
audio();
}
</script>

</head>

<body>
<img border="0" src="../images/picture.gif">
</body>

</html>

*************************

Terry
tpeck
08-27-2005, 08:00 PM
Is there any way to have two files play consecutively?

****************************************
var e = document.createElement("embed");
e.setAttribute("src", "/music/1.mp3");
e.setAttribute("src", "/music/2.mp3");
e.setAttribute("hidden", "true");
e.setAttribute("autostart", "true");
e.setAttribute("loop", "true");
document.getElementsByTagName("body")[0].appendChild(e);

****************************************

At the moment, it will only play the last file...skips the first one entirely...

Terry
tpeck
09-30-2005, 03:18 PM
Hi Martin - if you are still around!

I am revisiting this script you kindly supplied for me:

<script type="text/javascript">
function audio() {
var e = document.createElement("embed");
e.setAttribute("src", "/music/1.mp3");
e.setAttribute("hidden", "true");
e.setAttribute("autostart", "true");
e.setAttribute("loop", "true");
document.getElementsByTagName("body")[0].appendChild(e);
}

window.onload = function() {
audio();
}
</script>

My question now is does it have to be an embed? Can it be a QT_WriteOBJECT instead?

I have tried this but it doesn't play:

<script type="text/javascript">
function audio() {
var e = document.createElement("QT_WriteOBJECT(");
e.setAttribute("poster.mov","20","16","");
e.setAttribute("href", '<file:///my.mov>T<myself>');
e.setAttribute("hidden", "true");
e.setAttribute("controller","false");
e.setAttribute("autostart", "true");
e.setAttribute("loop", "false");
document.getElementsByTagName("body")[0].appendChild(e);
}
window.onload = function() {
audio();
}
</script>

This works in HTML:

<script language="JavaScript" type="text/javascript">
QT_WriteOBJECT('poster.mov','20','16','',
'href','<file:///my.mov>T<myself>',
'controller','false');
</script>

...but I would like to do it as per your document.createElement("embed"); method. I guess I should mention that the .mov file is an audio file.

Is there another way perhaps to have the QT_WriteOBJECT method occur in javacript code and still work?

For all sorts of complicated reasons, the QT_WriteOBJECT method is preferable to the EMBED for my project (for one thing, you can actually leave off the mov extension and the file still plays...but not with embed. This is really what I want!)

Thanks.

Terry