views:

32

answers:

1

Hi StackOverflow,

I'm trying to build a flash component for my upcoming website where I have to read data from a XML file and show these with a fading 5 second interval - I guess you could call it an image-fader/content-fader or some such :-)

Before I post my code I would like to let you know that my experience with AS3 is quite limited as I've always been working with Silverlight (C#) instead.

Anyway, here's my code:

import fl.transitions.Tween;
import fl.transitions.easing.*;

// FIELDS
var references:Array = new Array();
var counter:int = 0;
var loader:URLLoader = new URLLoader();
var timer:Timer = new Timer(2000, 0);
var image:Bitmap = new Bitmap();
var result:XML;
var ref:MovieClip;

// EVENTHANDLERS
loader.addEventListener(Event.COMPLETE, completeHandler);
timer.addEventListener(TimerEvent.TIMER, runTimer);

// REQUEST XML FROM URL
var request:URLRequest = new URLRequest("navigationReferences.xml");

// TRY LOAD XML FROM URL
try {
loader.load(request);
}
catch(error:Error) {
trace("XML not available");
}

// LOAD XML COMPLETED
function completeHandler(event:Event):void {
if(event.target.data != null) {
    result = new XML(event.target.data);
    parseXml();
} else {
    trace("XML not available");
   }
}

// PARSE XML, BUILD NEW MOVIECLIP AND STORE IT
function parseXml():void {
for (var i:Number=0; i<=result.children().length()-1;i++) { 
    ref = new Reference();
    ref.txtTitle.text = result.navigationReference[i].@title;
    loadImage(result.navigationReference[i].@image);
    ref.mc_imageHolder.addChild(image);
    references.push(ref);

}
timer.start();
}


function runTimer(event:TimerEvent):void {      
if(counter != references.length) {  
    addChild(references[counter]);
    counter++;
}
else {
    counter = 0;
}
}

// IMAGE LOADER
function loadImage(path:String):void {
var loader:Loader = new Loader();
var req:URLRequest = new URLRequest(path);
loader.contentLoaderInfo.addEventListener(Event.COMPLETE, onComplete);
loader.load(req);
}

// IMAGE LOAD COMPLETED
function onComplete(e:Event):void {
image = e.target.loader.content as Bitmap;
 }

There's a few problems with this code:

When I try to trace what actually happens when I run the code it runs through the for-loop perfectly and it seems to attach the image aswell, however - it runs through the loop once again with the last child in my XML file so the trace output will look like this:

XmlChildNode1 - image object attached
XmlChildNode2 - image object attached
XmlChildNode3 - image object attached
XmlChildNode3
XmlChildNode3
XmlChildNode3

Also, when I run the code the timer completed event actually outputs the correct data from the MovieClip in my array, except for the images?

Correct me if I'm wrong here, but it seems like a whole lot of work just to make an image fader which reads data from a XML file? Anyone know if there's a more simple, elegant way of doing what I want to do? Or is my approach actually right?

Thanks a lot in advance!

+1  A: 

I finally found the solution to this. I simply placed the image loader inside the for-loop :) Don't know if it's best practice or not, but seeing as it happens on the client-side, it shouldn't really be a problem.

bomortensen