gpAS3Library – Part 1: A Global Configuration Class

When I created Flash applications with AS2 in the past, I loaded application information such as page color, button colors and sizes via an XML file. I used this XML configuration file throughout the application, but, because I hated manipulating XML with AS2, I always converted the XML into arrays as soon as it was loaded.

Now with AS3 and E4X, using ActionScript to manipulate XML has made flash application development much easier.

The gpAS3Library is, to some degree, an ActionScript framework (albeit, in the very early stages). I use most of these classes in every Flash application that I develop. When I decided to convert these classes from AS2 to AS3, I realized that I needed a global configuration class to store the XML data that I loaded from the server. And with E4X, I can now easily retrieve the information I need from the XML lists.

Although I named this post Part 1, I have already discussed one of the classes of the gpAS3Libary in a previous post (see: A UrlLoader Class). In this post, I will discuss the gpConfig class.

What is the gpConfig Class?

Basically, the gpConfig class is a global configuration class that is used to store relevant application information that can be used throughout the Flash application. In PHP parlance, it is similar to using the define statement.

define('GALLERY_LOCATION', 'images/photogallery');

The main difference is that the values in the global configuration class are stored as xml and are not constants. The primary reason for using configuration file is that I can change certain aspects of the application (like colors) without having to recompile the Flash movie.

Loading the gpConfig class

To load the configuration class, I use the gpUrlLoader class. I load the configuration file before I load anything else into my Flash Movie.

package {
	import flash.display.Sprite;
	import flash.xml.*;
	import com.grasshopper.utils.*;
	public class portfolio extends Sprite {
		public static var config:gpConfig;
		private var configLdr:gpUrlLoader;
		public function portfolio() {
		private function init():void {
			var configUrl:String = gpGlobalUtils.getSwfParam("config_url", "config.xml");
			configLdr = new gpUrlLoader();
			configLdr.addEventListener(Event.COMPLETE, loadConfig);
			configLdr.init(configUrl, 'xml');
                private function loadConfig(e:Event):void  {
			var xmlData:XML = configLdr.getXML();
			config = new gpConfig(xmlData);

The following is a sample config file that I am using for my portfolio application:

<?xml version="1.0"?>
		<pStyles cType="page" borderSize="0" bgImage="images/background.jpg" />
		<pStyles cType="nav" borderSize="0" nW="10" nH="10" shape_type="circle" bgColor="0x66FF00" bgColorHover="#000000" bgColorSelected="0xFF6600" spacing="5" />
		<pStyles cType="portContent" title_tag="h3" title_properties="autoSize:center" domain_tag="p" domain_properties="autoSize:left" vistit_class="visit" desc_tag="p" desc_class="desc" desc_properties="autoSize:left,width:200,wordWrap:true" />
		<pStyles cType="btn" borderSize="0" nW="50" nH="20" shape_type="rectangle" corners="7,7,7,7" bgColor="0x66FF00" bgColorHover="0xff6600" fontColor="0x66FF00" fontColorHover="0xffffff" fontColorSelected="0xFF6600" tProperties="autoSize:center,background:true,backgroundColor:0x410B0B" tFormat="font:Arial,bold:true,align:center" />

Retrieving Values from the XML List

The XML global configuration file stores all values as xml attributes. Once the configuration file is loaded, I can retrieve a specific row by calling gpConfig’s getChildByAttrib method. So if I wanted to retrieve the navigation attributes, I would call:

var nav:XMLList = config.getChildByAttrib('pLayout', 'pStyles', 'cType', 'nav');

The getChildByAttrib method takes the following parameters:

parent_node: The parent node of the xml list. In the example xml file displayed above, the value would be ‘pLayout‘.

child: This parameter is the child node of the parent node. In the example xml file displayed above, the value would be ‘pStyles‘.

attribute: The attribute (the row) to search for within the child node. This is the key search attribute for the xml list. In the example xml file, this value is the cType attribute.

value:: The value of the attribute to search for. In the example xml file, I want to search for cType whose value equals ‘nav‘.

I can then retrieve the values from the xmllist:

var nWidth:int = nav@nW;
var color:Number = nav.@bgColor;

XMLList to Object

Another major method of the gpConfig class will convert the XMLList to an object. The method passes the same parameters as the getChildByAttrib method.

var nav:Object = config.getChildByAttribObject('pLayout', 'pStyles', 'cType', 'nav');

I can then access it’s values as I would any other object:

var nWidth:int = nav.nW;
var color:Number = nav.bgColor;

The getChildByAttribObject method calls the convertAttribsToObject method. This method is also a public method within the gpConfig class.

var myObject:Object = config.convertAttribsToObject(myXMLList)

The use of a global configuration class is not only beneficial, but is, in my opinion, essential to creating any flash application. The gpConfig class and the gpUrlLoader class have become the base for all of my flash application development (and are a crucial part of my gpAS3Library).

Currently the gpConfig class deals with XML attributes only. In future versions, I will add methods so that it can be used to manipulate any XML object.

Be Sociable, Share!

Checkout My New Site - T-shirts For Geeks