|
63
|
1
|
|
67
|
2 guiBlocks.prototype.addMapBlock = function(url, baseId, params, firstLayer) {
|
|
|
3 var block = this.addBlock(url, baseId, params, function() {
|
|
63
|
4 // function after add block finished
|
|
67
|
5 console.debug("in mapblock after block load!");
|
|
63
|
6 var be = block.element;
|
|
68
|
7 params = block.params;
|
|
67
|
8 block.type = "map";
|
|
|
9 params.type = "map";
|
|
68
|
10 if (params.map_layers == null) {
|
|
|
11 params.map_layers = [];
|
|
|
12 }
|
|
|
13 if (firstLayer != null) {
|
|
63
|
14 block.appendMapLayer(firstLayer);
|
|
|
15 }
|
|
68
|
16 // show block
|
|
63
|
17 block.showMapParams();
|
|
|
18 $(be).fadeIn();
|
|
|
19
|
|
|
20 // save map params in block.param -- too early
|
|
|
21 //params = block.readLayerParams();
|
|
|
22
|
|
|
23 // load map
|
|
67
|
24 block.updateMap(be,params);
|
|
63
|
25
|
|
65
|
26 // add layer button
|
|
|
27 $(be).find(".layer_add_button").click(function() {
|
|
|
28 console.debug("layer add");
|
|
|
29 params = block.readMapParams();
|
|
|
30 block.addMapLayer(be,params);
|
|
|
31 });
|
|
63
|
32 // update button
|
|
70
|
33 $(be).find(".map_update_button").click(function () {
|
|
63
|
34 console.debug("map update");
|
|
|
35 params = block.readMapParams();
|
|
|
36 block.updateMap(be,params);
|
|
|
37 });
|
|
226
|
38 // new window button
|
|
|
39 $(be).find(".map_newwindow_button").click(function () {
|
|
|
40 console.debug("map in new window");
|
|
|
41 params = block.readMapParams();
|
|
|
42 var newWindow = window.open("blocks/map_newwindow.html");
|
|
|
43 block.updateMap(newWindow.document.getElementById("map_box"),params);
|
|
|
44 });
|
|
67
|
45 // save button
|
|
70
|
46 $(be).find(".map_save_button").click(function () {
|
|
67
|
47 console.debug("map save. this=",this," block=",block);
|
|
|
48 params = block.readMapParams(be,params);
|
|
|
49 block.storeBlock("test1");
|
|
|
50 });
|
|
63
|
51 });
|
|
|
52 };
|
|
|
53
|
|
70
|
54 guiBlocks.Block.prototype.appendMapLayer = function (layerparams) {
|
|
63
|
55 // add layer to this map
|
|
70
|
56 var layerinfo = {
|
|
|
57 display: true,
|
|
|
58 layer: layerparams
|
|
|
59 };
|
|
63
|
60 var layers = this.params.map_layers;
|
|
|
61 layers.push(layerinfo);
|
|
|
62 // update indexes
|
|
|
63 for (var i = 0; i < layers.length; i++) {
|
|
|
64 layers[i].idx = i;
|
|
|
65 }
|
|
65
|
66 return this.params;
|
|
63
|
67 };
|
|
|
68
|
|
72
|
69 guiBlocks.Block.prototype.deleteMapLayer = function (idx) {
|
|
|
70 // remove layer from this map
|
|
|
71 var layers = this.params.map_layers;
|
|
|
72 layers.splice(idx,1);
|
|
|
73 // update indexes
|
|
|
74 for (var i = 0; i < layers.length; i++) {
|
|
|
75 layers[i].idx = i;
|
|
|
76 }
|
|
|
77 return this.params;
|
|
|
78 };
|
|
|
79
|
|
70
|
80 guiBlocks.Block.prototype.showMapParams = function (elem, params) {
|
|
63
|
81 // create html with layer parameters from params
|
|
72
|
82 var i, layers, $tmpl, lp, idx;
|
|
|
83 var block = this;
|
|
68
|
84 if (elem == null) {
|
|
63
|
85 elem = this.element;
|
|
|
86 }
|
|
68
|
87 if (params == null) {
|
|
63
|
88 params = this.params;
|
|
|
89 }
|
|
72
|
90 var $elem = $(elem);
|
|
|
91 $elem.find(".map_name").val(params.name);
|
|
70
|
92 layers = params.map_layers;
|
|
63
|
93 // remove old info
|
|
65
|
94 $(elem).find(".map_layer_table .layer_info").remove();
|
|
63
|
95 // write new info
|
|
|
96 if (layers.length > 0) {
|
|
72
|
97 $tmpl = $elem.find(".layer_info_tmpl").tmpl(layers);
|
|
|
98 $elem.find(".map_layer_header").after($tmpl);
|
|
69
|
99 // arm edit and delete buttons
|
|
70
|
100 for (i = 0; i < layers.length; ++i) {
|
|
|
101 lp = layers[i].layer;
|
|
|
102 idx = layers[i].idx;
|
|
|
103 console.debug("showmapparams lp=", lp, " idx=", idx);
|
|
72
|
104 $tmpl.find(".layer_edit_"+idx).click(function () {
|
|
|
105 var param = lp;
|
|
70
|
106 console.debug("open layer ",idx);
|
|
72
|
107 blocks.addLayerBlock("blocks/layer.html?table="+escape(lp.table),"layer", param);
|
|
|
108 });
|
|
|
109 $tmpl.find(".layer_delete_"+idx).click(function () {
|
|
|
110 var layerIdx = idx;
|
|
|
111 console.debug("del layer ",layerIdx);
|
|
|
112 params = block.deleteMapLayer(layerIdx);
|
|
|
113 block.showMapParams(elem, params);
|
|
|
114 block.updateMap(elem, params);
|
|
70
|
115 });
|
|
|
116 }
|
|
63
|
117 }
|
|
|
118 };
|
|
|
119
|
|
|
120 guiBlocks.Block.prototype.readMapParams = function(elem,params) {
|
|
|
121 // read layer parameters from html element and store in param
|
|
68
|
122 if (elem == null) {
|
|
63
|
123 elem = this.element;
|
|
|
124 }
|
|
68
|
125 if (params == null) {
|
|
63
|
126 params = this.params;
|
|
|
127 }
|
|
|
128 params.name = $(elem).find(".map_name").val();
|
|
|
129 var layers = params.map_layers;
|
|
|
130 for (var i = 0; i < layers.length; i++) {
|
|
|
131 layers[i].display = $(elem).find(".layer_display_"+i).attr("checked");
|
|
|
132 }
|
|
|
133 //params.position_field = $(elem).find(".map_position_select").val();
|
|
|
134 //params.connect_line = $(elem).find(".layer_line_checkbox").attr("checked");
|
|
|
135 return params;
|
|
|
136 };
|
|
|
137
|
|
|
138 guiBlocks.Block.prototype.updateMap = function(elem,map_params) {
|
|
226
|
139
|
|
|
140 //************
|
|
231
|
141 //alert("bin in updateMap:" + elem + ", " + map_params)
|
|
226
|
142 //*************
|
|
|
143
|
|
|
144 if (elem == null) {
|
|
65
|
145 elem = this.element;
|
|
|
146 }
|
|
68
|
147 if (map_params == null) {
|
|
65
|
148 map_params = this.params;
|
|
|
149 }
|
|
63
|
150 // update and draw the google map
|
|
|
151 var le = $(elem).find(".map_box").get(0);
|
|
|
152 // create empty map
|
|
226
|
153
|
|
68
|
154 if (google != null) {
|
|
63
|
155 var latlng = new google.maps.LatLng(29, 116);
|
|
|
156 var mapOpts = {
|
|
231
|
157 zoom: 2,
|
|
63
|
158 center: latlng,
|
|
|
159 mapTypeId: google.maps.MapTypeId.TERRAIN
|
|
|
160 };
|
|
|
161 var map = new google.maps.Map(le, mapOpts);
|
|
|
162 console.debug("new google map=",map," on el=",le);
|
|
|
163 }
|
|
|
164 // add the layers
|
|
|
165 var layerList = map_params.map_layers;
|
|
|
166 for (var i = 0; i < layerList.length; i++) {
|
|
|
167 if (!layerList[i].display) {
|
|
|
168 continue;
|
|
|
169 }
|
|
|
170 var params = layerList[i].layer;
|
|
|
171 var paramstr = "format=KML_URL";
|
|
|
172 if (params.position_field && params.position_field != "Default") {
|
|
|
173 paramstr += "&gis_id_field="+params.position_field;
|
|
|
174 }
|
|
159
|
175 if (params.color_field != "Default") {
|
|
|
176 paramstr += "&color_field="+params.color_field;
|
|
|
177 }
|
|
|
178 if (params.geometry_field != "Default") {
|
|
|
179 paramstr += "&geometry_field="+params.geometry_field;
|
|
|
180 }
|
|
63
|
181 if (params.connect_line) {
|
|
|
182 paramstr += "&connect_line="+params.connect_line;
|
|
|
183 }
|
|
|
184 var layerurl = "../db/RESTdb/db/public/" + escape(params.table) + "?" + paramstr;
|
|
72
|
185 jQuery.get(layerurl, function (data, textStatus, XMLHttpRequest) {
|
|
63
|
186 // function after load kml url finished
|
|
234
|
187 console.debug("kml url loaded! this=", this );
|
|
|
188 console.debug(" data=", data );
|
|
236
|
189 console.debug(" data type=", typeof(data));
|
|
63
|
190 if (typeof(data) == "string") {
|
|
|
191 var kmlURL = data;
|
|
|
192 } else {
|
|
|
193 // broken, what now?
|
|
|
194 return;
|
|
|
195 }
|
|
|
196 // render layer
|
|
68
|
197 if (google != null) {
|
|
63
|
198 var newMarker=new google.maps.KmlLayer(kmlURL);
|
|
234
|
199 console.debug("new marker layer=",newMarker);
|
|
|
200 console.debug(" map=",map);
|
|
63
|
201 newMarker.setMap(map);
|
|
234
|
202 console.debug("Map-Update finished");
|
|
63
|
203 }
|
|
|
204 });
|
|
|
205 }
|
|
|
206 };
|
|
65
|
207
|
|
|
208 guiBlocks.Block.prototype.addMapLayer = function(elem,params) {
|
|
|
209 var block = this;
|
|
|
210 // show list of layers, select and add to map
|
|
|
211 var layerList = [];
|
|
|
212 var $dlg = $(elem).find(".dialog.add_layer_select");
|
|
|
213 var $sel = $dlg.find("select.add_layer_select");
|
|
|
214 // fill list of layers
|
|
|
215 blocks.loadListOfItems("test1", "layer", function(data) {
|
|
|
216 console.debug("add layer list of items=",data);
|
|
|
217 layerList = data;
|
|
|
218 $sel.empty();
|
|
|
219 for (var i=0; i < data.length; i++) {
|
|
|
220 var key = data[i].key;
|
|
|
221 var val = data[i].val;
|
|
|
222 var name = val.name;
|
|
|
223 console.debug("layer",i," key=",key," value=",name);
|
|
|
224 $sel.append('<option value="'+key+'">'+name+'</option>');
|
|
|
225 }
|
|
|
226 });
|
|
|
227 console.debug("dlg=",$dlg);
|
|
|
228 $dlg.dialog({
|
|
|
229 buttons: {
|
|
|
230 "Ok": function() {
|
|
|
231 var layerName = $(this).find(".add_layer_select").val();
|
|
|
232 $(this).dialog("close");
|
|
|
233 var layerParams = jQuery.grep(layerList, function(x){return (x.key == layerName);})[0].val;
|
|
|
234 console.debug("addlayerok params=",layerParams);
|
|
|
235 params = block.appendMapLayer(layerParams);
|
|
|
236 block.showMapParams(elem, params);
|
|
|
237 params = block.readMapParams();
|
|
|
238 block.updateMap(elem,params);
|
|
|
239 },
|
|
|
240 "Cancel": function() {
|
|
|
241 $(this).dialog("close");
|
|
|
242 }
|
|
|
243 }
|
|
|
244 });
|
|
|
245 };
|
|
|
246
|
