Hi
I am working on actionscript to generate a SWF dynamically using JSON data coming from an HTTP request. I receive the data on creationComplete and try to generate a tree like structure. I don’t create the whole tree at the same time. I create 2 levels, level 1 and level 2. My goal is to attach custom events on the panels which represent tree nodes. When users click the panels, it dispatches custom events and try to generate the next level. So, it goes like this :
On creation complete - get JSON- create top tow levels - click on level 2- create the level 2 and level 3 - click on level 3- create level 3 and 4. …and so on and so on. I am attaching my code with this email. Please take a look at it and if you have any hints on how you would do this if you need to paint a tree having total level number = “n” where( 0
import com.iwobanas.effects.*;
import flash.events.MouseEvent;
import flash.filters.BitmapFilterQuality;
import flash.filters.BitmapFilterType;
import flash.filters.GradientGlowFilter;
import mx.controls.Alert;
private var roundedMask:Sprite;
private var panel:NewPanel;
public var oldPanelIds:Array = new Array();
public var pages:Array = new Array();//cleanup
public var delPages:Array = new Array();
public function DrawPlaybook(pos:Number,title:String,chld:Object):void {
panel = new NewPanel(chld);
panel.title = title;
panel.name=title;
panel.width = 100;
panel.height = 80;
panel.x=pos+5;
panel.y=40;
// Define a gradient glow.
var gradientGlow:GradientGlowFilter = new GradientGlowFilter();
gradientGlow.distance = 0;
gradientGlow.angle = 45;
gradientGlow.colors = [0xFFFFF0, 0xFFFFFF];
gradientGlow.alphas = [0, 1];
gradientGlow.ratios = [0, 255];
gradientGlow.blurX = 10;
gradientGlow.blurY = 10;
gradientGlow.strength = 2;
gradientGlow.quality = BitmapFilterQuality.HIGH;
gradientGlow.type = BitmapFilterType.OUTER;
panel.filters =[gradientGlow];
this.rawChildren.addChild(panel);
pages.push(panel);
panel.addEventListener(MouseEvent.CLICK,
function(e:MouseEvent){onClickHandler(e,title,chld)});
this.addEventListener(CustomPageClickEvent.PANEL_CLICKED,
function(e:CustomPageClickEvent){onCustomPanelClicked(e,title)});
}
public function onClickHandler(e:MouseEvent,title:String,chld:Object):void {
//var panel:Panel;
for each(var stp1:NewPanel in pages){
if(stp1.title==title){
var eventObj:CustomPageClickEvent = new CustomPageClickEvent("panelClicked");
eventObj.panelClicked = stp1;
dispatchEvent(eventObj);
}
}
}
private function onCustomPanelClicked(e:CustomPageClickEvent,title:String):void {
//cleanup itself
Alert.show("onCustomPanelClicked" + title);
var panel:NewPanel;
for each(var stp:NewPanel in pages){
startAnimation(e,stp);
}
if(title == e.panelClicked.title){
panel = new NewPanel(null);
panel.title = title;
panel.name=title;
panel.width = 150;
panel.height = 80;
panel.x=100;
panel.y=40;
this.rawChildren.addChild(panel);
//
var slideRight:SlideRight = new SlideRight();
slideRight.target=panel;
slideRight.duration=750;
slideRight.showTarget=true;
slideRight.play();
//draw the steps
var jsonData = this.map.getValue(title);
var posX:Number = 50;
var posY:Number = 175;
for each ( var pnl:NewPanel in pages){
pages.pop();
}
for each ( var stp1:Object in jsonData.children){
//Alert.show("map step=" + stp.text );
panel = new NewPanel(null);
panel.title = stp1.text;
panel.name=stp1.id;
panel.width = 100;
panel.id=stp1.id;
panel.height = 80;
panel.x = posX;
panel.y=posY;
posX+=150;
var s:String="hi" + stp1.text;
panel.addEventListener(MouseEvent.CLICK,
function(e:MouseEvent){onChildClick(e,s);});
this.addEventListener(CustomPageClickEvent.PANEL_CLICKED,
function(e:CustomPageClickEvent){onCustomPnlClicked(e)});
this.rawChildren.addChild(panel);
// Alert.show("map step=" + this.getChildIndex(panel) );
// oldPanelIds.push(panel);
pages.push(panel);
//this.addEventListener(CustomPageClickEvent.PANEL_CLICKED,
//function(e:CustomPageClickEvent){onCustomPanelClicked(e,title)});
var slide:SlideUp = new SlideUp();
slide.target=panel;
slide.duration=1500;
slide.showTarget=false;
slide.play();
}
}
}
public function onChildClick(e:MouseEvent,s:String):void {
//var panel:Panel;
//Alert.show(e.currentTarget.title);
for each(var stp1:NewPanel in pages){
if(stp1.title==e.currentTarget.title){
var eventObj:CustomPageClickEvent = new CustomPageClickEvent("panelClicked");
eventObj.panelClicked = stp1;
dispatchEvent(eventObj);
}
}
}
private function onCustomPnlClicked(e:CustomPageClickEvent):void {
for each ( var pnl:NewPanel in pages){
pages.pop();
}
//onCustomPanelClicked(e,e.currentTarget.title);
//Alert.show("hi from cstm" + e.panelClicked.title);
}
private function fadePanel(event:Event,panel:NewPanel):void{
panel.alpha -= .005;
if (panel.alpha <= 0){
//Alert.show(panel.title);
panel.removeEventListener(Event.ENTER_FRAME,
function(e:Event){fadePanel(e,panel);});
};
panel.title="";
}
private function startAnimation(event:CustomPageClickEvent,panel:NewPanel):void{
panel.addEventListener(Event.ENTER_FRAME,
function(e:Event){fadePanel(e,panel)});
}
Thanks in advance.
Palash
