Preload Images

I am trying to go about preloading images from a folder once

[cucumberdesign]

I have a clients website where I have designed a gallery that searches a defined folder and shows any sub folders as a category and within those folders, it shows the images.

I have created the thumbnail script and that works, but I want to be able to temporarily add the thumbnails into a cache of sorts.

If a viewer clicks on an image, they are then directed to a larger image. They can then browse the images, using a navigation system at the bottom. However if they decide to go back to the category index (thumbnails) you have to wait for each image to reload. This can be a bit irritating if there are 100 photos and you have to wait for them to load.

Could you direct me to some tutorials or a example script. My guess is that it has to be coded into the thumbnail creator file, but I am still trying to figure this one out.

You can see the gallery here.

<snip>

[edited by: eelixduppy at 1:20 pm (utc) on April 11, 2007]
[edit reason] no URLs, please [/edit]

[eelixduppy]

Hello,

You should be able to use header [php.net] to set the cache headers of the index file so that the file is cached and it will revalidate at different increments of time. Refer to RFC 2616 [faqs.org] for more information on http headers.

Good luck! :)

[cucumberdesign]

Thanks for the reply.

But after much searching, and reading of articles, I have designed another way to do it, that is not too harsh on the server and allows the images to be stored in the browsers cache, as the images are only called dynamically once.

Basically instead of calling the image via the thumbnail page like so:

<img src="thumbs.php?image=myimage.jpg" />

I recreated the thumbs page into a function, and then call the function, which creates the thumbnails, and saves them to a thumbs folder using

imagejpeg

.

I have then scripted the gallery to check firstly if there is a thumb folder, and if not create one. It then checks to see if the thumbs folder is empty or not, and if it is empty, it then creates the thumbnails.

I have also put a secondary check, in case my client adds more photos to the folder, that counts the number of files in the images folder and the thumbs folder, and if there are more images then thumbs, it recreates the thumbs.

if all the checks pass, then instead of calling the images dynamically, it shows the images within the thumbs folder.

Thanks for the reply.

[eelixduppy]

That solution works, too. Just note that if you are making many thumbnails from a script at once, your script may timeout and not finish what it was doing.

[cucumberdesign]

I have tested the script with 100 images, and it hasn't seemed to cause any errors, but I will keep on the look out for it.

However the thumbs are created and stored prior to the loading of the images.