[Javascript] in need of pointers...

Steve Clay sclay at ufl.edu
Tue Mar 28 09:44:44 CST 2006


Tuesday, March 28, 2006, 1:47:21 AM, jsWalter wrote:
> Need to read a list of 1000+ names
> They want to "slide show" these names, 1 at a time on the screen. Fade in,
> fade out (black screen, white letters).
> Need to display a GIF/JPEG, if it exists, that goes with the names (I
> figure label each image with the persons name)
> And to add to the fun, if a WAV file exists (again, [persons name].wav)
> play that file a few seconds into the persons name display.

Normally I'd recommend creating an accessible page with all the names in a
OL, but being a one-purpose app, let's make it easy.

var names = [
   'Jane Doe||'
  ,'John Smith|johnSmith.jpg|'
  ,'Peter Venkman||pete.wav'
  ,'Johhny Depp|johnDepp.gif|depp.wav'
  ...
];
var currentName = 0;

You'll need a container element for the text and IMG, again, let's make
this easy to display centered on the page:
<table><tr><td id='container'>
   <div id='img'></div>
   <div id='name'></div>
</td></tr></table>

You'll need to use setInterval to call methods that:
1. fade out #container. See:
   http://openrico.org/rico/demos.page?demo=rico_effect_fade_to
2. pause until the fade is done (use setTimeout).
3. split the item of names: i = names[currentName++].split('|');
4. document.getElementById('name').innerHTML = i[0];
5. document.getElementById('img').innerHTML = i[1]? '<img src="'+i[1]+'">' : '';
6. fade in the container
7. pause until the fade in is done (use setTimeout).
8. if (i[2]), play the sound. Sound support is going to depend greatly on
   the browser. First try setting window.location = 'some.wav'; Then try
   dynamically adding non-standard EMBED/BGSOUND elements to the document
   (that might work in IE at least). The most reliable way would be to
   dynamically embed an invisible flash player to play the file.

Good luck..
Steve
-- 
http://mrclay.org/




More information about the Javascript mailing list