net/systemeD/potlatch2/TagViewer.mxml

   1 <?xml version="1.0" encoding="utf-8"?>
   2 <mx:VBox
   3         xmlns:mx="http://www.adobe.com/2006/mxml"
   4         xmlns:flexlib="flexlib.containers.*"
   5         horizontalScrollPolicy="off"
   6     backgroundColor="white"
   7     initialize="loadFeatures()">
   8
   9 <mx:ViewStack id="sidebar" width="100%" height="100%" creationPolicy="all">
  10   <mx:VBox id="dndPanel" width="100%" height="100%" horizontalScrollPolicy="off">
  11     <mx:Text id="dndPanelText" text="{dndPrompt}" automationName="{dndPrompt}" />
  12         <mx:Repeater id="dndRep" dataProvider="{MapFeatures.getInstance().getCategoriesForType('point')}">
  13                 <mx:HBox width="100%"><mx:Label text="{dndRep.currentItem.name}"/></mx:HBox>
  14
  15                         <mx:TileList dataProvider="{dndRep.currentItem.getFeaturesForType('point')}" width="100%" height="1"
  16                                      rowHeight="32" columnWidth="32" updateComplete="resizePOIGrid(event)">
  17                                 <mx:itemRenderer>
  18                                         <mx:Component>
  19                                                 <mx:VBox mouseOver="parentDocument.dndPanelText.text = data.name"
  20                                                                  mouseOut="parentDocument.dndPanelText.text = parentDocument.dndPanelText.automationName">
  21                                                 <mx:Script><![CDATA[
  22                                                         import mx.events.DragEvent;
  23                                                         import mx.managers.DragManager;
  24                                                         import mx.core.DragSource;
  25
  26                                                         private function dragPOI(event:MouseEvent, tags:Array):void {
  27                                                                 // Get the drag initiator component from the event object.
  28                                                                 var dragInitiator:Image = event.currentTarget as Image;
  29                                                                 var dragSource:DragSource = new DragSource();
  30                                                                 dragSource.addData(tags, 'tags');
  31                                                                 dragSource.addData(event.target.parent.parent.parent.parent, 'container');
  32
  33                                                                 var dragProxy:Image = new Image();
  34                                                                 dragProxy.source = dragInitiator.source;
  35                                                                 dragProxy.width = dragInitiator.width;   // must set width and height explicitly
  36                                                                 dragProxy.height = dragInitiator.height; // for non-embedded images
  37                                                                 DragManager.doDrag(dragInitiator, dragSource, event, dragProxy);
  38                                                         }
  39                                                 ]]></mx:Script>
  40                                                 <mx:Image id="foo" source="{data.image}" height="24" width="24" mouseMove="dragPOI(event, data.tags)" toolTip="{data.name}" />
  41                                         </mx:VBox>
  42                                 </mx:Component>
  43                         </mx:itemRenderer>
  44                 </mx:TileList>
  45         </mx:Repeater>
  46   </mx:VBox>
  47
  48   <mx:VBox id="tagsPanel" width="100%" height="100%" creationPolicy="auto">
  49     <mx:ViewStack id="stack" width="100%" height="100%">
  50       <mx:VBox width="100%" height="100%" label="Simple" id="editorContainer" creationComplete="initEditorStackUIs()">
  51         <mx:HBox borderStyle="inset" verticalAlign="middle" width="100%" paddingLeft="3" id="iconContainer">
  52             <mx:Image id="iconImage"/>
  53             <mx:VBox width="100%" verticalGap="1">
  54               <mx:PopUpButton id="popupChange" creationComplete="initFeatureBox()" openAlways="true" width="100%"/>
  55               <mx:Text condenseWhite="true" width="100%" id="iconText"/>
  56             </mx:VBox>
  57             <mx:LinkButton label="?" click="openDescription()" id="helpLabel"/>
  58         </mx:HBox>
  59       </mx:VBox>
  60       <mx:VBox width="100%" height="100%" label="Advanced" initialize="checkAdvanced()" verticalGap="1">
  61         <mx:Label id="advancedID">
  62           <mx:htmlText><![CDATA[<i>No Selection</i>]]></mx:htmlText>
  63         </mx:Label>
  64
  65         <mx:DataGrid editable="true" width="100%" height="75%" id="advancedTagGrid">
  66                 <mx:columns>
  67                     <mx:DataGridColumn editable="true" dataField="key" headerText="Key"/>
  68                     <mx:DataGridColumn editable="true" dataField="value" headerText="Value"/>
  69                 </mx:columns>
  70         </mx:DataGrid>
  71
  72         <mx:HBox horizontalAlign="right" width="100%">
  73           <mx:LinkButton label="Delete" click="removeTag()" enabled="{advancedTagGrid.selectedItem != null? true : false}"/>
  74           <mx:LinkButton label="Add" click="addNewTag()"/>
  75         </mx:HBox>
  76
  77         <mx:DataGrid editable="true" width="100%" height="25%" id="relationsGrid"
  78             doubleClickEnabled="true"
  79             itemDoubleClick="editRelation(relationsGrid.selectedItem.id)">
  80             <mx:columns>
  81                 <mx:DataGridColumn editable="false" dataField="description" headerText="Relation"/>
  82                 <mx:DataGridColumn editable="false" dataField="id_idx" headerText="ID"/>
  83                 <mx:DataGridColumn editable="true" dataField="role" headerText="Role"/>
  84             </mx:columns>
  85         </mx:DataGrid>
  86
  87         <mx:HBox horizontalAlign="right" width="100%">
  88           <mx:LinkButton label="Remove from" click="removeFromRelation(relationsGrid.selectedItem.id, relationsGrid.selectedItem.index)"
  89                           enabled="{relationsGrid.selectedItem != null? true : false}"/>
  90           <mx:LinkButton label="Add to" click="addToRelation()"/>
  91         </mx:HBox>
  92
  93       </mx:VBox>
  94
  95       <mx:VBox width="100%" height="100%" label="Members" id="membersVBox" initialize="checkMembers()" verticalGap="1">
  96         <mx:Label id="membersText" text="Relation Members"/>
  97         <mx:DataGrid editable="true" width="100%" height="100%" id="membersGrid"
  98                       dragEnabled="true" dragMoveEnabled="true" dropEnabled="true">
  99           <mx:columns>
 100             <mx:DataGridColumn editable="false" dataField="type" headerText="Type"/>
 101             <mx:DataGridColumn editable="false" dataField="id" headerText="ID"/>
 102             <mx:DataGridColumn editable="true" dataField="role" headerText="Role"/>
 103           </mx:columns>
 104         </mx:DataGrid>
 105       </mx:VBox>
 106
 107       </mx:ViewStack>
 108
 109           <mx:HBox width="100%">
 110                 <mx:LinkBar dataProvider="{stack}"/>
 111                 <mx:Spacer width="100%"/>
 112                 <mx:LinkButton
 113                         icon="@Embed('../../../embedded/view_tabbed.png')"
 114                         disabledIcon="@Embed('../../../embedded/view_tabbed_disabled.png')"
 115                         click="setEditorStackUI(true)" id="tabNavigatorLabel" paddingTop="6"
 116                         toolTip="Show in tabs"
 117                         enabled="{editorStack is Accordion &amp;&amp; stack.selectedIndex==0}" />
 118                 <mx:LinkButton
 119                         icon="@Embed('../../../embedded/view_accordion.png')"
 120                         disabledIcon="@Embed('../../../embedded/view_accordion_disabled.png')"
 121                         click="setEditorStackUI(false)" id="accordionLabel" paddingTop="6"
 122                         toolTip="Show in sliding windows"
 123                         enabled="{editorStack is SuperTabNavigator &amp;&amp; stack.selectedIndex==0}" />
 124           </mx:HBox>
 125   </mx:VBox>
 126 </mx:ViewStack>
 127
 128   <mx:Script><![CDATA[
 129       import net.systemeD.halcyon.connection.*;
 130       import net.systemeD.potlatch2.mapfeatures.*;
 131
 132       import mx.collections.*;
 133       import mx.containers.*;
 134       import mx.events.*;
 135       import mx.core.*;
 136       import mx.managers.PopUpManager;
 137       import flash.geom.Point;
 138       import flash.net.*;
 139       import mx.events.DragEvent;
 140       import mx.managers.DragManager;
 141       import mx.core.DragSource;
 142       import flexlib.containers.SuperTabNavigator;
 143
 144       private static const dndPrompt:String="Drag and drop points of interest";
 145
 146       private var editorStackTabNavigator:SuperTabNavigator;
 147       private var editorStackAccordion:Accordion;
 148       [Bindable] private var editorStack:Container;
 149
 150       private var mapFeatures:MapFeatures;
 151       private var selectedEntity:Entity;
 152       private var tagDataProvider:ArrayCollection;
 153       private var tw:CategorySelector = null;
 154       private var feature:Feature = null;
 155
 156       public function setEntity(entity:Entity):void {
 157           UIComponent.suspendBackgroundProcessing();
 158           if ( selectedEntity != entity ) {
 159               if ( selectedEntity != null )
 160                   selectedEntity.removeEventListener(Connection.TAG_CHANGED, tagChanged);
 161               selectedEntity = entity;
 162               if ( selectedEntity != null )
 163                   selectedEntity.addEventListener(Connection.TAG_CHANGED, tagChanged);
 164           }
 165
 166           if ( advancedID != null )
 167               setupAdvanced(entity);
 168           if (entity is Relation) {
 169               stack.addChild(membersVBox);
 170           }
 171           refreshFeatureIcon();
 172           if (selectedEntity == null) {
 173             sidebar.selectedChild = dndPanel;
 174           } else {
 175             initialiseEditors();
 176             sidebar.selectedChild = tagsPanel;
 177           }
 178           UIComponent.resumeBackgroundProcessing();
 179       }
 180
 181       private function refreshFeatureIcon():void {
 182           var oldFeature:Feature = feature;
 183           feature = selectedEntity == null ? null : mapFeatures.findMatchingFeature(selectedEntity);
 184           if ( feature != oldFeature ) {
 185               if ( oldFeature != null )
 186                   oldFeature.removeEventListener("imageChanged", featureImageChanged);
 187               if ( feature != null )
 188                   feature.addEventListener("imageChanged", featureImageChanged);
 189           }
 190
 191           if ( feature != null && feature.name != null ) {
 192               setFeatureIcon(selectedEntity, feature);
 193           } else {
 194               blankFeatureIcon(selectedEntity);
 195           }
 196       }
 197
 198       private function featureImageChanged(event:Event):void {
 199           setFeatureIcon(selectedEntity, feature);
 200       }
 201
 202       private function setFeatureIcon(entity:Entity, feature:Feature):void {
 203           //blankFeatureIcon(entity);
 204
 205           iconImage.source = feature.image;
 206
 207           var txt:String = feature.htmlDetails(entity);
 208           iconText.htmlText = txt;
 209           popupChange.label = feature.name;
 210           setLimitTypes(entity);
 211           tw.setSelectedFeature(feature);
 212           helpLabel.visible = feature.hasHelpURL();
 213       }
 214
 215       private function setLimitTypes(entity:Entity):void {
 216           var type:String = null;
 217           if ( entity is Node )
 218               type = "point";
 219           else if ( entity is Way )
 220               type = Way(entity).isArea() ? "area" : "line";
 221           else if ( entity is Relation )
 222               type = "relation";
 223           tw.setLimitTypes(type);
 224       }
 225
 226       private function blankFeatureIcon(entity:Entity):void {
 227           iconImage.source = null;
 228           popupChange.label = "unknown";
 229           setLimitTypes(entity);
 230                   if (entity == null) {
 231                         iconText.htmlText = "<i>Nothing selected</i>";
 232             tw.setNoSelectedFeature();
 233                   } else if (entity.hasTags()) {
 234                         iconText.htmlText = "<b>Not recognised</b><br/>Try looking at the tags under the advanced properties";
 235             tw.setSelectedFeature(null);
 236                   } else {
 237                         iconText.htmlText = "<b>No tags set</b><br/>Use the menu above to say what this "+entity.getType()+" is";
 238             tw.setSelectedFeature(null);
 239           }
 240           helpLabel.visible = false;
 241       }
 242
 243       private var tabComponents:Object = {};
 244
 245       private function initialiseEditors():void {
 246           editorStack.removeAllChildren();
 247           if ( selectedEntity == null || feature == null )
 248               return;
 249
 250           var editorBox:VBox = createEditorBox();
 251           editorBox.label = "Basic";
 252           editorStack.addChild(editorBox);
 253
 254           var tabs:Object = {};
 255           tabComponents = {};
 256
 257           for each (var factory:EditorFactory in feature.editors) {
 258               if ( factory.presence.isEditorPresent(factory, selectedEntity, null) ) {
 259                   var editor:DisplayObject = factory.createEditorInstance(selectedEntity);
 260                   if ( editor != null )
 261                       editorBox.addChild(editor);
 262               }
 263               var category:String = factory.category;
 264               if (category!='') {
 265                       var tab:VBox = tabs[category];
 266                       if ( tab == null) {
 267                           tab = createEditorBox();
 268                           tab.label = category;
 269                           editorStack.addChild(tab);
 270                           tabs[category] = tab;
 271                           tabComponents[tab] = [];
 272                       }
 273                       var catEditor:DisplayObject = factory.createEditorInstance(selectedEntity);
 274                       if ( catEditor != null )
 275                           tabComponents[tab].push(catEditor);
 276                       //    tab.addChild(catEditor);
 277               }
 278           }
 279       }
 280
 281       private function createEditorBox():VBox {
 282           var box:VBox = new VBox();
 283           box.percentWidth = 100;
 284           box.percentHeight = 100;
 285           return box;
 286       }
 287
 288       private function ensureEditorsPopulated(tab:VBox):void {
 289           var components:Array = tabComponents[tab];
 290           if ( components == null || tab == null || tab.numChildren >= components.length )
 291               return;
 292           for each (var component:DisplayObject in components ) {
 293               tab.addChild(component);
 294           }
 295       }
 296
 297         private function initEditorStackUIs():void {
 298                 editorStackTabNavigator = new SuperTabNavigator();
 299                 editorStackTabNavigator.allowTabSqueezing=false;
 300                 editorStackTabNavigator.minTabWidth=10;
 301                 editorStackTabNavigator.closePolicy="close_never";
 302                 editorStackTabNavigator.scrollSpeed=20;
 303                 editorStackTabNavigator.creationPolicy="auto";
 304                 editorStackTabNavigator.percentWidth=100;
 305                 editorStackTabNavigator.percentHeight=100;
 306
 307                 editorStackAccordion = new Accordion();
 308                 editorStackAccordion.percentWidth=100;
 309                 editorStackAccordion.percentHeight=100;
 310                 editorStackAccordion.creationPolicy="auto";
 311
 312                 setEditorStackUI(true);
 313         }
 314
 315         private function setEditorStackUI(isTabbed:Boolean):void {
 316                 var children:Array=[]; var i:uint;
 317
 318                 if (editorStack) {
 319                         // blank existing component
 320                         editorStack.removeEventListener("change",editorStackUIChange);
 321                         editorStack.removeEventListener("updateComplete",editorStackUIUpdate);
 322                         editorStack.removeAllChildren();
 323                         editorContainer.removeChildAt(1);
 324                 }
 325
 326                 // replace with new component
 327                 editorStack = (isTabbed ? editorStackTabNavigator : editorStackAccordion) as Container;
 328                 editorContainer.addChild(editorStack);
 329
 330                 // re-add children and listeners
 331                 initialiseEditors();
 332                 editorStack.addEventListener("change",editorStackUIChange);
 333                 editorStack.addEventListener("updateComplete",editorStackUIUpdate);
 334         }
 335
 336         private function editorStackUIChange(event:Event):void {
 337                 ensureEditorsPopulated(IndexChangedEvent(event).relatedObject as VBox);
 338         }
 339
 340         private function editorStackUIUpdate(event:Event):void {
 341                 if (editorStack is SuperTabNavigator) {
 342                         var e:SuperTabNavigator = editorStack as SuperTabNavigator;
 343                         if (e.selectedIndex<0) { return; }
 344                         for (var i:uint=0; i<e.numChildren; i++) {
 345                                 e.getTabAt(i).selected=(i==e.selectedIndex);
 346                         }
 347                 }
 348         }
 349
 350
 351       private function checkAdvanced():void {
 352           if ( selectedEntity != null )
 353              setupAdvanced(selectedEntity);
 354       }
 355
 356       private var listeningToRelations:Array = [];
 357
 358       private function setupAdvanced(entity:Entity):void {
 359           if ( tagDataProvider == null ) {
 360               tagDataProvider = new ArrayCollection();
 361               advancedTagGrid.dataProvider = tagDataProvider;
 362           }
 363
 364           tagDataProvider.removeAll();
 365
 366           if ( entity == null ) {
 367               advancedID.htmlText = "";
 368           } else {
 369               var entityText:String = "xx";
 370               if ( entity is Node ) entityText = "Node";
 371               else if ( entity is Way ) entityText = "Way";
 372               else if ( entity is Relation ) entityText = "Relation";
 373               advancedID.htmlText = entityText+": <b>"+entity.id+"</b>";
 374
 375               var tags:Array = entity.getTagArray();
 376               tags.sortOn("key");
 377               for each(var tag:Tag in tags)
 378                   tagDataProvider.addItem(tag);
 379           }
 380
 381           removeRelationListeners();
 382           if ( selectedEntity != null ) {
 383               selectedEntity.removeEventListener(Connection.ADDED_TO_RELATION, addedToRelation);
 384               selectedEntity.removeEventListener(Connection.REMOVED_FROM_RELATION, removedFromRelation);
 385           }
 386
 387           if ( entity == null ) {
 388               relationsGrid.dataProvider = null;
 389           } else {
 390               resetRelationsGrid(entity);
 391               entity.addEventListener(Connection.ADDED_TO_RELATION, addedToRelation);
 392               entity.addEventListener(Connection.REMOVED_FROM_RELATION, removedFromRelation);
 393           }
 394       }
 395
 396       private function addedToRelation(event:RelationMemberEvent):void {
 397          resetRelationsGrid(selectedEntity);
 398       }
 399
 400       private function removedFromRelation(event:RelationMemberEvent):void {
 401          resetRelationsGrid(selectedEntity);
 402       }
 403
 404       private function removeRelationListeners():void {
 405           for each( var rel:Relation in listeningToRelations ) {
 406               rel.removeEventListener(Connection.TAG_CHANGED, relationTagChanged);
 407               rel.removeEventListener(Connection.RELATION_MEMBER_ADDED, entityRelationMemberChanged);
 408               rel.removeEventListener(Connection.RELATION_MEMBER_REMOVED, entityRelationMemberChanged);
 409           }
 410           listeningToRelations = [];
 411           relationsGrid.removeEventListener(DataGridEvent.ITEM_EDIT_END, relationRoleChanged);
 412       }
 413
 414       private function resetRelationsGrid(entity:Entity):void {
 415           removeRelationListeners();
 416           var relations:Array = [];
 417           for each( var rel:Relation in entity.parentRelations ) {
 418               for each( var memberIndex:int in rel.findEntityMemberIndexes(entity)) {
 419                   var props:Object = {};
 420                   props["relation"] = rel;
 421                   props["id"] = rel.id;
 422                   props["index"] = memberIndex;
 423                   props["role"] = rel.getMember(memberIndex).role;
 424                   props["description"] = rel.getDescription();
 425                   props["id_idx"] = rel.id + "/"+memberIndex;
 426
 427                   relations.push(props);
 428               }
 429
 430               rel.addEventListener(Connection.TAG_CHANGED, relationTagChanged);
 431               rel.addEventListener(Connection.RELATION_MEMBER_ADDED, entityRelationMemberChanged);
 432               rel.addEventListener(Connection.RELATION_MEMBER_REMOVED, entityRelationMemberChanged);
 433               listeningToRelations.push(rel);
 434           }
 435           relationsGrid.dataProvider = relations;
 436           relationsGrid.addEventListener(DataGridEvent.ITEM_EDIT_END, relationRoleChanged, false, -100);
 437       }
 438
 439       private function relationRoleChanged(event:DataGridEvent):void {
 440                 if (event.dataField != 'role') { return; }      // shouldn't really happen
 441
 442                 var relations:Array=event.currentTarget.dataProvider.toArray();
 443                 var props:Object=relations[event.rowIndex];
 444
 445                 var relation:Relation=props['relation'];
 446                 var index:uint=props['index'];
 447                 var newRole:String=event.itemRenderer.data['role'];
 448
 449                 relation.setMember(index, new RelationMember(selectedEntity,newRole));
 450       }
 451
 452       private function relationTagChanged(event:TagEvent):void {
 453           resetRelationsGrid(selectedEntity);
 454       }
 455
 456       private function entityRelationMemberChanged(event:RelationMemberEvent):void {
 457           resetRelationsGrid(selectedEntity);
 458       }
 459
 460       private function checkMembers():void {
 461           if (selectedEntity is Relation) {
 462             setupMembers(selectedEntity as Relation);
 463           }
 464       }
 465
 466       private function setupMembers(rel:Relation):void {
 467           var members:Array = [];
 468           for (var i:int=0 ; i<rel.length; i++) {
 469             var props:Object = {};
 470             var member:RelationMember = rel.getMember(i);
 471             props["id"] = member.entity.id;
 472             props["type"] = member.entity.getType();
 473             props["role"] = member.role;
 474
 475             members.push(props);
 476           }
 477           membersGrid.dataProvider = members;
 478           membersGrid.dataProvider.addEventListener('collectionChange', membersChange);
 479       }
 480
 481       private function membersChange(event:Event):void {
 482           // Dropping all the members and re-adding them isn't exactly optimal
 483           // but is at least robust for any kind of change.
 484           // Figuring out a better way is someone else's FIXME
 485
 486           var conn:Connection = Connection.getConnectionInstance();
 487           var rel:Relation = selectedEntity as Relation
 488
 489           // drop members
 490           for (var i:int=rel.length-1 ; i>=0; i--) {
 491             rel.removeMemberByIndex(i);
 492           }
 493
 494           // add members in new order
 495           for each(var memberObject:Object in membersGrid.dataProvider) {
 496             var e:Entity;
 497             var id:Number = memberObject.id;
 498             if(memberObject.type == 'node') {
 499               e = conn.getNode(id);
 500             } else if (memberObject.type == 'way') {
 501               e = conn.getWay(id);
 502             } else if (memberObject.type == 'relation') {
 503               e = conn.getRelation(id);
 504             }
 505             rel.appendMember(new RelationMember(e, memberObject.role));
 506           }
 507       }
 508
 509       private function editRelation(id:Number):void {
 510           var panel:RelationEditorPanel = RelationEditorPanel(
 511               PopUpManager.createPopUp(Application(Application.application), RelationEditorPanel, true));
 512           panel.setRelation(Connection.getConnectionInstance().getRelation(id));
 513           PopUpManager.centerPopUp(panel);
 514       }
 515
 516       private function tagChanged(event:TagEvent):void {
 517           refreshFeatureIcon();
 518
 519           if ( tagDataProvider != null ) {
 520               // check to see if the key is already in our list
 521               var exists:Boolean = false;
 522               var tag:Tag = null;
 523               var i:uint;
 524               for ( i = 0; i < tagDataProvider.length && !exists; i++ ) {
 525                   tag = Tag(tagDataProvider.getItemAt(i));
 526                   exists = tag.key == event.key;
 527               }
 528               if ( !exists ) {
 529                   tag = new Tag(selectedEntity, event.key, event.newValue);
 530                   tagDataProvider.addItem(tag);
 531                   tagDataProvider.refresh();
 532               } else {
 533                   if ( event.newValue == null ) {
 534                       tagDataProvider.removeItemAt(i-1);
 535                       tagDataProvider.refresh();
 536                   } else {
 537                       tagDataProvider.itemUpdated(tag, "value");
 538                   }
 539               }
 540           }
 541       }
 542
 543       public function loadFeatures():void {
 544           mapFeatures = MapFeatures.getInstance();
 545           stack.removeChild(membersVBox); // remove by default, will be added if relation
 546       }
 547
 548       public function openDescription():void {
 549           if ( feature != null && feature.hasHelpURL() )
 550               navigateToURL(new URLRequest(feature.helpURL), "potlatch_help");
 551       }
 552
 553       public function addNewTag():void {
 554           var newKey:String = "(new tag)";
 555           var newTag:Tag = new Tag(selectedEntity, newKey, "(new value)");
 556           tagDataProvider.addItem(newTag);
 557           advancedTagGrid.editedItemPosition = {rowIndex: tagDataProvider.getItemIndex(newTag), columnIndex: 0};
 558       }
 559
 560       public function removeTag():void {
 561           var k:String = advancedTagGrid.selectedItem.key;
 562           selectedEntity.setTag(k, null, MainUndoStack.getGlobalStack().addAction);
 563       }
 564
 565       public function addToRelation():void {
 566           new RelationSelectPanel().init(selectedEntity,new Object());
 567       }
 568
 569       public function removeFromRelation(id:Number, index:int):void {
 570           Connection.getConnectionInstance().getRelation(id).removeMemberByIndex(index);
 571       }
 572
 573       public function initFeatureBox():void {
 574           tw = new CategorySelector();
 575           tw.addEventListener("selectedType", changeFeatureType);
 576           popupChange.popUp = tw;
 577       }
 578
 579       public function changeFeatureType(event:Event):void {
 580           if ( selectedEntity == null )
 581               return;
 582
 583           UIComponent.suspendBackgroundProcessing();
 584           var newFeature:Feature = tw.selectedType;
 585           var undoStack:Function = MainUndoStack.getGlobalStack().addAction;
 586           var action:CompositeUndoableAction = new CompositeUndoableAction(
 587                   "Set "+selectedEntity.getType()+" "+selectedEntity.id+" to "+newFeature.name);
 588                   selectedEntity.suspend();
 589
 590           // remove tags from the current feature
 591           if ( feature != null ) {
 592               for each( var oldtag:Object in feature.tags ) {
 593                   selectedEntity.setTag(oldtag["k"], null, action.push);
 594               }
 595           }
 596
 597           // set tags for new feature
 598           if ( newFeature != null ) {
 599               for each( var newtag:Object in newFeature.tags ) {
 600                   selectedEntity.setTag(newtag["k"], newtag["v"], action.push);
 601               }
 602           }
 603
 604                   selectedEntity.resume();
 605           undoStack(action);
 606           popupChange.close();
 607           initialiseEditors();
 608           UIComponent.resumeBackgroundProcessing();
 609       }
 610
 611         private function resizePOIGrid(event:Event):void {
 612                 var rows:Number=event.target.dataProvider.length/event.target.columnCount;
 613                 if (rows!=Math.floor(rows)) { rows=Math.floor(rows+1); }
 614                 event.target.height=rows*(event.target.rowHeight+1);
 615         }
 616   ]]></mx:Script>
 617 </mx:VBox>
 618