Photo Gallery Using XML - Auto Cycle Through Images?

[vgolfer]

This really is a great forum. I'm using the tutorial for the Photo Gallery using XML (http://www.kirupa.com/developer/mx2004/xml_flash_photogallery.htm) - it is fantastic. Just a quick question.

Does anyone know if it is possible to modify the code so that it automatically cycles through all the images in, say, 10 second intervals? So rather than keep clicking the next button, it just cycles through. And when it gets to the last image, it then cycles back through the first one.
Code is below:

function loadXML(loaded) {
if (loaded) {
xmlNode = this.firstChild;
image = [];
description = [];
total = xmlNode.childNodes.length;
for (i=0; i<total; i++) {
image[i] = xmlNode.childNodes[i].childNodes[0].firstChild.nodeValue;
description[i] = xmlNode.childNodes[i].childNodes[1].firstChild.nodeValue;
}
firstImage();
} else {
content = "file not loaded!";
}
}
xmlData = new XML();
xmlData.ignoreWhite = true;
xmlData.onLoad = loadXML;
xmlData.load("images.xml");
/////////////////////////////////////
listen = new Object();
listen.onKeyDown = function() {
if (Key.getCode() == Key.LEFT) {
prevImage();
} else if (Key.getCode() == Key.RIGHT) {
nextImage();
}
};
Key.addListener(listen);
previous_btn.onRelease = function() {
prevImage();
};
next_btn.onRelease = function() {
nextImage();
};
/////////////////////////////////////
p = 0;
this.onEnterFrame = function() {
filesize = picture.getBytesTotal();
loaded = picture.getBytesLoaded();
preloader._visible = true;
if (loaded != filesize) {
preloader.preload_bar._xscale = 100*loaded/filesize;
} else {
preloader._visible = false;
if (picture._alpha<100) {
picture._alpha += 10;
}
}
};
function nextImage() {
if (p<(total-1)) {
p++;
if (loaded == filesize) {
picture._alpha = 0;
picture.loadMovie(image[p], 1);
desc_txt.text = description[p];
picture_num();
}
}
}
function prevImage() {
if (p>0) {
p--;
picture._alpha = 0;
picture.loadMovie(image[p], 1);
desc_txt.text = description[p];
picture_num();
}
}
function firstImage() {
if (loaded == filesize) {
picture._alpha = 0;
picture.loadMovie(image[0], 1);
desc_txt.text = description[0];
picture_num();
}
}
function picture_num() {
current_pos = p+1;
pos_txt.text = current_pos+" / "+total;
}

Thanks a lot
Rob J from Australia

[scotty]

Welcome to kirupaforums =)

Check this thread
http://www.kirupa.com/forum/showthread.php?t=98164 post #4
Chenge the delay to 10000 and it will change pictures every 10 secondes :)

scotty(-:

[vgolfer]

Welcome to kirupaforums =)

Check this thread
http://www.kirupa.com/forum/showthread.php?t=98164 post #4
Chenge the delay to 10000 and it will change pictures every 10 secondes :)

scotty(-:

That is awesome thanks Scotty!

[scotty]

welcome :)

[vgolfer]

Just one last question Scotty...is it possible to commence the fade out of the loaded image only when the next image has completely loaded...so you don't have any lag between pics.

I'm trying to figure out how to make the transition appear seamless.

1. The first image loads
2. Once loaded, the next image loads in the background
3. Once the specified time delay has come, the first image fades out and the next image fades in

Does that make sense? What I want to avoid is the first image fading out...then waiting until the next image is downloaded before fading in.

Cheers

[scotty]

It can be done, but you need a different setup, cause if you're using one mc to load in flash replaces all old content with the new one, so you need more mc's to load in ;)

scotty(-:

[vgolfer]

Thanks Scotty. I think I should probably keep my loading images reasonably small anyway, so it won't be a problem. It still works great.

Just one last thing...I promise!

Is it possible to have a URL assigned to each image that loads. So when that image is clicked, it loads a URL?

Cheers

[scotty]

http://www.kirupa.com/forum/showpost.php?p=874781&postcount=6 :)

scotty(-:

[vgolfer]

Perfecto!

One last thing...and I promise this is the last! Actually 2 things.

1. Is it possible to create a dynamic border for the loaded image depending on the size of the image being loaded?
2. Is it possible to move the Y position of the caption text box depending on the height of the loaded image? ie if the image is 200 pixels high, then the text box should be positioned at 220 pixels.

I know I am asking a lot...;)

Cheers

[vgolfer]

Just wondering whether anyone would have an answer for my question above?

Cheers

=) =) =)