# XML Photogallery Tutorial

**URL:** https://forum.kirupa.com/t/xml-photogallery-tutorial/258915
**Category:** flash
**Created:** [April 29, 2008, 3:25pm UTC](https://forum.kirupa.com/t/xml-photogallery-tutorial/258915 "2008-04-29T15:25:23Z")
**Posts on this page:** 1
**Page:** 1

<div class="post-metadata">

### Author: ![csr500](https://avatars.discourse-cdn.com/v4/letter/c/278dde/32.png) [@csr500](https://forum.kirupa.com/u/csr500)
#### Post date: [April 29, 2008, 3:25pm UTC](https://forum.kirupa.com/t/xml-photogallery-tutorial/258915/1 "2008-04-29T15:25:23Z")

</div>

Hello people

I am trying to do something and have come up against a brick wall and was hoping for some help.

The tutorial named above is all about importing an image into flash using xml.

I have successfully imported one image, however I would like to have a duplicate smaller image as well.

Here is my actionscript

function loadXML(loaded) {  
if (loaded) {  
xmlNode = this.firstChild;  
image = [];  
description = [];  
**[COLOR=Red]thumb = [];[/COLOR]**  
total = xmlNode.childNodes.length;  
for (i=0; i\<total; i++) {  
image\* = xmlNode.childNodes\*.childNodes[0].firstChild.nodeValue;  
description\* = xmlNode.childNodes\*.childNodes[1].firstChild.nodeValue;  
[COLOR=Red]_thumb = xmlNode.childNodes_.childNodes[2].firstChild.nodeValue;\*\*[/COLOR]  
}  
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);  
**[COLOR=Red]thumb.loadMovie(thumb[0], 1);[/COLOR]**  
desc\_txt.text = description[0];  
picture\_num();  
}  
}  
function picture\_num() {  
current\_pos = p+1;  
pos\_txt.text = current\_pos+" / "+total;  
}

The red script is what I have changed since the original tutorial.

The xml is as such

\<?xml version=“1.0” encoding=“utf-8” standalone=“yes”?\>  
\<images\>  
\<pic\>  
\<image\>simon.jpg\</image\>  
\<caption\>Simon & Friend\</caption\>  
\<thumb\>simon\_1.jpg\</thumb\>  
\</pic\>  
\<pic\>  
\<image\>simon\_1.jpg\</image\>  
\<caption\>Media Lab\</caption\>  
\<thumb\>simon\_1.jpg\</thumb\>  
\</pic\>  
\<pic\>  
\<image\>simon\_2.jpg\</image\>  
\<caption\>Stata Center\</caption\>  
\<thumb\>simon\_1.jpg\</thumb\>  
\</pic\>  
\<pic\>  
\<image\>[http://www.kirupa.com/developer/mx2004/pg/stata\_lobby.jpg](http://www.kirupa.com/developer/mx2004/pg/stata_lobby.jpg)\</image\>  
\<caption\>Stata Lobby\</caption\>  
\<thumb\>simon\_1.jpg\</thumb\>  
\</pic\>  
\<pic\>  
\<image\>[http://www.kirupa.com/developer/mx2004/pg/construction.jpg](http://www.kirupa.com/developer/mx2004/pg/construction.jpg)\</image\>  
\<caption\>Construction\</caption\>  
\<thumb\>simon\_1.jpg\</thumb\>  
\</pic\>  
\<pic\>  
\<image\>[http://www.kirupa.com/developer/mx2004/pg/dome.jpg](http://www.kirupa.com/developer/mx2004/pg/dome.jpg)\</image\>  
\<caption\>The Dome\</caption\>  
\<thumb\>simon\_1.jpg\</thumb\>  
\</pic\>  
\<pic\>  
\<image\>[http://www.kirupa.com/developer/mx2004/pg/structure.jpg](http://www.kirupa.com/developer/mx2004/pg/structure.jpg)\</image\>  
\<caption\>Structure\</caption\>  
\<thumb\>simon\_1.jpg\</thumb\>  
\</pic\>  
\</images\>

Any help on this issue would be very much appreciated.

Please treat me like an idiot when responding, as I am not very compotent when it comes to actionscript or flash!

Thanking everyone in advance

Cameron
