Simple flash photo fader

[Austinkir]

I'm very new to flash, but I'd like to make a photo fader/slide show like the one here: http://jmshots.com/main.html
Just a simple program that cross-fades through lets say, five photos, and then starts over. It would be really awesome if the flash program loaded the images from an external folder (like /images), so I could change the pictures without having to change the actual flash file.
I tried and tried to make sense of this: http://www.dynamicdrive.com/forums/s...ad.php?t=21364 but couldn't get it to work...
Is this an easy task? Any help would be greatly appreciated.

Thank you
Austin

[Medyman]

Hi Austin...

I'm walking GordonBennet through a similar application over in this thread. I encourage you to follow along.

It's not 100% what you're asking for. But it's 95% there. The rest, I'll be happy to advise you on.

Edit: You should probably post your questions/comments in this thread. Otherwise, it'll get too confusing for anyone to follow (especially me ).

[Austinkir]

Thank you, I'll read up on it and ask questions here.
Thank you!

[Austinkir]

So if I am correct, for me I'd want to forget about putting the <left>,<right>,<center> tags. I would write a xml file like this:

<?xml version="1.0" encoding="UTF-8"?>
<gallery>
	<page>/image01.jpg</page>
	<page>/image02.jpg</page>
	<page>/image03.jpg</page>
        .....
<gallery>

[Austinkir]

I am lost as to what I should do here:

could I just skip this step?

[Austinkir]

So far, here is what I have with changes highlighted:

// Initiate XML
var xml:XML = new XML();
xml.ignoreWhite = true;

// Variables
var total:Number = new Number();
var path:String = new String();
var positions:Array = new Array(left, center, right); //not sure if this is needed
var current:Number = 0;

// Load XML 
xml.onLoad = function(success) {
	if(success) {
		total = xml.firstChild.childNodes.length // Set total number of pages
		path = xml.firstChild.attributes.path;
		loadImages(current);
	}
	else {
		trace("Error: XML Didn't Load");
	}
}

// Load Images
function loadImages(page) {
	pageNo.text = "PAGE " + (page+1) + " OF " + total;
	for(i=0;i<3;i++) {
		var imagePath:String = path + xml.firstChild.childNodes[page].childNodes[i].childNodes
		if(imagePath!="") {
			positions[i].loadMovie(imagePath);
		}
	}
	createNavigation();
}

// Next Function
next.setInterval(current, 5000) = goForward; //after 5 seconds go to next image
function goForward() {
	current++;
	loadImages(current);
}
xml.load("gallary.xml");

[Medyman]

So if I am correct, for me I'd want to forget about putting the <left>,<right>,<center> tags. I would write a xml file like this:

<?xml version="1.0" encoding="UTF-8"?>
<gallery>
	<page>/image01.jpg</page>
	<page>/image02.jpg</page>
	<page>/image03.jpg</page>
        .....
<gallery>

Yup. That'll work.

I am lost as to what I should do here:

could I just skip this step?

Yes, since you'll only be targeting one movieclip, there is no need for an array. Wherever you see positions[n], you can replace it with the name of your container movieclip.

So far, here is what I have with changes highlighted:

// Initiate XML
var xml:XML = new XML();
xml.ignoreWhite = true;

// Variables
var total:Number = new Number();
var path:String = new String();
var positions:Array = new Array(left, center, right); //not sure if this is needed
var current:Number = 0;

// Load XML 
xml.onLoad = function(success) {
	if(success) {
		total = xml.firstChild.childNodes.length // Set total number of pages
		path = xml.firstChild.attributes.path;
		loadImages(current);
	}
	else {
		trace("Error: XML Didn't Load");
	}
}

// Load Images
function loadImages(page) {
	pageNo.text = "PAGE " + (page+1) + " OF " + total;
	for(i=0;i<3;i++) {
		var imagePath:String = path + xml.firstChild.childNodes[page].childNodes[i].childNodes
		if(imagePath!="") {
			positions[i].loadMovie(imagePath);
		}
	}
	createNavigation();
}

// Next Function
next.setInterval(current, 5000) = goForward; //after 5 seconds go to next image
function goForward() {
	current++;
	loadImages(current);
}
xml.load("gallary.xml");

Looks good so far. Change the positions[x] as mentioned above. You also don't seem to be including a path attribute in your XML file. If you don't plan to do so, you can remove references to the variable path.

You should delete significant portions of the for loop in the loadImages() function as you'll only have one image on the stage at a time. The text in red can be deleted.

function loadImages(page) {
	pageNo.text = "PAGE " + (page+1) + " OF " + total;
	for(i=0;i<3;i++) {
		var imagePath:String = path + xml.firstChild.childNodes[page].childNodes[i].childNodes
		if(imagePath!="") {
			positions[i].loadMovie(imagePath);
		}
	}
	createNavigation();
}

[Austinkir]

The last two days have been very busy and I haven't been able to get on.
Thanks for your help!

After trying to test the movie, I get the following error:

Left side of assignment operator must be variable or property.

with this listed as the source:

next.setInterval(current, 5000) = goForward; //after 5 seconds go to next image

Did I phrase the setInterval code wrong?

Here is my complete current actionscript(2):

// Initiate XML
var xml:XML = new XML();
xml.ignoreWhite = true;

// Variables
var total:Number = new Number();
var path:String = new String();
var current:Number = 0;

// Load XML 
xml.onLoad = function(success) {
	if(success) {
		total = xml.firstChild.childNodes.length // Set total number of pages
		path = xml.firstChild.attributes.path;
		loadImages(current);
	}
	else {
		trace("Error: XML Didn't Load");
	}
}

// Load Images
function loadImages(page) {
	pageNo.text = "PAGE " + (page+1) + " OF " + total;
		var imagePath:String = xml.firstChild.childNodes[page].childNodes[i].childNodes
			positions[i].loadMovie(imagePath);
	createNavigation();
}

// Next Function
next.setInterval(current, 5000) = goForward; //after 5 seconds go to next image
function goForward() {
	current++;
	loadImages(current);
}
xml.load("gallary.xml");

[Nilsy]

Here is a great tutorial for a slide show it is very easy to create and use, it can be made in less than 20mins.

http://www.kirupa.com/developer/mx/photogallery.htm

I hope this helps.

[Medyman]

Did I phrase the setInterval code wrong?

Yeah, it should be:

setInterval(goForward, 5000)