AS3 + XMLLoader + CSSLoader
Someone suggested the great idea of adding CSS and XML loading to QueueLoader. I plan on doing this, but first I thought I’d share a method I use to load those two items.
I personally tend to load XML first (I put the path to the css in the XML file), then I load the CSS, and then I start my QueueLoader. The reason for this is that I almost always store the paths for QueueLoader in the XML. If that’s a method you tend to follow as well, then these utilities will help if you haven’t built them already.
In the spirit of sequential loading and monitoring, I totally plan on adding this to the next revision. However, I would not suggest setting up a separate QueueLoader just for XML and CSS. If you need to load them separately, here are a couple of utilities for doing that. They will save you a bit of overhead, and are cousins of QueueLoader so they should be brainless to implement.
XMLLoader
import com.hydrotik.utils.XMLLoaderEvent;
var xmlLoader:XMLLoader = new XMLLoader(_sAdminPath + xmlFilename);
xmlLoader.addEventListener(XMLLoaderEvent.COMPLETE, onXMLComplete);
xmlLoader.addEventListener(XMLLoaderEvent.ERROR, onXMLError);
xmlLoader.addEventListener(XMLLoaderEvent.PROGRESS, onXMLProgress);
function onXMLError(event:XMLLoaderEvent):void {
trace(“XMLLoader error: “+event);
}
function onXMLProgress(event:XMLLoaderEvent):void {
trace(“XMLLoader progress: “+event.percentage);
}
function onXMLComplete(event:XMLLoaderEvent):void {
xml = event.xml;
}
CSSLoader
import com.hydrotik.utils.CSSLoaderEvent;
var cssLoader:CSSLoader = new CSSLoader(_sAdminPath + xmlFilename);
cssLoader.addEventListener(CSSLoaderEvent.COMPLETE, onXMLComplete);
cssLoader.addEventListener(CSSLoaderEvent.ERROR, onXMLError);
cssLoader.addEventListener(CSSLoaderEvent.PROGRESS, onXMLProgress);
function onXMLError(event:CSSLoaderEvent):void {
trace(“CSSLoader error: “+event);
}
function onXMLProgress(event:CSSLoaderEvent):void {
trace(“CSSLoader progress: “+event.percentage);
}
function onXMLComplete(event:CSSLoaderEvent):void {
css = event.css;
}
I didn’t include any fla files in the download, just the packages, since this should be pretty easy to implement. But here’s an example of how I use these before running my main block of code:
var xmlLoader:XMLLoader = new XMLLoader(_sAdminPath + xmlFilename);
xmlLoader.addEventListener(XMLLoaderEvent.COMPLETE, onXMLComplete);
xmlLoader.addEventListener(XMLLoaderEvent.ERROR, onXMLError);
xmlLoader.addEventListener(XMLLoaderEvent.PROGRESS, onXMLProgress);
}
private function onXMLError(event:XMLLoaderEvent):void {
trace(“XMLLoader error: “+event)
}
private function onXMLProgress(event:XMLLoaderEvent):void {
trace(“XMLLoader progress: “+event.percentage)
}
private function onXMLComplete(event:XMLLoaderEvent):void {
trace(“:: onXMLComplete:”);
_xml = event.xml;
var cssLoader:CSSLoader = new CSSLoader(CacheKiller.file(“includes/admin/” + _xml.attribute(“css”), “../”, “/”));
cssLoader.addEventListener(CSSLoaderEvent.COMPLETE, onCSSComplete);
cssLoader.addEventListener(CSSLoaderEvent.ERROR, onCSSError);
cssLoader.addEventListener(CSSLoaderEvent.PROGRESS, onCSSProgress);
}
private function onCSSError(event:CSSLoaderEvent):void {
trace(“CSSLoader error: “+event)
}
private function onCSSProgress(event:CSSLoaderEvent):void {
trace(“CSSLoader progress: “+event.percentage)
}
private function onCSSComplete(event:CSSLoaderEvent):void {
trace(“:: onCSSLoaded:”);
_css = event.css;
buildInterface();
}
Pretty simple:) Just runs one after the other then you can run a QueueLoader with loaded items pulled from the XML. Just one way of doing, but like I said I will add css and xml to the next revision.
Thanks to Jesse for the idea!
XMLLoader and CSSLoader Source Rev1
Tuesday, October 30th, 2007
