View Full Version : A question about Javascript midi player

Midnight Cat
05-24-2005, 01:13 AM

I have a question regarding Javascript and Windows Media Player.

Can anyone please help me write a code in Javascript that can allow Windows Media Player play random midi files with a caption stating which midi is currently being uploaded and played?

This is the original code that I have gotten from a friend:

<object id="darkplayer" codeBase="http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#Version=5,1,52,701" type="application/x-oleobject" height="0" standby="Loading Microsoft Windows Media Player components..." width="0" classid="CLSID:22d6f312-b0f6-11d0-94ab-0080c74c7e95">
<param NAME VALUE>
<param NAME="ShowControls" VALUE="0">
<param NAME="ShowStatusBar" VALUE="0">
<param NAME="ShowDisplay" VALUE="0">
<param NAME="DefaultFrame" VALUE="Slide">
<param NAME="Autostart" VALUE="1">
<param NAME="Loop" VALUE="True">

<input TYPE="BUTTON" NAME="darkplay" VALUE="play" OnClick="play('http://dreamportal.topcities.com/music/donkey_kong_forest.mid');" style="font-family: Verdana, Arial, Helvetica; font-size: 10pt; border: 1px solid #7D5023; background=#F1EBCB;">
<input TYPE="BUTTON" NAME="darkpause" VALUE="pause" OnClick="document.darkplayer.pause(); playstate=2;" style="font-family: Verdana, Arial, Helvetica; font-size: 10pt; border: 1px solid #7D5023; background=#F1EBCB;">
<input TYPE="BUTTON" NAME="darkstop" VALUE="stop" OnClick="document.darkplayer.stop(); playstate=2;" style="font-family: Verdana, Arial, Helvetica; font-size: 10pt; border: 1px solid #7D5023; background=#F1EBCB;"><br><font color="A0A0A0" face="arial"><span style="font-size:10px">Now playing - Forest Interlude (Donkey Kong)</span></font>
playstate = 1;
function play(snum) {
if (playstate == 2) {
} else {
document.darkplayer.FileName = snum;
document.darkplayer.scr = snum;
playstate = 1;

But I don't know how to make it so that it can play random midi everytime I refresh a page, with a caption that says: "Now Playing - Midi01".

Please help me. Thank you.

05-24-2005, 01:26 AM
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Random midi Music Player</title>
<style type="text/css">
#jukebox {
<script type="text/javascript">
nummidi = 10
day = new Date()
z = day.getTime()
y = (z - (parseInt(z/1000,10) * 1000))/10
x = parseInt(y/100*nummidi,10) + 1
if (x == (1))
title=("Artist1 - Song1")
if (x == (2))
title=("Artist2 - Song2")
if (x == (3))
title=("Artist3 - Song3")
if (x == (4))
title=("Artist4 - Song4")
if (x == (5))
title=("Artist5 - Song5")
if (x == (6))
title=("Artist6 - Song6")
if (x == (7))
title=("Artist7 - Song7")
if (x == (8))
title=("Artist8 - Song8")
if (x == (9))
title=("Artist9 - Song9")
if (x == (10))
title=("Artist10 - Song10")

<div id="jukebox">JUKEBOX<br>
<span id="music1">
<script type="text/javascript">
document.write('Current song playing is '+title+'<br>'
+'<embed type="application/x-mplayer2" '
+'pluginspage="http://www.microsoft.com/Windows/MediaPlayer/" '
+'src="'+midi+'" '
+'name="MediaPlayer1" '
+'width="300" '
+'height="69" '
+'controltype="2" '
+'showcontrols="1" '
+'showstatusbar="1" '
that will play a random song on page load, and it will also show the title of the song. That should also be cross browser compatible on the more modern day browsers like FF, IE6, NS7, Opera 8. It is capable of playing mp3 and wav files as well.

05-24-2005, 01:29 AM
The following code plays a random audio file onload. .mp3 files are used in the example, but you can change it to .midi. It has a select list for all the files, and the title of the currently playing file will be shown as the selected item.

<Script Language=JavaScript>

function playAudio(URL){

if (URL != "")
document.Player.filename = URL;

function getRandom(){

isList = document.getElementById('audioList');
isMax = isList.length-3;
isIndex = 2+Math.round(Math.random()*isMax);
isList.selectedIndex = isIndex;

window.onload = getRandom;

<Table Border='0' align='center' cellspacing='2' cellpadding='5'>
<TD align='center'>
<Select id='audioList' onchange="playAudio(this.value)">
<option selected value="">Choose a Song</option>
<option value='Playlist.wax'> Play All </option>
<option value='song1.mp3'> First </option>
<option value='song2.mp3'> Second </option>
<option value='song3.mp3'> Third </option>
<option value='song4.mp3'> Fourth </option>
<TD align='left'>
<PARAM NAME="BufferingTime" VALUE="30">
<PARAM NAME="AudioStream" VALUE="-1">
<PARAM NAME="Volume" VALUE="-400">

To create a playlist file, copy and paste the following code into a blank NotePad document, adjust the number of entries as required, then save the file as PlayList.wax

<ASX version ="3.0">
<Ref href="song1.mp3"/>
<Ref href="song2.mp3"/>
<Ref href="song3.mp3"/>
<Ref href="song4.mp3"/>
<Ref href="song5.mp3"/>

05-24-2005, 01:30 AM
cranford thats only going to work in IE, FF needs the embed tag for WMP.

05-24-2005, 01:31 AM
You can increase the width setting of Media Player so that is will show the skip to next and skip to previous controls, when playing the playlist. I believe 270 is about right.

Midnight Cat
05-24-2005, 01:37 AM
You guys are awesome! Thank you so much! :thumbsup:

Midnight Cat
05-24-2005, 01:41 AM
But is it possible that I can use the form buttons (input) instead of having an entire Windows Media Player showing on my page?

Because this is the layout I have right now:


And you can see on the top left, there's a place for the midi player that I have currently with the form buttons. So is there anyway to retain the current setup but make it be able to play random midis that can also show the caption of what is currently being played?

Sorry about all the troubles. I'm a newbie to this whole website coding thing.