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