[Flash8] XML-driven drop-down menu

programming flash
1

Hello there everyone, I’ve been taking advantage of kirupa’s excellent tutorials for quite a while now, and lurked in the forums from time to time, but not registered until now. I’m finding myself having some problems that I seem to be unable to overcome, so I thought that I’d sign up and see if you guys could perhaps give me some help.

Ok, so I’ve been trying to create a variant of the XML-driven drop-down menu that instead of displaying the submenus to the right of the mainmenu inserts them inbetween the mainmenu elements thus:

mainmenuitem1
mainmenuitem2
  submenuitem1
  submenuitem2
  submenuitem3
  etc.
mainmenuitem3
mainmenuitem4
etc.

So, when creating the submenu, I need to move the mainmenu items that are below the submenu down so they reappear below the submenu.

I’m guessing that the way do do it is basically something like this:

  1. identify the mainmenu items that needs to be moved
  2. save their original y-coordinates (to be able to move them back afterwards)
  3. move them to their new coordinates

2 and 3 I have already pretty much figured out, but what I’m having trouble with is number 1. I know which mainmenu item I’m clicking (in this case ‘this’, or for example item1_mc), and then move the mainmenu items which are placed below it (in this case for example item2_mc, item3_mc, etc.). This of course needs to work dynamically within the recursive GenerateMenu function, and apply to any numbers of nestled submenus.

In the specific case I’m doing this:

_level0.mainmenu_mc.item2_mc._y = _level0.mainmenu_mc.item2_mc._y + bump_y;

where ‘bump_y’ is a variable that holds the number of pixels that the movieclip should be moved.

So, how can I do this for all following mainmenu items in a general way? I’m guessing I should use a for-loop, but how do I know which item to start with, and how do I know how to increment it? My background is as a designer and these kinds of programming subtleties are unfortunately sometimes beyond my current capabilities. I’d be extremely grateful if someone could help me with this in any way. Thank you!

Here is the entire actionscript code (it’s a simplified version of the code in the XML-driven drop-down menu tutorial):

// keeps track of number of items in a submenu	
var subitem_count = 0;
// generates a list of menu items (effectively one menu)
// given the inputted parameters.  This makes the main menu
// as well as any of the submenus
GenerateMenu = function(container, name, x, y, depth, node_xml) {
	// variable declarations
	var curr_node;
	var curr_item;
	var curr_menu = container.createEmptyMovieClip(name, depth);
	
	// for all items or XML nodes (items and menus)
	// within this node_xml passed for this menu
	for (var i=0; i<node_xml.childNodes.length; i++) {
		// movieclip for each menu item
		curr_item = curr_menu.attachMovie("menuitem","item"+i+"_mc", i);
		curr_item._x = x;
		curr_item._y = y + i*curr_item._height;
		curr_item.trackAsMenu = true;
		// count up the submenu item counter
		subitem_count++;
		
		//trace(subitem_count);
		
		// item properties assigned from XML
		curr_node = node_xml.childNodes*;
		//curr_item.action = curr_node.attributes.action;
		//curr_item.variables = curr_node.attributes.variables;
		curr_item.name_text.text = curr_node.attributes.name;
		
		// item submenu behavior for click event
		if (node_xml.childNodes*.nodeName == "page"){
			// open a submenu
			curr_item.node_xml = curr_node;
			curr_item.onRelease = function(){
				var x = this._x + 15;
				var y = this._y + this._height;
				//reset the submenu item counter
				subitem_count = 0;
				
				// call the main function to construct submenu
				GenerateMenu(curr_menu, "submenu_mc", x, y, 1000, this.node_xml);
				
				// number of pixels to bump down the below menuitems when
				// expanding a submenu
				bump_y = subitem_count*this._height;
				
				// TEST moving item when submenu is expanding TEST
				// THIS NEEDS TO BE DONE DYNAMICALLY AND GENERALLY
				_level0.mainmenu_mc.item2_mc._y = _level0.mainmenu_mc.item2_mc._y + bump_y;
				_level0.mainmenu_mc.item3_mc._y = _level0.mainmenu_mc.item3_mc._y + bump_y;
				
			};
		}else{ // nodeName == "item"
			//curr_item.arrow._visible = false;
			// close existing submenu
			curr_item.onRelease =  function(){
				curr_menu.submenu_mc.removeMovieClip();
				//trace(this);
				trace(subitem_count);
			};
		}
	} // end for loop
};

// create the main menu, this will be constantly visible
CreateMainMenu = function(x, y, depth, menu_xml){
	// generate a menu list
	GenerateMenu(this, "mainmenu_mc", x, y, depth, menu_xml.firstChild);
	//trace(subitem_count);
};

// closes all submenus by removing the submenu_mc
// in the main menu (if it exists)
CloseSubmenus = function(){
	mainmenu_mc.submenu_mc.removeMovieClip();
};

// This actions object handles methods for actions
// defined by the XML called when a menu item is pressed
Actions = Object();
Actions.gotoURL = function(urlVar){
	getURL(urlVar, "_blank");
};
Actions.message = function(msg){
	message_txt.text = msg;
};
Actions.newMenu = function(menuxml){
	menu_xml.load(menuxml);
};

// load XML, when done, run CreateMainMenu to interpret it
menu_xml = new XML();
menu_xml.ignoreWhite = true;
menu_xml.onLoad = function(ok){
	// create main menu after successful loading of XML
	if (ok){
		CreateMainMenu(41, 126, 0, this);
		message_txt.text = "message area";
	}else{
		message_txt.text = "error:  XML not successfully loaded";
	}
};
// load first XML menu
menu_xml.load("structure5.xml");