Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations bkrike on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Javascript & Embed/Object to play music

Status
Not open for further replies.

kizmar2

Programmer
May 25, 2004
164
US
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:
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
------------
 
Replace all occurrences of "document.player." with "document.getElementById('player').".

Whether it fixes the problem or not, it's the right thing to do.

Hope this helps,
Dan



Coedit Limited - Delivering standards compliant, accessible web solutions

[tt]Dan's Page [blue]@[/blue] Code Couch
[/tt]
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top