As I was working on the recap of my recent trip to The Netherlands, I discovered that the text of our 2001 trip to St. Thomas and Puerto Rico had vanished from Witsdom.  The index page was still there, as were the photographs, video and music; just the text page was missing.  I looked everywhere I could think of to recover it, but it was nowhere to be found.  This was a bit surprising since I actually had an archived backup of the entire web content of the server from 2003.

Fortunately, I still had the hard copy notes I had written while we were on the trip, so I re-typed them and recreated the page.

Not being one to be able to leave well enough alone, the fact that the audio controls on the page weren't working was more than I could bear.  The fact that I spent quite a bit of time reworking them so they would operate correctly on Internet Explorer or Firefox or Safari is silly since probably no one will ever view the page, but, at least I know it is right now.

Even though I kludged / brute forced the solution, I am pretty proud of it, as I wasn't able to find another reference that provided a solution for playing a randomly selected music file on a web page, in the background, that provided functioning controls in multiple browsers.

In case you're interested, here's the code:

<SCRIPT LANGUAGE="JavaScript">
   1:  
   2: <!------------HIDING
   3:  
   4: /*Script by Scott R Harrod  
   5:                 7/18/1997
   6:  http://members.aol.com/kirrak9/cyberbase.html
   7:  modified by David Sanders 11/21/1999 and 12/27/2007 with snippets from F. Permandi
   8:  http://www.permadi.com/tutorial/flashVars/
   9: */
  10:  
  11:    Play=new Array                                                                               
  12:    Play[0]="music/feelhi2.mid"         
  13:    Play[1]="music/hothothot.mid"
  14:    Play[2]="music/jama2.mid"
  15:    Play[3]="music/redredSD.mid"
  16:    var now=new Date()
  17:    var music=now.getSeconds()%4                                                
  18: // DONE HIDING-------->
  19:  
  20: document.write(
  21: '<OBJECT ID=Crescendo CLASSID="clsid:0FC6BF2B-E16A-11CF-AB2E-0080AD08A326" WIDTH="200" HEIGHT="55">\n'+
  22: '    <PARAM name="src"        VALUE="' + Play[music] + '">\n'+
  23: '    <PARAM name="autoplay"   VALUE="true">\n'+
  24: '    <PARAM name="controller" VALUE="true">\n'+
  25: '    <PARAM NAME="volume"     VALUE="100">\n'+
  26: '    <PARAM NAME="type"       VALUE="audio/x-mid">\n'+
  27: '<EMBED SRC="' + Play[music] + '"\n'+
  28: '    TYPE="audio/x-mid"\n'+
  29: '    WIDTH="200"\n'+
  30: '    HEIGHT="55"\n'+
  31: '    VOLUME="100"\n'+
  32: '    AUTOPLAY="true"\n'+ 
  33: '    CONTROLLER="true"\n'+
  34: '    ></EMBED>\n'+
  35: '</OBJECT>\n');
  36:  
</SCRIPT>

The first section (above the DONE HIDING) creates the array of possible selections, then chooses one.  The second section creates the code to generate an HTML object and an Embed statement using the selected file from above to activate the player, play the selected song, and display a small control console.  Both the Object and Embed are needed to provide cross-browser functionality.  Since a variable is being used in the Object and Embed statements, both statements must be generated using the javascript document.write function.