kreativeKING - Interactive Developer

• 
  

  Languages

  
  

  - Actionscript 3.0



• 
  

  Purpose

  
  

  - A basic calls to build preloaders from. It is meant to act as a starting point to build more advanced preloaders. It is available for free download



• Download Here

• 
  

  Languages

  
  
  
  

  - Actionscript 3.0



• 
  

  Brief

  
  
  
  

  - This Actionscript 3.0 Class allows for multiple XML files to be loaded and stored for future use by way of a name or index number. I use this class in all of my XML powered projects.



• Download Here


• Watch ScreenCast

Fixed a small bug that was confusing the names and actual data. Link in the last post has been updated to the bug fixed version. This is just a courtesy posy to the ones who have already downloaded the class to download it again. Enjoy and keep me updated on bugs you may find or features you would like in the future.

I’m always available @cg219.


Download Link

I have finally gotten around to updating the XMLLoader Class now, in its 3rd Release. With this release comes a couple new properties such as bytesLoaded, bytesTotal, totalItems, currentItem and ratioLoaded. The biggest update is the new naming feature. With this feature you can now give each XML file a name to reference it. Also in the big boat of updates is the new way of handling errors.


The new naming feature is meant to replace the old naming feature in version 2.0. TO refresh everyone’s memories, the older version would automatically name the file for you by using the actual name of the file. If there happened to be more than one file that had the same name, it would attach a number depending on its spot in the Array. I’ve come to realize, this way was really unproductive and annoying. So to combat that, I created a new naming feature. This naming feature allows you to call each XML file anything you you want.

In order to use this new feature, you must pass in another Array which contains the names in the order that the XML files are being loaded in. For Example:

package
{
	import com.clementegomez.utils.XMLLoader;
	import flash.display.*;
	import flash.events.*;

	public class XMLDoc extends MovieClip
	{
		public var xl:XMLLoader;
		public var array:Array;
		public function XMLDoc()
		{
			xl = new XMLLoader();
			array = new Array();
			xl.addEventListener(Event.COMPLETE, loaded);

			xl.loadXML(["http://flashden.net/feeds/user_item_comments/cg219.atom", "http://feeds2.feedburner.com/kreativeking?format=xml"], ["xml1", "xml2"]);
		}

		private function loaded(e:Event):void
		{
			trace(xl.data["xml1"]);
		}
	}
}

In the previous example, we pass in a second array of strings to the loadXML() function. the first string “xml1” will be the name of the first XML file in the array and “xml2” refers to the second. With this, you can reference the XML file by name later on in code rather than its index number.

The new properties include ratioLoaded which returns the amount of items loaded to the total amount of items as a Number between 0 and 1. The currentItem property returns the number of the current XML being loaded and the totalItems property returns the total amount of XML files. The bytesLoaded and bytesTotal return those properties of the current XML file being loaded.

The new Error handling has been improved as well. A new property has been added called skipErrors. This is set to true by default. When this property is set to true, if there happens to be an error in the Array of XML files such as a dead link or misspelled url, it will be skipped and the loading process will continue. This is set to true by default, so if you would like to receive the Error messages, set this property to false.

Official Documentation can be found here
Download the Class files here

I been thinking of ways to preload things in AS3 like you would in AS2. Meaning a simple drag and drop and it preloads. I unfortunately couldn’t come to a solution of just drag and drop. But I have gotten pretty damn close. Last night I started working on a Basic Preloader Class in which I can build more complex preloaders off of. Just like some of the classes in my VIdeoPlayer API, the Base Class gets replaced with BasicPreloader to give it its functionality.


All the BasicPreloader does is load the content, whether is be a Loader or URLLoader operation, show the progress and a complete function. In addition I added a render function which I will build more upon in an Extended class to show some sort of animation. Here is the syntax:

BasicLoader.load(urlString, loaderOrURLLoader);

The Load function takes two parameters. First it takes a string path of the file you want to load. Secondly it takes a string to represent if you are want to use a URLLoader procedure or Loader procedure. To pass the second parameter, it’s best to use the constants packaged with Class which are BasicPreloader.URLLOADER and BasicPreloader.LOADER.

That is the only public function in the class. The other functions protected and can be accessed through class extensions. I hope this will help people out in the community. If you know of any other features that should be added to the Base Class, don’t hesitate to drop me a line or end me a tweet.




Download Here

Here is the Class:

/**
 * @author Clemente Gomez.
 * @email zomegpro@gmail.com.
 * @link http://blog.kreativeking.com.
 * @build 1.0 (03-23-09)
 * @description Base class to preload assets
 *
 * @public constants:
 * 					LOADER:String;
 * 					URLLOADER:String;
 *
 * @public properies:
 * 					bytesLoaded:Number;
 * 					bytesTotal:Number;
 * 					precentage:Number;
 * 					roundedPercentage;
 *
 * @public methods:
 * 					BasicPreloader() - Constructor.
 * 					load($url:String, $type:String = LOADER):void
 *
 */
package com.clementegomez.utils.preloaders
{
	import com.clementegomez.events.ParamEvent;
	import com.clementegomez.utils.LoaderHelper;

	import flash.display.Loader;
	import flash.display.Sprite;
	import flash.events.Event;
	import flash.events.ProgressEvent;
	import flash.net.URLLoader;
	import flash.net.URLRequest;

	public class BasicPreloader extends Sprite
	{
		public static const LOADER:String = "loader";
		public static const URLLOADER:String = "urlLoader";

		private var url:URLRequest;
		private var loader:Loader;
		private var urlLoader:URLLoader;
		private var loadedBytes:Number;
		private var totalBytes:Number;
		private var percent:Number;
		private var loaderHelper:LoaderHelper;

		/**
		 * The BasicPreloader class is the Base for preloaders. It has all the basic function of
		 * a preloader. This can be either attached to MovieClip in the library or created dynamically in
		 * Actionscript 3.0. When attached to a MovieClip you can call the loader at anytime to load your content. This
		 * class by itself isn’t much visually, this class is mainly to be build upon to create more powerful
		 * preloaders.
		 *
		 * @return = null;
		 */
		public function BasicPreloader()
		{
			init();
		}

		private function init():void
		{
			trace(“Basic Preloader Initialized”);
		}

		/**
		 * THe load function starts the loading process of the asset. The load function accepts two parameters. The
		 * first being a String to the asset being loaded and the second being a string to describe
		 * the type of load procedure to use;
		 *
		 * @param $url String path to the asset to be loaded.
		 * @param $type BasicPreloader.LOADER to use the Loader procedure or
		 * BasicPreloader.URLLOADER to use the URLLoader procedure.
		 * @default BasicPreloader.LOADER
		 *
		 * @return null
		 * @example Here is an example of the loade function.
		 *
		 * 
		 * BasicPreloader.load(“examplePic1.jpg”, BasicPreloader.LOADER);
		 * 
		 *
		 *
		 */
		public function load($url:String, $type:String = LOADER):void
		{
			if($type == LOADER)
			{
				loader = new Loader();
				loaderHelper = new LoaderHelper(loader, $type);
				loaderHelper.addEventListener(ParamEvent.PARAM, complete);
				loaderHelper.addEventListener(ParamEvent.PERCENT, showProgress);
				loader.load(new URLRequest($url));
			}
			else if($type == URLLOADER)
			{
				urlLoader = new URLLoader();
				loaderHelper = new LoaderHelper(urlLoader, $type);
				loaderHelper.addEventListener(ParamEvent.PARAM, complete);
				loaderHelper.addEventListener(ParamEvent.PERCENT, showProgress);
				urlLoader.load(new URLRequest($url));
			}
			else
			{
				throw new Error(“Type must be of class Loader or URLLoader”);
			}
		}

		protected function showProgress(e:ParamEvent = null):void
		{
			loadedBytes = ((e.target as LoaderHelper).progress as ProgressEvent).bytesLoaded;
			totalBytes = ((e.target as LoaderHelper).progress as ProgressEvent).bytesTotal;
			percent = (loadedBytes / totalBytes) * 100;
			dispatchEvent(((e.target as LoaderHelper).progress as ProgressEvent).clone());
			render();
		}

		protected function render():void
		{
			trace(“animation : ” + percent);
		}

		protected function complete(e:ParamEvent = null):void
		{
			loaderHelper.removeEventListener(ParamEvent.PARAM, complete);
			loaderHelper.removeEventListener(ParamEvent.PERCENT, showProgress);
			dispatchEvent(((e.target as LoaderHelper).event as Event).clone());
		}

		/**
		 * Return the amount of loaded bytes.
		 * @return Number
		 */
		public function get bytesLoaded():Number
		{
			return loadedBytes;
		}

		/**
		 * Return the amount of total bytes.
		 * @return Number
		 */
		public function get bytesTotal():Number
		{
			return totalBytes;
		}

		/**
		 * Return the percentage of loaded bytes.
		 * @return Number
		 */
		public function get percentage():Number
		{
			return percent;
		}

		/**
		 * Return the percentage rounded to the nearest interger of loaded bytes.
		 * @return Number
		 */
		public function get roundedPercentage():Number
		{
			return Math.round(percent);
		}
	}
}

I finally released the kreativeKING Videoplayer API. I’m sure you all remember the old VideoViewer and ProgressionBar classes. Well this new set of API does away with those and replaces with a plethora of new classes to make your video player creating processes much easier. Spend more time on design than on programming. Some of the 10+ classes released are VideoWindow ( Replacement of the VideoViewer Class ), VideoPanel ( ProgressionBar replacement) and the VideoControl Classes. These are the main 3 classes that you will be using to the video players logic. I will post later on a short tutorial on creating a video player using the API.



The new API allows you to load movies via flashVars or XML. Playlist support through the XML method. Keep the amount of code to a minimum of about 10 lines and your code is done. I have posted documentation online of the API for reference here. This version of the documentation will have some small changes coming in the next day or two as the API has been updated since I uploaded the documentation. But the gist of it is correct.

To get your hands on the API, you have to purchase one of my video player products from FlashDen. I know alot of people probably are ready to go to a different page after reading that, but I think its fair for the amount of time I put into creating it. Also it’s cheap, only $15. But since I’m a nice guy, I will be releasing a LITE version for free for other to play around with in the next coming weeks, even days actually. SO be on the lookout for that. I will be posting it up here once it’s completed.

Here is a small sample of what the code looks like for a completed video player

var vControl:VideoControl = new VideoControl();
var panel:VideoPanel = new VideoPanel(movie, cBar.progress);
var assets:Array = [movie, panel, cBar.playB, cBar.muteB];

movie.addEventListener(Event.COMPLETE, setupMovie);

vControl.setupAssets(assets);
vControl.useXML();

function setupMovie(e:Event):void
{
	vControl.setup();
}

This code creates a video player with a mute button, playPause button and progressbar.
Nice right =D

Well I will leave you all with that and some important links.

AS3 XML FlashVar VideoPlayer v1.0 w/ CG VideoPlayer API

kreativeBackground v1 - AS3 Video Background w/ CG VideoPlayer API


kreativeKING ViedoPlayer API Documentation

Yup, you read that right, I am now a developer on FlashDen. I know a lot of you are saying OH NOOOOO no more free stuff. On the contrary, I will still be releasing free content on the site as well as premium content on FlashDen. Most likely I will be releasing basic versions for free and more advanced versions with more features on FlashDen.



I hope everyone one supports me on this and keeps visiting the blog. First item I have up there is a more advanced version of the Fade In Gallery In this I have removed the link to this lass due to some bugs I have found in the class. So the only way to get this particular class is through FlashDen at this link

http://flashden.net/item/fade-in-gallery/20495

Everything else is still available. Again thanks for the support, and look out for more things in the future.

I’ve been getting some complaints about the XMLLoader.

First I have to say I missed a file when packaging it for distribution. I have already fixed that and you can redownload to get the updated package.

Secondly, for people getting a host of errors and the Error message is “Loading Failed”. This is because you have cacheBuster set to true. The cacheBuster must be set to false when testing locally.

If any other bugs pop up, don’t hesitate to drop me a line. Thanks again for the feedback, this wouldn’t have been caught without your help.

Enjoy


Download XMLLoader Class 2.0 Here

**Update**
http://blog.kreativeking.com/2008/10/xmlloader-20-updatexmlloader-20-update/

I have been working hard on making this as robust and stable as possible. This release should be able to do anything you would like with loading XML. Couple of new features from 1.8 the community has been emailing me about as well as some that I wanted to include in past versions. I will be releasing a video tutorial on how to use this class properly. I’ll explain the new features to hold you over until then.

New Constructor

XMLLoader($url:Array = null, $cache:Boolean = false):void

In 2.0, the XMLLoader constructor now takes 2 parameters. The first, being the same as in past versions, an Array of the xml files being loaded. The second being a new feature called cacheBuster which I will get more into bit later. By default these are set to null and false respectively.

New Cachebuster Feature

XmlLoader 2.0 introduces the new Cachebuster feature. This feature allows you to always load up an up to date version of your XML File. This is will make it so your flash application will not used cached files. This parameter is takes a boolean value and can be set in two ways. One being in the constructor shown above. The second is by setting the cacheBuster property.

XMLLoader.cacheBuster = true;
XMLLoader.cacheBuster =false;

New way of referencing load XML’s

In past versions, to access a certain loaded XML file. Something like the code below would be used.

XMLLoader.getList["xmlfile.xml"];

In 2.0 the file extension is no longer accepted, just the name of the file like below.

XMLLoader.getList["xmlfile"];

Also in 2.0, if you have two loaded files that happen to have the same name. To access the other files after the first. You only need to put the name + underscore + array index. Here is an example.

var testXML:XMLLoader = new XMLLoader(["test.xml", "test2.xml", "test.xml", "test2.xml", "test.xml", "test2.xml"], true);
testXML.addEventListener(Event.COMPLETE, doIT);

function doIT(e:Event)
{
	var list:XML;
	list = testXML.getList["test_4"];
	trace(list);
}

In the above code, the last test.xml will be loaded. The array index is its spot in the url array.

Those are the main new features in 2.0. Some other under the hood work includes some better error catching and proper event dispatching. The video tutorial should be out before the month is out as well as a new ite to host them, so look out for that. As always, let me know of any bugs and suggestions nd I will try to get to them ASAP.

Enjoy

Download XMLLoader Class 2.0 Here

**Update**
XMLLoader 2.0 « Cleck Here

**UPDATE**
Build 1.8 had some back end updates.

• Complete Event doesn’t dispatch early


• XML Root is now passed instead of just the children

Syntax is still the same

As many of you may already know, I built an XMLLoader class couple months ago. I have steadily been adding more features and making it more robust and easier to use. In this release v.1.6, 2 new features are introduced. You can now choose which list to get by the name of the xml file and now there is a new function to load xml outside of the constructor.


Here is an example of calling a list by ts name instead of the array number.

import com.clementegomez.utils.XMLLoader;

var testXML:XMLLoader = new XMLLoader();

testXML.loadXML(["test.xml", "test2.xml", "test.xml", "test2.xml"]);

testXML.addEventListener(Event.COMPLETE, doIT);

function doIT(e:Event)
{
	var list:XMLList;
	list = testXML.getList["test2.xml"];
	trace(list);
}

The getList property returns an array, so to reference a list by its name you place the name within the [ ] brackets. Simple enough. You can still reference lists by there array number if this is more convenient for you.

The second new feature is the loadXML function. This basically does what the constructor did in previous versions. In the above code you can see how it is used. This is if you rather not load up your xml files in constructor. This can also be useful to define the XMLLoader and load your xml files later on in your script.

I hope you find this useful. Enjoy and like always suggestions and bug reporting is welcome.

Download XMLLoader Class Here