893b5a8cdadfa69a0e4092b4f7724c426ecf9807
[potlatch2.git] / net / systemeD / potlatch2 / CategorySelector.mxml
1 <?xml version="1.0" encoding="utf-8"?>
2 <mx:VBox
3         xmlns:fx="http://ns.adobe.com/mxml/2009"
4         xmlns:mx="library://ns.adobe.com/flex/mx"
5         xmlns:halcyon="net.systemeD.halcyon.*"
6         backgroundColor="white" borderStyle="inset">
7
8   <mx:HBox horizontalGap="0">
9   <mx:ToggleButtonBar height="100%" dataProvider="{categoryStack}" direction="vertical" styleName="catToggleButtonBar"/>
10   <mx:ViewStack id="categoryStack" width="100%" height="100%"
11       change="_formerIndex=event.newIndex;"
12       creationComplete="setSelectedFeature(_selectedType);">
13       <mx:Repeater id="catRep" dataProvider="{MapFeatures.getInstance().getCategoriesForType(limit)}">
14           <mx:VBox label="{catRep.currentItem.name}">
15           <mx:TileList dataProvider="{catRep.currentItem.getFeaturesForType(limit)}"
16                        width="420" height="100%" change="itemSelected(event);" styleName="catToggleTiles"
17                        creationComplete="ensureSelection();">
18               <mx:itemRenderer>
19                   <fx:Component>
20                       <mx:VBox width="100" height="75"
21                           horizontalScrollPolicy="off" verticalScrollPolicy="off"
22                           horizontalAlign="center" verticalGap="0" toolTip="{data.description}">
23                           <mx:Image source="{data.image}" height="100%" verticalAlign="middle"/>
24                           <mx:Text text="{data.name}"/>
25                       </mx:VBox>
26                   </fx:Component>
27               </mx:itemRenderer>
28           </mx:TileList>
29           </mx:VBox>
30       </mx:Repeater>
31   </mx:ViewStack>
32   </mx:HBox>
33
34   <!-- mx:Label id="hoverInfo" text="Hover Info goes here"/>-->
35   <fx:Script><![CDATA[
36
37
38       import net.systemeD.halcyon.connection.*;
39       import net.systemeD.potlatch2.mapfeatures.*;
40
41       import mx.controls.*;
42       import mx.containers.*;
43       import mx.events.IndexChangedEvent;
44
45       /** Set briefly by ensureSelection() (presumably to avoid an event race condition). */
46       private var settingSelection:Boolean = false;
47       private var _selectedType:Feature;
48       private var _limit:String;
49       private var _formerIndex:int=0;
50
51       [Bindable(event="selectedType")]
52       /** The Feature type (eg, "residential road") currently selected. */
53       public function get selectedType():Feature {
54           return _selectedType;
55       }
56
57       [Bindable(event="limitChanged")]
58       /** The type of features currently shown ("area", "node"...) */
59       public function get limit():String {
60           return _limit;
61       }
62
63       /** Determine which feature was clicked on, and set that as the currently selected type. */
64       private function itemSelected(event:Event):void {
65           _selectedType = Feature(TileList(event.currentTarget).selectedItem);
66           if ( !settingSelection )
67               dispatchEvent(new Event("selectedType"));
68       }
69
70       /** Set the current type of Features that will be shown ("area", "node"... )*/
71       public function setLimitTypes(type:String):void {
72           _limit = type;
73           dispatchEvent(new Event("limitChanged"));
74       }
75
76       /**
77        * Set the selected feature displayed in the selector.
78        *
79        * The tab is switched to the first category the feature
80        * is part of.
81        *
82        * @param feature The feature to make selected.
83        */
84       public function setSelectedFeature(feature:Feature):void {
85           _selectedType = feature;
86
87           // check whether stack built yet, if not we get called again when it's made
88           if ( categoryStack == null )
89               return;
90
91           // set the tab to the selected item's category
92           // (we have to manually fire the IndexChangedEvent because Flex's ViewStack.as isn't competent
93           //  enough to do it reliably. This is basically a direct crib from dispatchChangeEvent)
94           var index:int=0;
95           if ( feature != null ) {
96               var primaryCategory:Category = feature.findFirstCategory();
97               index = MapFeatures.getInstance().getCategoriesForType(limit).indexOf(primaryCategory);
98               if (index==-1) { index=0; }       // not found, so just show the default for now
99           }
100           var event:IndexChangedEvent = new IndexChangedEvent(IndexChangedEvent.CHANGE);
101           event.oldIndex = _formerIndex;
102           event.newIndex = index;
103           event.relatedObject = categoryStack.getChildAt(index);
104           categoryStack.selectedIndex = index;
105           categoryStack.dispatchEvent(event);
106           _formerIndex=index;
107
108           // finalise the item selection
109           ensureSelection();
110       }
111       public function setNoSelectedFeature():void {
112             /*_selectedType=null;*/
113             setSelectedFeature(null);
114           }
115
116       /**
117        * Sets the selected feature on each category page to the current
118        * value of _selectedType. If there is no selected feature then all
119        * panels selection will be blanked.
120        *
121        * This function does not change the selected category tab.
122        *
123        * Called both from setSelectedFeature, and category tab completion
124        * (so that newly created tabs work as expected)
125        */
126       private function ensureSelection():void {
127           settingSelection = true;
128           for (var i:Number = 0; i < categoryStack.numChildren; i++) {
129               var box:Box = Box(categoryStack.getChildAt(i));
130               if ( box == null || box.numChildren == 0 )
131                   continue;
132               var tileList:TileList = TileList(box.getChildAt(0));
133               var category:Category = Category(tileList.getRepeaterItem());
134               var selected:Boolean = false;
135               for each( var catFeature:Feature in category.features ) {
136                   if ( catFeature == _selectedType ) {
137                       tileList.selectedItem = _selectedType;
138                       selected = true;
139                   }
140               }
141               if ( !selected )
142                   tileList.selectedItem = null;
143           }
144           settingSelection = false;
145       }
146
147   ]]></fx:Script>
148 </mx:VBox>
149