net/systemeD/potlatch2/VectorSourceDialog.mxml

   1 <?xml version="1.0" encoding="utf-8"?>
   2 <mx:TitleWindow
   3         xmlns:mx="http://www.adobe.com/2006/mxml"
   4         layout="vertical" showCloseButton="true"
   5         horizontalAlign="center" title="Load vector file"
   6         width="500" height="350" verticalGap="0">
   7
   8         <mx:DataGrid editable="true" width="100%" height="100%" id="dataGrid"
   9                 dataProvider="{vectorLayers}" itemEditEnd="dataEdited(event)">
  10             <mx:columns>
  11                 <mx:DataGridColumn editable="false" dataField="visible" headerText="Show?" width="45">
  12                                 <mx:itemRenderer>
  13                                         <mx:Component>
  14                                                 <mx:CheckBox selectedField="isSelected"
  15                                                                          click="data.isSelected=!data.isSelected; this.parent.parent.dispatchEvent(new Event('visibility_changed'));"
  16                                                                          paddingLeft="5"/>
  17                                         </mx:Component>
  18                                 </mx:itemRenderer>
  19                         </mx:DataGridColumn>
  20                 <mx:DataGridColumn editable="false" dataField="interactive" headerText="Select?" width="45">
  21                                 <mx:itemRenderer>
  22                                         <!-- There should really be a way to hide this for the editable layer. See
  23                                              http://stackoverflow.com/questions/6329895/how-do-i-change-the-style-of-one-individual-cell-in-a-flex-datagrid
  24                                              Leave it as a FIXME until we move to Flex 4 -->
  25                                         <mx:Component>
  26                                                 <mx:CheckBox selectedField="isInteractive"
  27                                                                          click="data.isInteractive=!data.isInteractive; this.parent.parent.dispatchEvent(new Event('interactive_changed'));"
  28                                                              paddingLeft="5"/>
  29                                         </mx:Component>
  30                                 </mx:itemRenderer>
  31                         </mx:DataGridColumn>
  32                 <mx:DataGridColumn editable="true"  dataField="name"  headerText="Name"/>
  33                 <mx:DataGridColumn editable="false" dataField="url"   headerText="URL"/>
  34                 <mx:DataGridColumn editable="false" dataField="style" headerText="Style">
  35                                 <mx:itemRenderer>
  36                                         <mx:Component>
  37                                         <mx:ComboBox
  38                                                         selectedItem="{outerDocument.whichStyle(data)}"
  39                                                 change="outerDocument.styleEdited(data.name,selectedItem.url)"
  40                                                 dataProvider="{outerDocument.styles}"
  41                                                         labelField="name" />
  42                                         </mx:Component>
  43                                 </mx:itemRenderer>
  44                         </mx:DataGridColumn>
  45             </mx:columns>
  46         </mx:DataGrid>
  47         <mx:HBox horizontalAlign="right" width="100%">
  48                 <mx:LinkButton label="Delete" click="removeLayer()" enabled="{dataGrid.selectedItem != null &amp;&amp; dataGrid.selectedItem.isBackground}"/>
  49         </mx:HBox>
  50
  51         <mx:VBox width="100%" paddingTop="10">
  52                 <mx:Label htmlText="&lt;b&gt;Add new vector layer&lt;/b&gt;" />
  53                 <mx:HBox>
  54                         <mx:RadioButtonGroup id="filetype" />
  55                         <mx:RadioButton width="100%" groupName="filetype" value="gpx" id="gpx" label="GPX" selected="true" />
  56                         <mx:RadioButton width="100%" groupName="filetype" value="kml" id="kml" label="KML" />
  57                         <mx:RadioButton width="100%" groupName="filetype" value="osm" id="osm" label="OSM" />
  58                         <mx:RadioButton width="100%" groupName="filetype" value="shp" id="shp" label="Shapefile" />
  59                 </mx:HBox>
  60                 <mx:HBox>
  61                         <mx:Label text="Shapefile projection:" />
  62                         <mx:ComboBox id="projection">
  63                                 <mx:ArrayCollection>
  64                                         <mx:Object label="Lat/long" data="" />
  65                                         <mx:Object label="Ordnance Survey GB" data="EPSG:27700" />
  66                                         <mx:Object label="NAD83" data="EPSG:4269" />
  67                                 </mx:ArrayCollection>
  68                         </mx:ComboBox>
  69                         <mx:CheckBox width="100%" label="Simplify paths" selected="true" id="simplify" />
  70                 </mx:HBox>
  71                 <mx:HBox>
  72                         <mx:Text text="URL:"/>
  73                         <mx:TextInput width="100%" id="src" text="" />
  74                         <mx:Button label="Load" click="loadFiles(src.text, filetype.selectedValue.toString(), simplify.selected, projection.selectedItem.data);" enabled="{src.text == '' ? false : true}"/>
  75                 </mx:HBox>
  76         </mx:VBox>
  77
  78   <mx:Script><![CDATA[
  79
  80         import net.systemeD.halcyon.Map;
  81         import net.systemeD.halcyon.MapPaint;
  82         import net.systemeD.halcyon.Globals;
  83         import net.systemeD.halcyon.connection.Connection;
  84         import net.systemeD.potlatch2.utils.Importer;
  85         import net.systemeD.potlatch2.utils.GpxImporter;
  86         import net.systemeD.potlatch2.utils.KmlImporter;
  87         import net.systemeD.potlatch2.utils.ShpImporter;
  88         import net.systemeD.potlatch2.utils.OsmImporter;
  89         import net.systemeD.potlatch2.collections.Stylesheets;
  90     import mx.managers.PopUpManager;
  91     import mx.events.DataGridEvent;
  92     import mx.events.CloseEvent;
  93     import mx.core.Application;
  94         import mx.collections.ArrayCollection;
  95         import mx.controls.Alert;
  96
  97         private var map:Map;
  98
  99         public function styleEdited(name:String,stylesheet:String):void {
 100                 map.findLayer(name).setStyle(stylesheet);
 101         }
 102
 103
 104     public function init():void {
 105         PopUpManager.addPopUp(this, Application(Application.application), true);
 106         PopUpManager.centerPopUp(this);
 107         this.addEventListener(CloseEvent.CLOSE, vectorDialog_close);
 108                 dataGrid.addEventListener("visibility_changed", toggleVisibility);
 109                 dataGrid.addEventListener("interactive_changed", toggleInteractive);
 110                 map = Globals.vars.root;
 111                 dispatchEvent(new Event("layers_changed"));
 112     }
 113
 114         public function whichStyle(item:Object):Object {
 115                 for each (var style:Object in styles) {
 116                         if (style.url==item.style) { return style; }
 117                 }
 118                 return {};
 119         }
 120
 121         [Bindable(event="bogus")]
 122         public function get styles():ArrayCollection {
 123                 return new ArrayCollection(Stylesheets.instance().collection);
 124         }
 125
 126         [Bindable(event="layers_changed")]
 127         private function get vectorLayers():Array {
 128         var v:Array=[];
 129         for each (var a:MapPaint in map.getLayers() ) {
 130             v.push( { name:a.connection.name, visible:a.visible, interactive:a.interactive, url:a.connection.apiBase, style:a.style, isBackground:a.isBackground } );
 131         }
 132                 return v;
 133         }
 134
 135         private function toggleVisibility(event:Event):void {
 136                 map.findLayer(dataGrid.selectedItem.name).visible = !map.findLayer(dataGrid.selectedItem.name).visible;
 137         }
 138
 139         private function toggleInteractive(event:Event):void {
 140                 map.findLayer(dataGrid.selectedItem.name).interactive = !map.findLayer(dataGrid.selectedItem.name).interactive;
 141         }
 142
 143         private function dataEdited(event:DataGridEvent):void {
 144                 if (event.dataField=='name') {
 145                         // Rename field
 146                         var a:String=dataGrid.selectedItem.name;
 147                         var b:String=dataGrid.itemEditorInstance['text'];       // this is, unbelievably, how you get data within an itemEditEnd event
 148                         if (a==b || map.findLayer(b)) {
 149                                 event.preventDefault();
 150                         } else {
 151                                 map.findLayer(a).connection.name = b;
 152                         }
 153                         dispatchEvent(new Event("layers_changed"));
 154                 }
 155         }
 156
 157         private function removeLayer():void {
 158                 map.removeLayerByName(dataGrid.selectedItem.name);
 159                 dispatchEvent(new Event("layers_changed"));
 160         }
 161
 162     private function vectorDialog_close(evt:CloseEvent):void {
 163         PopUpManager.removePopUp(this);
 164     }
 165
 166         private function loadFiles(url:String,type:String,simplify:Boolean,projection:String=""):void {
 167                 var names:Array=url.split('/'); var name:String=names[names.length-1];
 168                 var stylesheet:String="stylesheets/potlatch.css";
 169                 if (type=='gpx') { stylesheet="stylesheets/gpx.css"; }
 170
 171                 var connection:Connection = new Connection(name, url, null, null);
 172
 173                 var filesLoaded:Function = function(success:Boolean,message:String=null):void {
 174                         if (success) {
 175                             var paint:MapPaint = map.addLayer(connection, stylesheet);
 176                             paint.updateEntityUIs(false, false);
 177                             dispatchEvent(new Event("layers_changed"));
 178                         } else {
 179                             Alert.show(message, 'Error', mx.controls.Alert.OK);
 180                         }
 181                 }
 182
 183                 if (type=='gpx') {
 184                         var gpx:GpxImporter=new GpxImporter(connection, map, [url], filesLoaded, simplify);
 185                 } else if (type=='kml') {
 186                         var kml:KmlImporter=new KmlImporter(connection, map, [url], filesLoaded, simplify);
 187                 } else if (type=='osm') {
 188                         var osm:OsmImporter=new OsmImporter(connection, map, [url], filesLoaded, simplify);
 189                 } else {
 190                         /* FIXME:
 191                            we're currently hardcoding the projection values. We could populate this directly from
 192                            proj4as, or better still, parse the WKT in the .PRJ file:
 193                                         http://trac.osgeo.org/proj4js/ticket/47
 194                                         http://trac.osgeo.org/proj4js/changeset/1873
 195                         */
 196                         var re:RegExp=/.shp$/i; url=url.replace(re,'');
 197                         var shp:ShpImporter=new ShpImporter(connection,
 198                                                             map,
 199                                                             [url+".shp",url+".shx",url+".dbf"], filesLoaded, simplify, projection);
 200                 }
 201         }
 202
 203               ]]>
 204   </mx:Script>
 205 </mx:TitleWindow>