␡
- Introducing Animated Starry Diorama
- Playing ASD Audio Without the Audio Element
- Adapting ASD's Canvas to Cover the Browser's Client Area
Like this article? We recommend
Playing ASD Audio Without the Audio Element
Like this article? We recommend
Like this article? We recommend
Like this article? We recommend
Playing ASD Audio Without the Audio Element
While testing ASD with the Firefox 4.0 Beta 6 and Opera browsers, where I specified a local URL to access my filesystem copy of ASD.html while its ASD.js companion accesses the audio file that's hosted on my website, I noticed disruptions in audio play. For some reason, each browser's implementation of the audio element could not properly play the audio.
Although you might not encounter this situation, you might want to support a browser that supports canvas but not audio. In this case, you'll need to consider adapting the application to support an audio alternative. For example, you can adapt ASD.js to use StrangeCube.com's free Flash-based AudioPlay player. Listing 3 reveals the AudioPlay replacement code.
Listing 3— AudioPlay Access Code that Replaces the HTML5 Audio Element API Logic in ASD.js
var filename;
if (random(2) == 0)
filename = "neptune.mp3";
else
filename = "saturn.mp3";
document.writeln("<object classid='clsid:D27CDB6E-AE6D-11cf-96B8-444553540000'");
document.writeln(" codebase='http:\/\/download.macromedia.com\/pub\/shockwave
\/cabs\/flash\/swflash.cab#version=10,0,0,0'");
document.writeln(" width='15' height='15'>");
document.writeln("<PARAM NAME=movie VALUE='http:\/\/http://www.strangecube.com\/audioplay\/online
\/audioplay.swf?file=http:\/\/tutortutor.ca\/software\/ASD\/"+filename+"&auto=yes&
sendstop=yes&repeat=1&buttondir=http:\/\/http://www.strangecube.com\/audioplay\/online
\/alpha_buttons\/negative_small&bgcolor=0xffffff&mode=playstop'>");
document.writeln("<PARAM NAME=quality VALUE=high>");
document.writeln("<PARAM NAME=wmode VALUE=transparent>");
document.writeln("<embed src='http:\/\/http://www.strangecube.com\/audioplay\/online
\/audioplay.swf?file=http:\/\/tutortutor.ca\/software\/ASD\/"+filename+"&auto=yes&
sendstop=yes&repeat=1&buttondir=http:\/\/http://www.strangecube.com\/audioplay
\/online\/alpha_buttons\/negative_small&bgcolor=0xffffff&mode=playstop'");
document.writeln(" quality=high wmode=transparent width='15' height='15' align=''");
document.writeln(" TYPE='application\/x-shockwave-flash'");
document.writeln(" pluginspage='http:\/\/http://www.macromedia.com\/go\/getflashplayer'>");
document.writeln("<\/embed>");
document.writeln("<\/object>");