Following on from an earlier discussion

In another thread entitled Embedded Windows Media Player the code was given for Windows Media Player to play a midi file from a drop down menu. The code worked brilliantly in IE, but not Netscape, Mozilla Firefox or Opera. I have been playing around with various code options all day but finally need some help. I know adding this code will work in Netscape, IE etc, but I want my page to be xhtml1.1 compliant, so that means bye bye
<embed type="application/x-mplayer2"
pluginspage="http://www.microsoft.com/Windows/MediaPlayer/"
Name="MediaPlayer" src="midis/sleighride.mid"
AutoStart=1 ShowStatusBar=1 volume=-1
HEIGHT=50 WIDTH=300></embed>
and something more like the code below, which works in IE and almost in Netscape and Firefox (not Opera) - at least the player and controls are visible and no alt text message telling me I need the plug-in. I just can't get a file to play though - can anyone help out here?
<p><label for="cancion"> Choose your Christmas Song to play in the background!</label></p>
<p><select id="cancion" onchange="document.all.music.filename=document.all.cancion.value" size="1" name="Music">
<option selected="selected">Choose!</option>
<option value="http://www.cwmbachjunior.co.uk/midis/sleighride.mid">Sleigh Ride</option>
<option value="http://www.cwmbachjunior.co.uk/midis/letitsnow.mid">Let It Snow</option>
<option value="http://www.cwmbachjunior.co.uk/midis/frostythesnowman.mid">Frosty the Snowman</option>
<option value="http://www.cwmbachjunior.co.uk/midis/rockingaroundxmastree.mid">Rocking Around the Christmas Tree</option>
<option value="http://www.cwmbachjunior.co.uk/midis/jinglebellrock.mid">Jingle Bell Rock</option>
<option value="http://www.cwmbachjunior.co.uk/midis/rudolph.mid">Rudolph the Red-nosed Reindeer</option>
</select><br />
<object id="music" height="44" width="230" type="application/x-mplayer2" >
<param name="AutoStart" value="-1" />
<param name="Balance" value="0" />
<param name="DisplaySize" value="0" />
<param name="Filename" value="" />
<param name="Mute" value="0" />
<param name="selectionStart" value="-1" />
<param name="selectionEnd" value="-1" />
<param name="ShowControls" value="-1" />
<param name="ShowAudioControls" value="-1" />
<param name="ShowDisplay" value="0" />
<param name="ShowPositionControls" value="-1" />
<param name="Volume" value="0" />
<param name="AudioStream" value="-1" />
<param name="AutoSize" value="0" />
<param name="AnimationAtStart" value="-1" />
<param name="AllowScan" value="-1" />
<param name="AllowChangeDisplaySize" value="-1" />
<param name="AutoRewind" value="1" />
<param name="BaseURL" value="" />
<param name="BufferingTime" value="5" />
<param name="CaptioningID" value="" />
<param name="ClickToPlay" value="-1" />
<param name="CursorType" value="0" />
<param name="CurrentPosition" value="-1" />
<param name="CurrentMarker" value="0" />
<param name="DefaultFrame" value="" />
<param name="DisplayBackColor" value="0" />
<param name="DisplayForeColor" value="16777215" />
<param name="DisplayMode" value="0" />
<param name="Enabled" value="-1" />
<param name="EnableContextMenu" value="-1" />
<param name="EnablePositionControls" value="-1" />
<param name="EnableFullScreenControls" value="0" />
<param name="EnableTracker" value="-1" />
<param name="InvokeURLs" value="-1" />
<param name="Language" value="-1" />
<param name="PlayCount" value="1" />
<param name="PreviewMode" value="0" />
<param name="Rate" value="1" />
<param name="SAMILang" value="" />
<param name="SAMIStyle" value="" />
<param name="SAMIFileName" value="" />
<param name="SendOpenStateChangeEvents" value="-1" />
<param name="SendWarningEvents" value="-1" />
<param name="SendErrorEvents" value="-1" />
<param name="SendKeyboardEvents" value="0" />
<param name="SendMouseClickEvents" value="0" />
<param name="SendMouseMoveEvents" value="0" />
<param name="SendPlayStateChangeEvents" value="-1" />
<param name="ShowCaptioning" value="0" />
<param name="ShowGotoBar" value="0" />
<param name="ShowStatusBar" value="0" />
<param name="ShowTracker" value="-1" />
<param name="TransparentAtStart" value="-1" />
<param name="VideoBorderWidth" value="0" />
<param name="VideoBorderColor" value="0" />
<param name="VideoBorder3D" value="0" />
<param name="WindowlessVideo" value="0" />
A selection of 6 midi music files to listen to.
</object>
I've also tried another option using javascript alongside a slightly modified version of the above (snippet below shows modified code)
<object id="music" height="44" width="230" type="application/x-mplayer2" data="onchange" >
<param name="audio" value="onchange"/>
<param name="AutoStart" value="-1" />
using this website as a reference
http://www.stilldreamer.com/programming/a_list_aparts_flash_satay_method_improved/ to create this javascript:
function flashFix(){
if(navigator.appVersion.indexOf("MSIE 5.5")!=-1){
for(i=0;a=document.getElementById("cancion")[i];i++){
if(a.getAttribute("type") &&
a.getAttribute("type").indexOf("application/x-mplayer2")!=-1 &&
!a.getAttribute("classid")
){
a.outerHTML=a.outerHTML.slice(0,a.outerHTML.indexOf(">"))+
" classid='clsid:22D6F312-B0F6-11D0-94AB-0080C74C7E95' "+
"><param name='audio' value='"+
a.getAttribute("data")+
"' \/>"+
a.outerHTML.slice(a.outerHTML.indexOf(">")+1,a.outerHTML.length);
}
}
}
}

Am I anywhere near close to getting the player W3C compliant for xhtml1.1 and working in Netscape et al? Or am I way off the mark? Thank you for your time!

Diane

This is more of a code-related issue than one with multimedia, in the sense that you are trying to optimise the code to be w3 compliant and cross-browser friendly.

I'd suggest that you post this in the HTML/CSS forum instead where you would be more likely to get a response.

Thanks - I'll do that. Should I delete this thread?

Evo: And I suggest to not repost it anywhere else.

Diane: I can move it if you wish, though it does fit rather good in this forum.

Moved

You seem to be on the right track -- though someone else would have more experience than me in this realm, we have had similar issue with flash players. The object tag is the right html, but object can call upon IE's ActiveX, so the embed tag was the alternative - however, using the object tag in simple defined ways works well for small flash loads (http://www.igotyourhouse.com), but for more advanced methods, you'd need:
http://www.alistapart.com/articles/flashsatay/

Maybe similar in some regards? The alternative for flash is to just call it up via javascript, as you seem to be getting at.

Ooops - Ive already done a c&p!

Edited to request someone to delete this thread, as it's now duplicated - thank you - sorry to have messed things up!

Thanks Bradyj- the code I use above is based on the Flash Satay method, but I've run out of steam for the moment. Things often pop into my head during the night, so we'll see what happens - unless anyone else beats me to it?

Well, a the sub-conscious must have been too deeply asleep or drew a blank - nothing has come to mind. Can anyone else see where I am going wrong or suggest an amendment to the code? :confused:

Thank you!

...and something more like the code below, which works in IE and almost in Netscape and Firefox (not Opera) - at least the player and controls are visible and no alt text message telling me I need the plug-in. I just can't get a file to play though - can anyone help out here?
<p><label for="cancion"> Choose your Christmas Song to play in the background!</label></p>
<p><select id="cancion" onchange="document.all.music.filename=document.all.cancion.value" size="1" name="Music">...

Replacing [document.all.id...] with [document.getElementById("id")...] may help.

Thank you! I have tried this

onchange="document.getElementByName(music).filename=document.getElementById(cancion).value"

but I must have got it wrong still, because it doesn't work in any of the browsers, although the player is visible.

Hmm, you might wanna try: document.getElementById('music').filename=options[selectedIndex].value

Nope. Still no success - thank you for your suggestion though. I'll try those two suggestions in a javascript now and see if they'll work that way....

Still no luck, but I have just stumbled upon this page http://www.javascript-page.com/musicmenu.html which I am going to investigate now.

Good luck! :D... btw, the problem with getElementById is that it gets the object element, but not its "object". Because of this, I'm pretty sure the object's model will be inaccessible through the object tag from any other browser.

Thanks. I'm throwing in the towel for the moment. I'm sure when I do finally get the solution, it will be incredibly simple! I've been looking at other scripts through the day, but when I find one which seems to work, I find it's either not cross-browser compatible or not W3C xhtml1.1 compliant, which brings me back to square 1! This is the nearest I've got so far:


<p><label for="cancion"> Choose your Christmas Song to play in the background!</label></p>
<p><select id="cancion" onchange="document.all.music.filename=document.all.cancion.value" size="1" name="Music">
<option selected="selected">Choose!</option>
<option value="midis/sleighride.mid">Sleigh Ride</option>
<option value="midis/letitsnow.mid">Let It Snow</option>
<option value="midis/frostythesnowman.mid">Frosty the Snowman</option>
<option value="midis/rockingaroundxmastree.mid">Rocking Around the Christmas Tree</option>
<option value="midis/jinglebellrock.mid">Jingle Bell Rock</option>
<option value="midis/rudolph.mid">Rudolph the Red-nosed Reindeer</option>
</select><br />
<object id="music" height="44" width="230" classid="clsid:22D6F312-B0F6-11D0-94AB-0080C74C7E95" >
<param name="AutoStart" value="-1" />
<param name="Balance" value="0" />
<param name="DisplaySize" value="0" />
<param name="Filename" value="" />
<param name="Mute" value="0" />
<param name="selectionStart" value="-1" />
<param name="selectionEnd" value="-1" />
<param name="ShowControls" value="-1" />
<param name="ShowAudioControls" value="-1" />
<param name="ShowDisplay" value="0" />
<param name="ShowPositionControls" value="-1" />
<param name="Volume" value="0" />
<param name="AudioStream" value="-1" />
<param name="AutoSize" value="0" />
<param name="AnimationAtStart" value="-1" />
<param name="AllowScan" value="-1" />
<param name="AllowChangeDisplaySize" value="-1" />
<param name="AutoRewind" value="1" />
<param name="BaseURL" value="" />
<param name="BufferingTime" value="5" />
<param name="CaptioningID" value="" />
<param name="ClickToPlay" value="-1" />
<param name="CursorType" value="0" />
<param name="CurrentPosition" value="-1" />
<param name="CurrentMarker" value="0" />
<param name="DefaultFrame" value="" />
<param name="DisplayBackColor" value="0" />
<param name="DisplayForeColor" value="16777215" />
<param name="DisplayMode" value="0" />
<param name="Enabled" value="-1" />
<param name="EnableContextMenu" value="-1" />
<param name="EnablePositionControls" value="-1" />
<param name="EnableFullScreenControls" value="0" />
<param name="EnableTracker" value="-1" />
<param name="InvokeURLs" value="-1" />
<param name="Language" value="-1" />
<param name="PlayCount" value="1" />
<param name="PreviewMode" value="0" />
<param name="Rate" value="1" />
<param name="SAMILang" value="" />
<param name="SAMIStyle" value="" />
<param name="SAMIFileName" value="" />
<param name="SendOpenStateChangeEvents" value="-1" />
<param name="SendWarningEvents" value="-1" />
<param name="SendErrorEvents" value="-1" />
<param name="SendKeyboardEvents" value="0" />
<param name="SendMouseClickEvents" value="0" />
<param name="SendMouseMoveEvents" value="0" />
<param name="SendPlayStateChangeEvents" value="-1" />
<param name="ShowCaptioning" value="0" />
<param name="ShowGotoBar" value="0" />
<param name="ShowStatusBar" value="0" />
<param name="ShowTracker" value="-1" />
<param name="TransparentAtStart" value="-1" />
<param name="VideoBorderWidth" value="0" />
<param name="VideoBorderColor" value="0" />
<param name="VideoBorder3D" value="0" />
<param name="WindowlessVideo" value="0" />
<!--[if !IE]> Mozilla/Netscape and others will use inner object -->
<object codetype="application/x-mplayer2" data="document.all.music.filename=document.all.cancion.value"
height="44" width="230" >
<param name="AutoStart" value="-1" />
<param name="Balance" value="0" />
<param name="DisplaySize" value="0" />
<param name="Filename" value="" />
<param name="Mute" value="0" />
<param name="selectionStart" value="-1" />
<param name="selectionEnd" value="-1" />
<param name="ShowControls" value="-1" />
<param name="ShowAudioControls" value="-1" />
<param name="ShowDisplay" value="0" />
<param name="ShowPositionControls" value="-1" />
<param name="Volume" value="0" />
<param name="AudioStream" value="-1" />
<param name="AutoSize" value="0" />
<param name="AnimationAtStart" value="-1" />
<param name="AllowScan" value="-1" />
<param name="AllowChangeDisplaySize" value="-1" />
<param name="AutoRewind" value="1" />
<param name="BaseURL" value="" />
<param name="BufferingTime" value="5" />
<param name="CaptioningID" value="" />
<param name="ClickToPlay" value="-1" />
<param name="CursorType" value="0" />
<param name="CurrentPosition" value="-1" />
<param name="CurrentMarker" value="0" />
<param name="DefaultFrame" value="" />
<param name="DisplayBackColor" value="0" />
<param name="DisplayForeColor" value="16777215" />
<param name="DisplayMode" value="0" />
<param name="Enabled" value="-1" />
<param name="EnableContextMenu" value="-1" />
<param name="EnablePositionControls" value="-1" />
<param name="EnableFullScreenControls" value="0" />
<param name="EnableTracker" value="-1" />
<param name="InvokeURLs" value="-1" />
<param name="Language" value="-1" />
<param name="PlayCount" value="1" />
<param name="PreviewMode" value="0" />
<param name="Rate" value="1" />
<param name="SAMILang" value="" />
<param name="SAMIStyle" value="" />
<param name="SAMIFileName" value="" />
<param name="SendOpenStateChangeEvents" value="-1" />
<param name="SendWarningEvents" value="-1" />
<param name="SendErrorEvents" value="-1" />
<param name="SendKeyboardEvents" value="0" />
<param name="SendMouseClickEvents" value="0" />
<param name="SendMouseMoveEvents" value="0" />
<param name="SendPlayStateChangeEvents" value="-1" />
<param name="ShowCaptioning" value="0" />
<param name="ShowGotoBar" value="0" />
<param name="ShowStatusBar" value="0" />
<param name="ShowTracker" value="-1" />
<param name="TransparentAtStart" value="-1" />
<param name="VideoBorderWidth" value="0" />
<param name="VideoBorderColor" value="0" />
<param name="VideoBorder3D" value="0" />
<param name="WindowlessVideo" value="0" />
<br />
This browser does not have a Windows Media Player Plug-in.
<br />
<a href="http://www.microsoft.com/windows/windowsmedia/9series/player.aspx">
<strong> Get the latest Windows Media Player Plug-in here.</strong></a> Be sure and select the correct version for your Operating system.
</object>
<!-- <![endif]-->
</object>
A selection of 6 midi music files to listen to
</object>

Hmm... :p [document.music.filename] may work for setting that property (or the URL property)--if the following article is accurate: The Windows Media ActiveX Control – Not Just for Internet Explorer Anymore (http://www.streamingmedia.com/r/printerfriendly.asp?id=8584)

Thanks for the link - I'll check it out. The main problem is that the source is a number of files, not just one.

Right... or a problem of one property assignment.