Automated caching slideshow: why does wait fail?

[gorilla1]

The slideshow I have working on this page:

http://www15.brinkster.com/walshn/

is derived from the Dynamic Drive script where images are loaded one by one as the prior image is showing. On the page above, I have modified the script so that instead of having next/previous controls, it moves automatically through the images. This version works fine as long as the timer is set so that there is adequate time to load during the timer interval. So, for instance, with the files on that page over a 50kb dialup connection, there is no problem with a 12 second interval, but with a 5 second setting the sldiewhow comes to a halt pretty quickly. Over a highbandwidth connection there is no problem at 5 seconds. Since the script includes in its download routine (which is in the body portion of the html code) a check for complete download of the next image and then a wait if the download is not complete, it seems like it ought to work even with wait interval set too small.. Why does the script get hung up?

G
for reference, here is the url for the original dynamic drive script:
http://www.dynamicdrive.com/dynamicindex14/preloadslide.htm

[adios]

hey gorilla...

As far as I can see, the 'ShowSlide' function simply bails out if the image isn't loaded; this is fine for manual control, where the user can simply try again - but it will stop automatic rotation dead, as you mentioned. Maybe:

function ShowSlide(Direction) {
if (SlideReady) {
NextSlide = CurrentSlide + Direction;
// THIS WILL DISABLE THE BUTTONS (IE-ONLY)
document.SlideShow.Previous.disabled = (NextSlide == 0);
document.SlideShow.Next.disabled = (NextSlide == (Slides.length-1));
if ((NextSlide >= 0) && (NextSlide < Slides.length)) {

document.images['Screen'].src = Slides[NextSlide][0].src;
document.SlideShow.slideText.value=Slides[NextSlide][1];
CurrentSlide = NextSlide++;
Message = 'Picture ' + (CurrentSlide+1) + ' of ' + Slides.length;
self.defaultStatus = Message;
if (Direction == 1) CacheNextSlide();
setTimeout('ShowTime()',5000);
}
return true;
}
else setTimeout('ShowSlide('+direction+')',100);
}

Just a guess...

[Vladdy]

The drawback of this script is that next image is loading while the previous one is displayed. While it may not be a big issue when you have those images loop automatically, you may start wasting time if you decide to go to the manual control.
I'm finishing the work on the slide show script which completely separates loading from displaying. The code is done, I need to do a write-up and polish the styles for presentation. You can preview the script at http://www.vladdy.net/WebDesign/SlideShow.html
Other features include:
- the ability to specify caption for each image
- text-only slides (an introductory text slide in the beginning captures viewers attention and allows the first few slides to download)
- play/pause next previous controls

[gorilla1]

Hey Adios,

Ah, right you are. Thanks very much. The line
else setTimeout('ShowSlide('+direction+')',100);
generated 'error on page, for reasons that are not quite clear to me, but no matter since the automatic function can only go forward (and only on forward is download an issue) - the following line of code did the job fine:

else setTimeout('ShowTime()',100);

Thanks again, as I had built on the script quite a bit and was about to abandon it after finding this problem.

G.

[gorilla1]

Vladdy,

Thanks, that looks like a pretty dynamite slideshow you have developed - nice job. It is true that with the background load, if you set up the manual controls (next/prev, play/pause - readily done), and you try to advance it too fast, it stutters a bit. However, a drawback to the preloading scripts, seems to me, is that if you have lots of images at a decent size (say 25 images at 50kb each) the page load will be very slow for a dialup user, even if you have a text first slide - no? Apart from that, I had no luck running your script on NS4 (which is no crime, but some of the folks I want to view my script are what I guess you have to call slow adapters). Anyway, nice job, and thanks for sharing it.

G

[Vladdy]

The slideshow I written is initialized on the page onLoad event. This way those with the slower connection can see the page laid out, minus the slide show. The first text slide entertains the visitor hopefully long enough for the next slide to load.
The images are loaded without interruption. Next/Previous buttons are grayed out if the slide is unavailable.

I will have code snippets and explanation how it works some time next week. The main idea is that I trigger "loadNext" using onLoad event of the image being loaded, thus separating loading from viewing. As it is a DOM compliant script I create an <img> element for every image in the slide show so that display function only needs to change the child node of the division that containd the image. I believe the same principle can be applied to the script you are working with.

Good luck.

[gorilla1]

The main idea is that I trigger "loadNext" using onLoad event of the image being loaded, thus separating loading from viewing. As it is a DOM compliant script I create an <img> element for every image in the slide show so that display function only needs to change the child node of the division that containd the image. I believe the same principle can be applied to the script you are working with.

Vladdy, OK, thanks, I think I missed your point. Sounds like an excellent approach. I look forward to seeing more about it. Thanks.

G