<?xml version="1.0" encoding="utf-8"?>
<mx:VBox
- xmlns:mx="http://www.adobe.com/2006/mxml"
+ xmlns:fx="http://ns.adobe.com/mxml/2009"
+ xmlns:mx="library://ns.adobe.com/flex/mx"
xmlns:flexlib="flexlib.containers.*"
xmlns:controls="net.systemeD.controls.*"
xmlns:potlatch2="net.systemeD.potlatch2.*"
<mx:TileList dataProvider="{dndRep.currentItem.getFeaturesForType('point', true)}" width="100%" height="1"
rowHeight="32" columnWidth="32" updateComplete="resizePOIGrid(event)" styleName="dndPanelTileList">
<mx:itemRenderer>
- <mx:Component>
+ <fx:Component>
<mx:VBox toolTip="{data.name}">
- <mx:Script><![CDATA[
+ <fx:Script><![CDATA[
import mx.events.DragEvent;
import mx.managers.DragManager;
import mx.core.DragSource;
dragProxy.height = dragInitiator.height; // for non-embedded images
DragManager.doDrag(dragInitiator, dragSource, event, dragProxy);
}
- ]]></mx:Script>
+ ]]></fx:Script>
<mx:Image id="foo" source="{data.dndimage}" height="24" width="24" mouseMove="dragPOI(event, data.tags)" toolTip="{data.name}" />
</mx:VBox>
- </mx:Component>
+ </fx:Component>
</mx:itemRenderer>
</mx:TileList>
</mx:Repeater>
<mx:DataGridColumn editable="false" dataField="description" headerText="Relation"/>
<mx:DataGridColumn editable="false" dataField="id_idx" headerText="ID"/>
<mx:DataGridColumn editable="true" dataField="role" headerText="Role">
- <mx:itemEditor><mx:Component><mx:TextInput restrict=" -" /></mx:Component></mx:itemEditor>
+ <mx:itemEditor><fx:Component><mx:TextInput restrict=" -" /></fx:Component></mx:itemEditor>
</mx:DataGridColumn>
<mx:DataGridColumn width="20" editable="false">
<mx:itemRenderer>
- <mx:Component>
+ <fx:Component>
<mx:HBox horizontalAlign="center" verticalAlign="middle">
<mx:PopUpButton arrowButtonWidth="12" paddingLeft="0" paddingRight="0" width="12" height="12"
open="{outerDocument.updateRelationMenu(event);}"
creationComplete="{outerDocument.createRelationMenu(PopUpButton(event.target));}"/>
</mx:HBox>
- </mx:Component>
+ </fx:Component>
</mx:itemRenderer>
</mx:DataGridColumn>
</mx:columns>
<mx:DataGridColumn editable="false" dataField="type" headerText="Type"/>
<mx:DataGridColumn editable="false" dataField="id" headerText="ID"/>
<mx:DataGridColumn editable="true" dataField="role" headerText="Role">
- <mx:itemEditor><mx:Component><mx:TextInput restrict=" -" /></mx:Component></mx:itemEditor>
+ <mx:itemEditor><fx:Component><mx:TextInput restrict=" -" /></fx:Component></mx:itemEditor>
</mx:DataGridColumn>
</mx:columns>
</mx:DataGrid>
disabledIcon="@Embed('../../../embedded/view_accordion_disabled.png')"
click="setEditorStackUI(false)" id="accordionLabel" paddingTop="6"
toolTip="Show in sliding windows"
- enabled="{editorStack is SuperTabNavigator && stack.selectedIndex==0}" />
+ enabled="{editorStack is TabNavigator && stack.selectedIndex==0}" />
</mx:HBox>
</mx:VBox>
<mx:DataGridColumn editable="false" dataField="description" headerText="Relation"/>
<mx:DataGridColumn editable="false" dataField="id_idx" headerText="ID"/>
<mx:DataGridColumn editable="true" dataField="role" headerText="Role">
- <mx:itemEditor><mx:Component><mx:TextInput restrict=" -" /></mx:Component></mx:itemEditor>
+ <mx:itemEditor><fx:Component><mx:TextInput restrict=" -" /></fx:Component></mx:itemEditor>
</mx:DataGridColumn>
<mx:DataGridColumn width="20" editable="false">
<mx:itemRenderer>
- <mx:Component>
+ <fx:Component>
<mx:HBox horizontalAlign="center" verticalAlign="middle">
<mx:PopUpButton arrowButtonWidth="12" paddingLeft="0" paddingRight="0" width="12" height="12"
open="{outerDocument.updateRelationMenu(event);}"
creationComplete="{outerDocument.createRelationMenu(PopUpButton(event.target));}"/>
</mx:HBox>
- </mx:Component>
+ </fx:Component>
</mx:itemRenderer>
</mx:DataGridColumn>
</mx:columns>
</mx:ViewStack>
- <mx:Script><![CDATA[
+ <fx:Script><![CDATA[
import net.systemeD.halcyon.connection.*;
import net.systemeD.halcyon.MapPaint;
import net.systemeD.potlatch2.EditController;
import net.systemeD.potlatch2.mapfeatures.*;
import net.systemeD.potlatch2.utils.*;
+ import net.systemeD.controls.CollapsiblePanel;
import mx.collections.*;
import mx.containers.*;
import mx.managers.DragManager;
import mx.core.DragSource;
import mx.controls.TabBar;
- import flexlib.containers.SuperTabNavigator;
+// import flexlib.containers.SuperTabNavigator;
+
+ [Bindable] [Embed(source="../../../embedded/tab_basic.png" )] private var tabIconBasic:Class;
+ [Bindable] [Embed(source="../../../embedded/tab_address.png" )] private var tabIconAddress:Class;
+ [Bindable] [Embed(source="../../../embedded/tab_cycle.png" )] private var tabIconCycle:Class;
+ [Bindable] [Embed(source="../../../embedded/tab_details.png" )] private var tabIconDetails:Class;
+ [Bindable] [Embed(source="../../../embedded/tab_restrictions.png")] private var tabIconRestrictions:Class;
+ [Bindable] [Embed(source="../../../embedded/tab_transport.png" )] private var tabIconTransport:Class;
+ [Bindable] [Embed(source="../../../embedded/tab_walk.png" )] private var tabIconWalk:Class;
+ private var tabIcons:Object= { Basic:tabIconBasic, Details:tabIconDetails, Address:tabIconAddress, Walk:tabIconWalk, Cycle:tabIconCycle,
+ Transport:tabIconTransport, Restrictions:tabIconRestrictions};
[Bindable]
public var dndPrompt:String="Add new points by dragging them onto the map";
- private var editorStackTabNavigator:SuperTabNavigator;
+ private var editorStackTabNavigator:TabNavigator;
private var editorStackAccordion:Accordion;
[Bindable] private var editorStack:Container;
}
private var tabComponents:Object = {};
+ private var subpanelComponents:Object = {};
private function initialiseEditors():void {
- // reset tab to 0 to work around TabNavigator bug (#3444)
- if (editorStack is TabNavigator) {
- try {
- var tabBar:TabBar=TabBar(TabNavigator(editorStack).getTabAt(0).parent);
- tabBar.selectedIndex=0;
- tabBar.validateNow();
- } catch(errObject:Error) {}
- }
+ editorStack.removeAllChildren();
+ if ( selectedEntity == null || feature == null )
+ return;
+
+ var basicEditorBox:VBox = createEditorBox();
+ basicEditorBox.label = "Basic";
+ basicEditorBox.icon=tabIconBasic;
+ editorStack.addChild(basicEditorBox);
+
+ var tabs:Object = {};
+ var tabList:Array = [];
+ tabComponents = {};
+ var subpanels:Object = {};
+ subpanelComponents = {};
+
+ // First create the tabs
+ for each (var factory:EditorFactory in feature.editors) {
+ var category:String = factory.category;
+ if (category!='') {
+ var tab:VBox = tabs[category];
+ if ( tab == null) {
+ tab = createEditorBox();
+ tab.label = category;
+ if (tabIcons[category]) tab.icon=tabIcons[category];
+ tabs[category] = tab;
+ tabList.push(tab);
+ }
+ }
+ }
- editorStack.removeAllChildren();
- if ( selectedEntity == null || feature == null )
- return;
+ // Put the tabs on-screen in order
+ tabList.sort(sortCategories,16);
+ for each (tab in tabList) {
+ editorStack.addChild(tab);
+ tabComponents[tab] = [];
+ }
- var editorBox:VBox = createEditorBox();
- editorBox.label = "Basic";
- editorStack.addChild(editorBox);
+ // Then add the individual editors to them
+ for each (factory in feature.editors) {
- var tabs:Object = {};
- tabComponents = {};
+ // Add to basic editor box first
+ if ( factory.presence.isEditorPresent(factory, selectedEntity, null) ) {
+ var editor:DisplayObject = factory.createEditorInstance(selectedEntity);
+ if (editor) basicEditorBox.addChild(editor);
+ }
- for each (var factory:EditorFactory in feature.editors) {
- if ( factory.presence.isEditorPresent(factory, selectedEntity, null) ) {
- var editor:DisplayObject = factory.createEditorInstance(selectedEntity);
- if ( editor != null )
- editorBox.addChild(editor);
- }
- var category:String = factory.category;
- if (category!='') {
- var tab:VBox = tabs[category];
- if ( tab == null) {
- tab = createEditorBox();
- tab.label = category;
- editorStack.addChild(tab);
- tabs[category] = tab;
- tabComponents[tab] = [];
- }
- var catEditor:DisplayObject = factory.createEditorInstance(selectedEntity);
- if ( catEditor != null )
- tabComponents[tab].push(catEditor);
- // tab.addChild(catEditor);
- }
- }
+ // Then prepare to add to category panel
+ category=factory.category;
+ if (factory.category=='') continue;
+ var catEditor:DisplayObject = factory.createEditorInstance(selectedEntity);
+ if (!catEditor) continue;
+ tab=tabs[category];
+
+ // Create subcategory panel if needed
+ if (factory.subcategory) {
+ var subcategory:String = factory.subcategory;
+ if (!subpanels[category]) { subpanels[category]={}; }
+ var subpanel:CollapsiblePanel = subpanels[category][subcategory];
+ if (!subpanel) {
+ subpanel=new CollapsiblePanel(false);
+ subpanel.percentWidth=100;
+ subpanel.styleName="subcategoryPanel";
+ subpanel.title=subcategory;
+ subpanels[category][subcategory]=subpanel;
+ tabComponents[tab].push(subpanel);
+ }
+ subpanel.addChild(catEditor);
+ } else {
+ tabComponents[tab].push(catEditor);
+ }
+ }
}
+ // ** FIXME: Order probably shouldn't be hard-coded, but configurable
+ private static var categoryOrder:Array=["Restrictions","Transport","Cycle","Walk","Address","Details"]; // reverse order
+ private function sortCategories(a:VBox,b:VBox):int {
+ var a1:int=categoryOrder.indexOf(a.label);
+ var a2:int=categoryOrder.indexOf(b.label);
+ if (a1<a2) { return 1; }
+ else if (a1>a2) { return -1; }
+ return 0;
+ }
+
private function createEditorBox():VBox {
var box:VBox = new VBox();
box.percentWidth = 100;
}
private function initEditorStackUIs():void {
- editorStackTabNavigator = new SuperTabNavigator();
- editorStackTabNavigator.allowTabSqueezing=false;
- editorStackTabNavigator.minTabWidth=10;
- editorStackTabNavigator.closePolicy="close_never";
- editorStackTabNavigator.scrollSpeed=20;
+ editorStackTabNavigator = new TabNavigator();
+// editorStackTabNavigator.allowTabSqueezing=false;
+// editorStackTabNavigator.minTabWidth=10;
+// editorStackTabNavigator.closePolicy="close_never";
+// editorStackTabNavigator.scrollSpeed=20;
editorStackTabNavigator.creationPolicy="auto";
editorStackTabNavigator.percentWidth=100;
editorStackTabNavigator.percentHeight=100;
editorStackTabNavigator.styleName="dndStackTab";
- editorStackTabNavigator.popUpButtonPolicy="off"
+// editorStackTabNavigator.popUpButtonPolicy="off"
editorStackAccordion = new Accordion();
editorStackAccordion.percentHeight=100;
editorStackAccordion.creationPolicy="auto";
editorStackAccordion.styleName="dndStackAccordion";
+ /* FIXME: the accordion icons should be right-aligned. See:
+ http://www.kristoferjoseph.com/blog/2008/11/06/positioning-the-flex-accordion-header-icon
+ http://blog.flexexamples.com/2007/09/13/changing-text-alignment-in-an-flex-accordion-header/
+ */
setEditorStackUI(true);
}
}
private function editorStackUIUpdate(event:Event):void {
- if (editorStack is SuperTabNavigator) {
- var e:SuperTabNavigator = editorStack as SuperTabNavigator;
+ if (editorStack is TabNavigator) {
+ var e:TabNavigator = editorStack as TabNavigator;
if (e.selectedIndex<0) { return; }
for (var i:uint=0; i<e.numChildren; i++) {
e.getTabAt(i).selected=(i==e.selectedIndex);
private function editRelation(id:Number):void {
var panel:RelationEditorPanel = RelationEditorPanel(
- PopUpManager.createPopUp(Application(Application.application), RelationEditorPanel, true));
+ PopUpManager.createPopUp(Application(FlexGlobals.topLevelApplication), RelationEditorPanel, true));
panel.setRelation(connection.getRelation(id));
PopUpManager.centerPopUp(panel);
}
public function selectRelationMenu(event:MenuEvent):void {
var rel:Relation=rowData.relation;
var entities:Array;
- var controller:EditController=Application.application.theController;
+ var controller:EditController=FlexGlobals.topLevelApplication.theController;
switch (event.index) {
case 0: // Select all members
entities=selectedEntity.entities.concat(rel.memberEntities);
if (rows!=Math.floor(rows)) { rows=Math.floor(rows+1); }
event.target.height=rows*(event.target.rowHeight+1);
}
- ]]></mx:Script>
+ ]]></fx:Script>
</mx:VBox>