Henchmen

**I. Introduction**
Dr. Horrible is nothing if not thorough -- he does not choose henchmen based on their quantitative evil score alone but on a variety of detailed factors. Dr. Horrible needs you to construct a drill-down interface that allows him to access the individual characteristics of each henchman.

media type="custom" key="7939354" align="center"

**II. Learning Objectives**
//**Knowledge**// //**Skills**//

**V. Program**
sd code format="mxml"            

 <![CDATA[ import edu.nu.sesp.Student; import mx.collections.ArrayCollection; import spark.events.IndexChangeEvent;

private function init:void {				_students = parseStudentsXml(_studentsXml); _studentIds = getIds(_students); }

private function parseStudentsXml(studentsXml:XML):Array {				var students:Array = new Array; for each(var stdXml:XML in studentsXml.student){ var id:int				= int(stdXml.@id); var firstName:String	= stdXml.@firstName; var lastName:String		= stdXml.@lastName; var nickName:String		= stdXml.@nickName; var country:String		= stdXml.@country; var average:Number		= Number(stdXml.@average); var weapon:String		= stdXml.@weapon; var age:int				= int(stdXml.@age); students.push(new Student(id, firstName, lastName, nickName, country, average, weapon, age)); }				return students; }

private function getIds(students:Array):Array{ var ids:Array = new Array; for each(var student:Student in students){ ids.push(student.id); }				return ids; }

private function getStudent(id:int, students:Array):Student{ for each(var student:Student in students){ if(student.id == id){ return student; }				}				return null; }

private function idCombo_changeHandler(event:IndexChangeEvent):void{ var student:Student = getStudent(int(_idCombo.selectedItem.label), _students); displayStudent(student); }

private function displayIds(ids:Array):ArrayCollection{ var comboItems:ArrayCollection = new ArrayCollection; for each(var id:int in ids){ comboItems.addItem({label:id}); }				return comboItems; }

private function displayStudent(student:Student):void{ _name = student.firstName + ' "' + student.nickName + '" ' + student.lastName; _country = student.country; _average = String(student.average); _weapon = student.weapon; _age = String(student.age); }

]]>	</fx:Script> <s:BorderContainer x="10" y="10" width="306" height="149"> <s:Label x="10" y="15" text="Student id" fontWeight="bold"/> <s:ComboBox x="126" y="10" width="172" id="_idCombo" dataProvider="{displayIds(_studentIds)}" change="idCombo_changeHandler(event)" />		<s:VGroup x="9" y="45" width="115" height="95"> <s:Label text="Name" fontWeight="bold"/> <s:Label text="Age" fontWeight="bold"/> <s:Label text="Country" fontWeight="bold"/> <s:Label text="Weapon of choice" fontWeight="bold"/> <s:Label text="Average" fontWeight="bold"/> </s:VGroup> <s:VGroup x="129" y="46" width="169" height="93"> <s:Label text="{_name }" width="170"/> <s:Label text="{_age}" width="170"/> <s:Label text="{_country}" width="170"/> <s:Label text="{_weapon}" width="170"/> <s:Label text="{_average}" width="170"/> </s:VGroup> </s:BorderContainer> </s:Application>

code

sd code format="actionscript3" package edu.nu.sesp {	public class Student {		private var _id:int; private var _firstName:String; private var _lastName:String; private var _nickName:String; private var _country:String; private var _average:Number; private var _weapon:String; private var _age:int;

public function Student(id:int, firstName:String, lastName:String, nickName:String, country:String, average:Number, weapon:String, age:int) {			_id = id; _firstName = firstName; _lastName = lastName; _nickName = nickName; _country = country; _average = average; _weapon = weapon; _age = age; }

public function get id:int			{ return _id; } public function get firstName:String	{ return _firstName; } public function get lastName:String	{ return _lastName; } public function get nickName:String	{ return _nickName; } public function get country:String	{ return _country; } public function get average:Number	{ return _average; } public function get weapon:String		{ return _weapon; } public function get age:int			{ return _age; }

} } code

sd code format="xml" <student id="101" firstName="Johnny" lastName="Jones" 	 	nickName="Vector"	  country="USA" 		average="8.32" weapon="Freeze ray" 					age="21" /> <student id="102" firstName="Juan"  lastName="Martino" 	nickName="Dr. Gru"	   country="Spain" 		average="9.01" weapon="Shrink ray" 					age="38" /> <student id="103" firstName="Joseph" lastName="Smith" 		nickName="Little dragon"  country="USA" 		average="8.85" weapon="Nunchucks" 						age="18" /> <student id="104" firstName="Stacy" lastName="O'Neill" 	nickName="Natasha"         country="Ireland" 	average="8.91" weapon="Lazer" 				 					age="22" /> <student id="105" firstName="Aideen" lastName="Wu" 	 	nickName="Baroness"	  country="Japan" 		average="8.65" weapon="Robot" 										age="24" /> <student id="106" firstName="Zack"  lastName="MacFadden" 	nickName="Dr. Evil"	   country="Scotland" 	average="7.82" weapon="Irony" 										age="26" /> <student id="107" firstName="Aaron" lastName="Valentino" 	nickName="Bad boy"	   country="Italy" 		average="8.98" weapon="Sticks and stones" age="19" /> code

<span style="font-size: 1.3em; margin: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 5px;">**VI. Self-explain (Try it!)**
Go over each tag in the MXML program and explain out loud to yourself what it does. If you don't know exactly what the tag does, just try to guess for now.

<span style="font-size: 1.3em; margin: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 5px;">**IX. Check yourself**
==<span style="font-size: 1.3em; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 5px;">**<span style="font-size: 1.3em; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 5px;">**IX. Feedback** ** ==

<span style="font-size: 1.3em; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 5px;"> ==<span style="font-size: 1.3em; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 5px;">****<span style="font-size: 1.3em; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 5px;">**IX. References** **** ==

After Barry & Griffiths' Head First Programming