<?xml version="1.0" encoding="utf-8"?>
<mx:Application
xmlns:mx="http://www.adobe.com/2006/mxml"
xmlns:vzg="http://vizsage.com/vzg"
xmlns:sz="src.*"
creationComplete="{ggCreationComplete()}"
layout="absolute" width="100%" height="100%" horizontalCenter="0"
backgroundColor="#ffffff" backgroundGradientColors="[#ffffff,#ffffff]" viewSourceURL="srcview/index.html">
<mx:HTTPService id="metroStations" url="assets/WashingtonMetroStations.xml" resultFormat="e4x"
result="SubwayDef.metroFeedResultHandler(event);"
fault= "SubwayDef.feedFaultHandler(event);"/>
<mx:HTTPService id="stationTopologyXML" url="assets/StationTopology.xml" resultFormat="e4x"
result="SubwayDef.topologyFeedResultHandler(event);"
fault= "SubwayDef.feedFaultHandler(event);"/>
<mx:Canvas width="1010" horizontalCenter="0">
<mx:HBox right="10" height="30" top="3">
<mx:Label text="Zoom:" top="10" right="320"/>
<mx:Label id="ZoomFactorChooserMinLabel" text="0.8"/>
<mx:HSlider right="10" width="300" top="10" height="25" id="ZoomFactorChooser" allowTrackClick="true"
value="0.8" minimum="0.8" maximum="7" snapInterval="0.05"
change="setZoomFactor(ZoomFactorChooser.value);"/>
<mx:Label text="7"/>
</mx:HBox>
</mx:Canvas>
<mx:TabNavigator top="10" backgroundAlpha="0.0" id="Map" width="100%" height="100%" horizontalCenter="0">
<mx:HBox label="Map" left="0" right="0" top="0" backgroundAlpha="0">
<mx:Canvas height="100%" clipContent="true" horizontalScrollPolicy="off" verticalScrollPolicy="off" width="100%">
<sz:ImageDeformer id="SubwayDef" width="100%" height="100%">
<mx:Image id="LoadingBitmap" width="800" height="800" source="@Embed(source='assets/images/GraphPaperLoading-800.png')" horizontalCenter="0" verticalCenter="0"/>
</sz:ImageDeformer>
</mx:Canvas>
<mx:VBox height="800">
<mx:Label text="Choose a departure station" width="200" textAlign="center"/>
<mx:List id="StationOfInterestChooser" width="200" height="100%" selectedIndex="0"
dataProvider="{SubwayDef.stationDataProvider}" labelField="name" change="setStationOfInterest(event);" backgroundAlpha="0.0"/>
<mx:RadioButtonGroup id="MetricChooser" change="setGeometry(MetricChooser.selectedValue as String)"/>
<mx:Label text="Reshape Distances to Show" width="200" textAlign="center"/>
<mx:RadioButton label="Geography" groupName="MetricChooser" value="Geographic" width="200"/>
<mx:RadioButton label="Clarified (Tube-style) Map" groupName="MetricChooser" value="Clarified" selected="true" width="200"/>
<mx:RadioButton label="Time from this station" groupName="MetricChooser" value="metric:time" width="200"/>
<mx:RadioButton label="Miles from this station" groupName="MetricChooser" value="metric:miles" width="200"/>
<mx:RadioButton label="Cost (Regular Fare)" groupName="MetricChooser" value="metric:fareRegular" width="200"/>
<mx:RadioButton label="Cost (Senior Fare)" groupName="MetricChooser" value="metric:fareSenior" width="200"/>
<mx:RadioButton label="Cost (Reduced Fare)" groupName="MetricChooser" value="metric:fareReduced" width="200"/>
<mx:PopUpButton id="BitmapChooserBoss" openAlways="true" icon="{bitmapChooserBossIcon}"
width="200" height="180" cornerRadius="6" borderColor="#6b808c">
<mx:popUp>
<mx:TileList id="BitmapChooser" dataProvider="{bitmapDictionary}" change="setCurrBitmap(BitmapChooser.selectedItem)"
columnCount="2" rowCount="3" verticalScrollPolicy="off" horizontalScrollPolicy="off" selectedIndex="0">
<mx:itemRenderer><mx:Component>
<mx:VBox><mx:Image source="{data.icon}" width="180" height="180" /></mx:VBox>
</mx:Component></mx:itemRenderer>
</mx:TileList></mx:popUp>
</mx:PopUpButton>
<mx:PopUpButton id="DrawElementsBoss" openAlways="true"
width="200" bottom="0" label="Draw on map:">
<mx:popUp>
<mx:VBox right="0" backgroundAlpha="1.0" >
<mx:CheckBox id="bkgdDEChooser" label="Background Map" selected="true" change="setDrawElement('map', bkgdDEChooser.selected)" />
<mx:CheckBox id="lineDEChooser" label="Route Lines" selected="true" change="setDrawElement('routes', lineDEChooser.selected)" />
<mx:CheckBox id="stnsDEChooser" label="Stations" selected="true" change="setDrawElement('stations', stnsDEChooser.selected)" />
<mx:CheckBox id="gridDEChooser" label="Metric Grid Marks" selected="true" change="setDrawElement('grids', gridDEChooser.selected)" />
<mx:CheckBox id="edgeDEChooser" label="Stationary points" selected="false" change="setDrawElement('edgenodes', edgeDEChooser.selected)" />
<mx:CheckBox id="trisDEChooser" label="Rendering Triangles" selected="false" change="setDrawElement('triangles', trisDEChooser.selected)" />
</mx:VBox>
</mx:popUp>
</mx:PopUpButton>
</mx:VBox>
</mx:HBox>
<mx:VBox label="Station Info" x="0" y="0" height="100%" width="100%">
<mx:DataGrid id="StationInfoGrid" width="100%" height="50%"
selectedIndex="0"
dataProvider="{SubwayDef.stationDataProvider}"
wordWrap="false" itemClick="setStationOfInterest(event);">
<mx:columns>
<mx:DataGridColumn headerText="Name" width="220" dataField="name"/>
<mx:DataGridColumn headerText="Address" width="220" dataField="address"/>
<mx:DataGridColumn headerText="Longitude W" width="90" dataField="long"/>
<mx:DataGridColumn headerText="Latitude N" width="90" dataField="lat"/>
<mx:DataGridColumn headerText="Red" width="50" dataField="rl"/>
<mx:DataGridColumn headerText="Blue" width="50" dataField="bl"/>
<mx:DataGridColumn headerText="Green" width="50" dataField="gl"/>
<mx:DataGridColumn headerText="Orange" width="50" dataField="ol"/>
<mx:DataGridColumn headerText="Yellow" width="50" dataField="yl"/>
</mx:columns>
</mx:DataGrid>
<mx:DataGrid id="RouteInfoGrid" width="100%" height="100%"
selectedIndex="0"
dataProvider="{StationInfoGrid.selectedItem.routes}" wordWrap="true">
<mx:columns>
<mx:DataGridColumn headerText="Destination" width="220" dataField="dest" />
<mx:DataGridColumn headerText="Distance, in miles" width="80" dataField="miles" />
<mx:DataGridColumn headerText="Time, in minutes" width="80" dataField="time" />
<mx:DataGridColumn headerText="Regular Fare" width="80" dataField="fareRegular" />
<mx:DataGridColumn headerText="Reduced Fare" width="80" dataField="fareReduced" />
<mx:DataGridColumn headerText="Senior Fare" width="80" dataField="fareSenior" />
<mx:DataGridColumn headerText="Longitude W" width="90" dataField="destLong"/>
<mx:DataGridColumn headerText="Latitude N" width="90" dataField="destLat"/>
<mx:DataGridColumn headerText="Red" width="40" dataField="destRL" sortDescending="true"/>
<mx:DataGridColumn headerText="Blue" width="40" dataField="destBL" sortDescending="true"/>
<mx:DataGridColumn headerText="Green" width="40" dataField="destGL" sortDescending="true"/>
<mx:DataGridColumn headerText="Orange" width="40" dataField="destOL" sortDescending="true"/>
<mx:DataGridColumn headerText="Yellow" width="40" dataField="destYL" sortDescending="true"/>
</mx:columns>
</mx:DataGrid>
</mx:VBox>
</mx:TabNavigator>
<mx:Script>
<![CDATA[
import src.Station;
import src.StationGraph;
import src.ImageDeformer;
import flash.events.Event;
import flash.events.MouseEvent;
import flash.events.TimerEvent;
import mx.core.UIComponent;
import mx.core.BitmapAsset;
import mx.events.ListEvent;
import mx.controls.Alert;
import mx.rpc.events.FaultEvent;
import mx.rpc.http.mxml.HTTPService;
private function ggCreationComplete():void {
SubwayDef.width = SubwayDef.height = Math.min(SubwayDef.width, SubwayDef.height);
var zf:Number = Math.floor( (SubwayDef.width / SubwayDef.logicalsize) / ZoomFactorChooser.snapInterval ) * ZoomFactorChooser.snapInterval;
ZoomFactorChooser.value = zf;
ZoomFactorChooser.minimum = zf;
ZoomFactorChooserMinLabel.text = zf.toFixed(1);
SubwayDef.setZoomFactor(ZoomFactorChooser.value);
metroStations.send();
stationTopologyXML.send();
setCurrBitmap(bitmapDictionary[0]);
}
public function setMapVisibility():void {
}
public function setStationOfInterest(event:ListEvent):void {
var stn:Station = event.target.selectedItem as Station;
if (stn != null) {
SubwayDef.setStationOfInterest(stn.id);
}
}
public function setGeometry(geom:String):void {
SubwayDef.setGeometry(geom);
}
public function setZoomFactor(newzf:Number):void {
SubwayDef.setZoomFactor(newzf);
}
public function setDrawElement(drawElt:String, newstate:Boolean):void {
SubwayDef.setDrawElement(drawElt, newstate);
}
/**
* Sets a new drawing Bitmap -- takes an object whose "bitmap" field is the BitmapAsset to use
*
*/
public function setCurrBitmap(choice:Object):void {
if (choice == null) { Alert.show("Oopsie: I was asked to make a bad (null) choice. Drink your drugs and stay off milk.", "Crap Bubbles!"); return; }
if (choice.bitmap == null) {
var request:URLRequest = new URLRequest(choice.url);
loader.load(request);
loader.contentLoaderInfo.addEventListener(Event.COMPLETE, bitmapFeedResultHandler);
loader.contentLoaderInfo.addEventListener(SecurityErrorEvent.SECURITY_ERROR, bitmapErrorHandler);
loader.contentLoaderInfo.addEventListener(IOErrorEvent.IO_ERROR, bitmapErrorHandler);
} else {
SubwayDef.setCurrBitmap(choice.bitmap);
}
bitmapChooserBossIcon = choice.iconclass; }
public function bitmapFeedResultHandler(event: Event): void {
var loaderInfo:LoaderInfo = event.target as LoaderInfo;
if ((loaderInfo != null) && (loaderInfo.content != null)) {
var bitmap:Bitmap = loader.content as Bitmap;
SubwayDef.setCurrBitmap(bitmap.bitmapData);
LoadingBitmap.visible = false;
}
}
public function bitmapErrorHandler(event:Event):void {
Alert.show("Could not load map image. Sorry you got done like that. "+
"Here's a cryptic error string you can ponder, though: "+ event.toString(),
"Crap Bubbles!");
}
/**
* Set up images.
*/
[Embed(source="assets/images/DCMapUSGS-sepia-tn.jpg")] [Bindable] public var mapUSGSsepiaTNClass:Class;
[Embed(source="assets/images/DCMapUSGS-desat-tn.jpg")] [Bindable] public var mapUSGSdesatTNClass:Class;
[Embed(source="assets/images/DCMapGE-roads-desat-tn.jpg")] [Bindable] public var mapGEroadsTNClass:Class;
[Embed(source="assets/images/DCMapGE-plain-desat-tn.jpg")] [Bindable] public var mapGEplainTNClass:Class;
[Embed(source="assets/images/GraphPaper-tn.png")] [Bindable] public var GraphPaperTNClass:Class;
[Embed(source="assets/images/TriangulationGraphic-tn.png")] [Bindable] public var TriangulationTNClass:Class;
[Bindable] private var bitmapChooserBossIcon:Class = mapUSGSsepiaTNClass;
[Bindable] public var bitmapDictionary:Array = [
{ bitmap:null, url:"assets/images/DCMapUSGS-sepia-3k.jpg", icon:"assets/images/DCMapUSGS-sepia-tn.jpg", tooltip:"Topological Map (sepia)", iconclass:mapUSGSsepiaTNClass },
{ bitmap:null, url:"assets/images/DCMapUSGS-desat-3k.jpg", icon:"assets/images/DCMapUSGS-desat-tn.jpg", foo_label:"Topological Map", iconclass:mapUSGSdesatTNClass },
{ bitmap:null, url:"assets/images/DCMapGE-roads-desat-3k.jpg", icon:"assets/images/DCMapGE-roads-desat-tn.jpg", foo_label:"Aerial Photo with roads", iconclass:mapGEroadsTNClass },
{ bitmap:null, url:"assets/images/DCMapGE-plain-desat-3k.jpg", icon:"assets/images/DCMapGE-plain-desat-tn.jpg", foo_label:"Aerial Photo", iconclass:mapGEplainTNClass },
{ bitmap:null, url:"assets/images/GraphPaper.jpg", icon:"assets/images/GraphPaper-tn.png", tooltip:"Graph Paper", iconclass:GraphPaperTNClass },
{ bitmap:null, url:"assets/images/TriangulationGraphic.jpg", icon:"assets/images/TriangulationGraphic-tn.png", tooltip:"Triangulation Coloring", iconclass:TriangulationTNClass },
];
public var loader:Loader= new Loader();
]]>
</mx:Script>
</mx:Application>