Making a custom glossary

Question

I want to make custom dictionary component that loads data from external xml and shows the related meaning. Here is XML file

<glossary>
 <alphabet id="A">
  <term heading= "Anchor" definition="A mechanical device that prevents a vessel from moving"/>
  <term heading= "Atlas" definition="A collection of maps in book form"/>
 </alphabet>
 <alphabet id="D">
  <term heading= "Delay" definition="Time during which some action is awaited"/>
 </alphabet>
 <alphabet id="D">
  <term heading= "Risk" definition="A source of danger; a possibility of incurring loss or misfortune"/>
  <term heading= "Rotate" definition="Turn on or around an axis or a center"/>
 </alphabet>
</glossary>

Below is the script. It shoul show the related definition when we click on term:

var xmlLoader:URLLoader= new URLLoader()
xmlLoader.load(new URLRequest("datalist.xml"))
xmlLoader.addEventListener(Event.COMPLETE, xmlLoaded)
var xmlData:XML= new XML()
//This function is called when the XML file is loaded
function xmlLoaded(e:Event):void {

 //Make sure we're not working with a null loader
 if ((e.target as URLLoader) != null ) {
  //Insert the loaded data to our XML variable
  xmlData= new XML(e.target.data)
  xmlData.ignoreWhitespace = true;
  //Call the function that creates the whole menu
  createMenu();
 }
}
function createMenu():void {
 //This will be used to represent a menu item
 var menuItem:MenuItem
 //Counter
 var i:uint = 0;
 //Loop through the links found in the XML file
 for each (var link:XML in xmlData.alphabet.term) {
  menuItem = new MenuItem();
  //Insert the menu text (link.@name reads the link's "name" attribute)
  menuItem.menuLabel.text = link.@heading;
  //If the text is longer than the textfield, autosize so that the text is 
  //treated as left-justified text
  menuItem.menuLabel.autoSize = TextFieldAutoSize.LEFT;
  //Insert the menu button to stage
  menuItem.x = 20;
  menuItem.y = 30 + i*25.3;
  //Make the button look like a button (hand cursor)
  menuItem.buttonMode = true;
  menuItem.mouseChildren = false;
  //Add event handlers (used for animating the buttons)
  menuItem.addEventListener(MouseEvent.MOUSE_DOWN, mouseDownHandler);
  //menuItem.addEventListener(MouseEvent.MOUSE_OUT, mouseOutHandler);
  addChild(menuItem);
  //Increment the menu button counter, so we know how many buttons there are
  i++;
 }
}

function mouseDownHandler(e:Event):void
{
 var trace(xmlData.alphabet.term.@definition)
}

Answer 1

You have different ways to achieve what you want:

1- You can add to your class MenuItem a field which will hold the definition you want

public class MenuItem {
 //...
 public var definition:String;
 //...
}
//...
function createMenu():void {
 //This will be used to represent a menu item
 var menuItem:MenuItem
 //Counter
 var i:uint = 0;
 //Loop through the links found in the XML file
 for each (var link:XML in xmlData.alphabet.term) {
  menuItem = new MenuItem();
  //Insert the menu text (link.@name reads the link's "name" attribute)
  menuItem.menuLabel.text = link.@heading;
  menuItem.definition = link.@definition;
 //...
 }
}
//...
function mouseDownHandler(e:Event):void
{
 var mi:MenuItem=e.currentTarget as MenuItem;
 if (mi!==null)
  trace(mi.definition);
}

2 - Use a dictionary that will map the heading to the definition:

//...
import flash.utils.Dictionary;
//...
var maps:Dictionary=new Dictionary(true);
//...
function createMenu():void {
 //This will be used to represent a menu item
 var menuItem:MenuItem
 //Counter
 var i:uint = 0;
 //Loop through the links found in the XML file
 for each (var link:XML in xmlData.alphabet.term) {
  menuItem = new MenuItem();
  //Insert the menu text (link.@name reads the link's "name" attribute)
  menuItem.menuLabel.text = link.@heading;
  maps[menuItem][email protected]();
 //...
 }
}
//...
function mouseDownHandler(e:Event):void
{
 var mi:MenuItem=e.currentTarget as MenuItem;
 if (mi!==null)
  trace( maps[mi] );
}

3 - Using e4x search to find the right definition from your text label

//...
function mouseDownHandler(e:Event):void
{
 var mi:MenuItem=e.currentTarget as MenuItem;
 if (mi!==null) {
  var heading:String=mi.menuLabel.text;
  trace( xmlData.alphabet.term.(@heading.toString()==heading).@definition);
 }
}