Hi. I used to be a pretty cute girl, but over the last couple of hours I have torn most of my hair out and am considering smashing my face in with my keyboard. I’m not normally this violent, but I can’t figure this out and it is driving me absolutely insane.
Here is what I am trying to do-- I am using an expandable xml loading tree menu-- works great I love it. Currently you click on an item, and then the menu will expand to show the children items as long as that item is selected. When you click on a different item it will hide those items and display the children of the next item. The client wants the menu to be opened to the children on load for one of the items.
Here is an example of what I sorta mean
if the whole menu was open showing all the children it would look like this:
item0
item1
—sub11
—sub12
item2
—sub21
—sub22
item3
item4
—sub41
This is how the menu currently looks on load:
item0
item1
item2
item3
item4
This is the state I need to menu to open in, but be able to change out of when the next item is clicked:
item0
[COLOR=Red]item1[/COLOR]
—sub11
—sub12
item2
item3
item4
(The red is there because the item should appear selected as well).
Here are some variable for the specific item I am looking to open
[COLOR=Red]clip[/COLOR] = _level0.swfloader.menu.item_0_2
[COLOR=Red]beginningindex[/COLOR] =2
[COLOR=Red]level [/COLOR]=0
[COLOR=Red]current[/COLOR] =_level0.swfloader.menu.item_1_1
[COLOR=Red]i[/COLOR]= 1
Here is the code( or the relevant code I might say): Headache{
[INDENT]
var myxml:XML=new XML();
myxml.ignoreWhite=true;
myxml.onLoad=function(){
buildMenu();
}
var menualpha = 0;
//***********************************
var STEPY:Number=25; //<- height of every menu item
var STEPX:Number=20; //<- Width offset for every menu level referred to the previous level's _x position
var text_rolloutColor:Number=0x999999; //<- color for rollout
var text_rolloverColor:Number=0xffffff; //<- color for rollover
var leftBarColor:Number=0xffffff; //<- color for the little bar on the left
var ref : Object = this; // for scope issues.
//**************************************
myxml.load("menu.xml");
//*********************
//Menu build function
function buildMenu():Void{
for(var i:Number=0;i<myxml.firstChild.childNodes.length;i++)
{
var current=menu.attachMovie("menuItem","item_0_"+i,i); //<- current menu item
current._y=current.initialY=i*STEPY; //<- initial menu item's position
current.xml=myxml.firstChild.childNodes*; //<- here I store current xml node in a property of the current item
current.level=0; // items are at level 0 of my xml tree
current.idx=i; //<- here I store current loop index
current.selected=true; //<-flag which tells me if the current item is selected (clicked) or not
current.txt._alpha=0;
current.txt.alphaTo(100,.2,"easeOutSine",.05*i);
setInitialColors(current);
current.txt.text=current.xml.attributes.n;
current.onRollOver=function(){ //<- handler for the onRollOver event
if(!this.selected)
this.txt.colorTo(text_rolloverColor,.2,"easeOutSine");
}
current.onRollOut=function(){//<- handler for the onRollOut event
if(!this.selected)
this.txt.colorTo(text_rolloutColor,.1,"easeOutQuad");
}
current.onPress=function(){
//check the elements in the menu and check their level of xml-depth (stored in .level property)
for(var k in this._parent)
{
if(this._parent[k].level==this.level) //this is what I do with items located in xml with the same xml-depth of current clicked item
{
this._parent[k].ySlideTo(this._parent[k].initialY,.2,"easeOutSine");
this._parent[k].selectionBar.alphaTo(0,.2,"easeOutSine");
this._parent[k].selected=false;
if(this._parent[k]==this) //this is was happens on the menu item I've just clicked
{
executeAction(this._parent[k].xml.attributes.id); //Action execution associated to current item (in this case I just pass a string for testing purpose)
this._parent[k].selected=true;
this._parent[k].selectionBar.alphaTo(100,.3,"easeOutSine",0,function(){
addLevel(this._parent); //I add (if any) the children of clicked item
});
}
else
this._parent[k].onRollOut();
}
else if(this._parent[k].level>this.level) //if there are any "expanded" menu items of major level than the current's clicked item, I remove them
{
this._parent[k].selected=false;
removeMovieClip(this._parent[k]);
}
}
}
}
}
[COLOR=Gray]//Function for adding child items on the menu considering the item I've just clicked[/COLOR]
function addLevel(clip:MovieClip):Void{
var newLevel=(clip.level+1); //new level of xml-depth for the items I'm rendering
var itemsNumber=clip.xml.childNodes.length; //number of children in the xml associated to the clicked item
expand(clip.level,clip.xml,clip.idx) //ok let's go with some movement
for(var i:Number=0;i<itemsNumber;i++)
{
var current=menu.attachMovie("menuItem","item_"+newLevel+"_"+i,newLevel*100+i);
current.idx=i;
current.level=newLevel;
current.xml=clip.xml.childNodes*;
current.txt.text=current.xml.attributes.n;
setInitialColors(current); // initial color set
current._alpha=0;
current.alphaTo(100,.2,"easeOutSine",.2+.05*current.idx);
current._y=current.initialY=clip.initialY+STEPY+current.idx*STEPY;
current._x=newLevel*STEPX; //horiziontal distance of current from the just-clicked element
current.onPress=clip.onPress; //here I associate the same click action as the just-clicked item to the current item
current.onRollOver=clip.onRollOver;
current.onRollOut=clip.onRollOut;
}
}
var positionsArray:Array=new Array(); [COLOR=Gray]//array where I store all the positions of current active menu items[/COLOR]
[COLOR=Gray]//chained movement function for existing items on the stage[/COLOR]
function expand(level:Number,xml:XMLNode,beginningIndex:Number):Void{
trace(beginningIndex + "_this is the beginning index");
trace (level + "this is the level");
trace(xml +"this is the sml");
var itemsNumber=xml.childNodes.length;
positionsArray[level]=itemsNumber;
for(var k in menu)
{
if(menu[k].level==level && menu[k].idx>beginningIndex)
{
menu[k].newY=menu[k].initialY+itemsNumber*STEPY;
menu[k].ySlideTo(menu[k].newY,.4,"easeOutSine");
}
else
menu[k].newY=menu[k].initialY;
}
if(level>0)
{
for(var i:Number=(level-1);i>=0;i--)
{
var maxY=0;
for(var k in menu)
if(menu[k].level==i+1 && menu[k].newY>maxY)
maxY=menu[k].newY+STEPY;
for(var k in menu)
if(menu[k]._y>menu[k].initialY && menu[k].level==i)
{
var alt=0;
for(var j=i;j<=level;j++)
alt+=positionsArray[j]*STEPY;
menu[k].newY=menu[k].newY+alt;
menu[k].ySlideTo(menu[k].newY,.4,"easeOutSine");
}
}
}
}
[/INDENT]} Any one out there who can help?
