This is a major problem. It is a pain to make xspf-player work with Internet Explorer. Always the problem, Internet Explorer has exhibited this issue for a couple of versions now. Using standard xhtml to include the player means that IE ends up botching the song.
This has caused problems for me. On the CrucialMusic site, I used Wimpy Player (highly recommended, by the way) for IE and xspf-player for everyboby else. At the time, Wimpy didn't play well under Linux or Mac, don't know why. It was a Jack Sprat issue, and ended up working out fine albeit ugly since I had to program for two players.
With the latest site that I've completed (private site, so no URL) I decided to really spend some time and make one player, preferably xspf-player, work everywhere. And so I did. I used the excellent SWFObject code to do the player embedding. But I didn't want to use all those low-level calls in my code, which was already written around a simple javascript class that I'd put together for CrucialMusic.
So here's what I came up with. Released with a BSD license, have fun. This will make xspf-player work with Internet Explorer, which from reading the message boards at the SourceForge site seems to be a perpetual problem.
// XSPF Player JavaScript Control
//
// By Michael Chaney, Michael Chaney Consulting Corporation
// Copyright 2006 Michael Chaney Consulting Corporation
//
// This code is released under the same BSD-style license as the XSPF Player.
// For more info: http://musicplayer.sourceforge.net/
function XSPFPlayer(mdiv, width, height) {
this.obj = new SWFObject("/flash/xspf_player_slim.swf", "single", width, height, "7");
this.div = mdiv;
this.obj.addVariable('autoplay','');
this.obj.write(this.div);
}
XSPFPlayer.prototype.play_song = function(title, song_url) {
this.obj.addVariable('autoplay','true');
this.obj.addVariable('song_url', song_url);
this.obj.addVariable('song_title', title);
this.obj.write(this.div);
}
XSPFPlayer.prototype.stop = function() {
this.obj.addVariable('autoplay','');
this.obj.write(this.div);
}
In your HTML:
<div id="player1">If the player isn't here, you need to <a href="http://www.macromedia.com/go/getflashplayer">download Flash</a></div>
<script type="text/javascript">
var xspfplayer = new XSPFPlayer('player1',150,15);
</script>
Then, if you want to play a song:
<a href="#" onclick="xspfplayer.play_song("My Song","/url/to/song.mp3"); return false;">Play My Song</a>
<a href="#" onclick="xspfplayer.stop(); return false;">Stop</a>
Leave a Reply