I'm trying to write a very basic "jukebox" to use on my site. All I have is one dropdown list with a couple songs, and the play/pause/stop buttons next to it.
I want a song to play once someone selects one, and the buttons to work when one is already selected.
I keep getting "Error: document.player.play is not a function - Source File: Line: 28" type errors.
Here's the code:
As you can tell, I've tried this using the <embed> method as well as the <object> method for playing mp3's. I have changed this about 90 times now and don't understand why it's not recognizing .play() or .stop() as functions of the "player" object.
The actual page can be found here.
Thanks for any help you have have...
KizMar
------------
I want a song to play once someone selects one, and the buttons to work when one is already selected.
I keep getting "Error: document.player.play is not a function - Source File: Line: 28" type errors.
Here's the code:
Code:
...
<script language="javascript" type="text/javascript">
// Keep track of which song's playing
var currentSong = '';
// Make sure the current song is loaded into the player object
//document.player.src = currentSong
function changeSong(newSong) {
currentSong = newSong;
document.player.src = currentSong;
document.player.play();
}
function embedPlay(song) {
// If there isn't a song to play then tell them they're stupid
if (currentSong == '') {
alert('There\'s no song to play.\n\nPick one then try again.');
} else {
document.player.play();
}
}
function embedPause() {
document.player.pause();
}
function embedStop() {
document.player.stop();
}
</script>
</head>
<body>
<!-- Main Table -->
<table align="center" cellpadding="0" cellspacing="0" width="100%" border="0">
<tr>
<td height="25" style="padding-left: 2px;">
<!-- <embed name="player" id="player" src="" autostart="false" hidden="true" loop="false"></embed> -->
<object name="player" id="player" codetype="audio/mpeg" style="display: none;">
<param name="loop" value="false" />
<param name="height" value="0" />
<param name="width" value="0" />
</object>
<select name="selSong" id="selSong" size="1" onChange="changeSong(this)" class="jukebox">
<option value="1">Select a song</option>
<option value="files/music/ABeautifulLife.mp3">A Beautiful Life</option>
<option value="files/music/AqueousTransmission.mp3">Aqueous Transmission</option>
</select>
<img src="images/embed_play.gif" width="10" height="17" border="0"
onClick="embedPlay()" alt="play"
align="absmiddle" style="cursor: pointer;">
<img src="images/embed_pause.gif" width="10" height="17" border="0"
onClick="embedPause()" alt="pause"
align="absmiddle" style="cursor: pointer;">
<img src="images/embed_stop.gif" width="10" height="17" border="0"
onClick="embedStop()" alt="stop"
align="absmiddle" style="cursor: pointer;">
</td>
...
As you can tell, I've tried this using the <embed> method as well as the <object> method for playing mp3's. I have changed this about 90 times now and don't understand why it's not recognizing .play() or .stop() as functions of the "player" object.
The actual page can be found here.
Thanks for any help you have have...
KizMar
------------