attachMovie dynamically in component function

[andrehines]

I am trying to attach a movie dynamically to the stage and reference its variables from a response from a php script. This method works fine in regular timeline coding, but when it is in a component class, it wont attach the movies dynamically when the component loads up. Please help.



import mx.core.*;
import mx.containers.*;
import mx.controls.*;
import mx.transitions.easing.*;
//Associate custom component image
[IconFile("Menu.png")]


//declare the class and identify the parent class

dynamic class mx.controls.Menu.phpMenu extends mx.core.UIComponent{



//identify the symbol name that this class is bound to
static var symbolName:String = "phpMenu";
//identify the fully qualified package name of the symbol owner
static var symbolOwner:Object = Object(mx.controls.Menu.phpMenu);
//provide the className variable
var className:String = "phpMenu";

//Declare all movieclips and properties going to be used in component
private var mainCategoryLoader:LoadVars;
private var subCategoryLoader:LoadVars;
private var mcHolder:MovieClip;
private var backGround:MovieClip;
private var scroller:ScrollPane;
private var scrollPaneContent:MovieClip;
private var subCategory:String;
private var i:Number;
private var nexty:Number;
private var randInt:Number;
private var _rootURL:String;
private var _fileName:String;
public var statusBox:String;
public var headerBox:TextField;


//constructor
function phpMenu(){}

//Create children
private function createChildren():Void{

}

//define init method for this component, and initialize super class
public function init(Void):Void {
super.init();
randInt = int(Math.random() * 123456789);
loadMainCategories(_rootURL, _fileName, randInt);
}

//Draw
private function draw():Void{
super.draw();
this.scroller.contentPath = "scrollPaneContent";

}



//Introduce property inspector parameters
[Inspectable(defaultValue="menuLoad.php")]
public function set fileName(theFile:String){
if(theFile == ""){
trace("Please fill in a file name");
}else{
_fileName = theFile;
trace("file name is " + _fileName);
}
}

[Inspectable(defaultValue="http://")]
public function set rootURL(theRoot:String){
if(theRoot == "http://"){
trace("Please fill in a root directory.");
}else{
_rootURL = theRoot;
trace("root URL is " + _rootURL);
}
}



//declare main menu load function
public function loadMainCategories(u,f,r):Void{
mainCategoryLoader = new LoadVars();
mainCategoryLoader.handler = this;
mainCategoryLoader.sendAndLoad(u + f + "?" + r, mainCategoryLoader, "POST");
mainCategoryLoader.onLoad = function(success){
if(this.status = "ok"){
trace("loaded successfully");
trace("url is " + u + f + "?" + r);
nexty = 0;
trace("nexty is set to " + nexty);
this.headerBox.text = this.header;
for(i=0;i<this.mainCategoryCount;i++){
trace("i = " + i);
trace("header = " + this.header);
trace(this["mcHolder" + i]);
trace("nexty is set to " + nexty);
scroller.content.attachMovie("mcHolder", "mcHolder" + i, getNextHighestDepth());
//scroller.content["mcHolder"+i].subCategory.text = this["mainCategory" + i];
setProperty(scroller.content["mcHolder"+i],_y,nexty);

scroller.invalidate();

trace(scroller.content["mcHolder"+i]._height);
}

}else if(mainCategoryLoader.status = "error"){
trace("Sorry, loaded unsuccessfully");
statusBox = mainCategoryLoader.error;
}else{
trace("No response from Database");
statusBox = "Loading Menu...";
}
}
}

}

[andrehines]

Ok I figured it out! Heres the solution for anyone building an AS 2.0 Component and using LoadVars. In your class, when referencing your component, you can use the "this" keyword, or opt not to. Either way AS 2.0 recognizes the reference to your component. However, if you create a LoadVars object in your class, you can not reference it as you would normally in the timeline. For example:

//On a main timeline using procedural programming
var loader:LoadVars = new LoadVars();
this.loader.sendAndLoad("url", loader, "POST");
this.loader.onload.... etc.


This method will work fine, but in a class everything becomes one big f*&king mess! When you first initialize a new LoadVars() object, everything is still the same and your component will still reference itself as normally, but once you get into the "onload" function the whole scope of the component changes. You will not be able to reference properties, or objects normally anymore, until you are back out of the "onload" function again. That means that any code inside of the "onload" function cannot reference the component using the "this" keyword or leaving it out. This is because the keyword "this" now references the initialization properties of the "onload" function, meaning that "this" keyword is now actully referencing the loader LoadVars Object. So to access the information loaded into the loader, you must use the keyword "this", and not the LoadVars object name, which in this case would be "loader". for example:


//In your component class .as file using OOP programming
var loader:LoadVars = new LoadVars();
this.loader.sendAndLoad("url", loader, "POST");
this.loader.onload = function(success){
trace(this.loadedInformation); // This method will work properly
trace(loader.loadedInformation); // This method will NOT work
trace(this.loader.loadedInformation); // This method will NOT work
}


So now you probably are asking, how da f*&k am I going to access the component within the "onload" function, in order to attachMovies dynamically, createEmpty movies, etc. Well the trick is to create a scope that you will be able to reference while still in the "onload" function. You do this by just assigning "this" to a LoadVars variable before sending or loading. This variable will stick with the LoadVars object and you would reference the component, as if you were referencing a variable within the LoadVars object. This in turn will reference the component, and not the "loader" LoadVars object. for example:


//In your component class .as file using OOP programming
var loader:LoadVars = new LoadVars();
loader.scopeHandler = this; //Assigning "this" component to this handler variable
this.loader.sendAndLoad("url", loader, "POST");
this.loader.onload = function(success){
trace(this.loadedInformation); // Pretend loaded Information is a swf file called file.swf
this.scopeHandler.attachMovie(this.loadedInformati on, "new_nameMC", getNextHighestDepth());
}