1 /**
  2  * @fileOverview  
  3  * Copyright (c) 2013 Regione Autonoma della Sardegna
  4  * Published under the GPL license.<br>
  5  * See <a href="https://sardegnageoportale.it/webgis/license.txt">https://sardegnageoportale.it/webgis/license.txt</a>
  6  * for the full text of the license.
  7  * @version 0.1
  8  */
  9 
 10 /**
 11  * @require OpenLayers/Control.js
 12  * @require OpenLayers/Control/SelectFeature.js
 13  */
 14 
 15 /**
 16  * @namespace framework.widgets.control
 17  */
 18 Ext.namespace("framework.widgets.control");
 19 
 20 /** 
 21  *  Provides control for getting Latitude and Longitude of a click point.
 22  *  @name_ InfoPoint
 23  *  @class Provides control for getting Latitude and Longitude of a click point.
 24  *  @constructor
 25  *  @extends <a target="_blank" href="http://dev.openlayers.org/docs/files/OpenLayers/Control-js.html">OpenLayers.Control</a>
 26  */
 27 framework.widgets.control.InfoPoint = OpenLayers.Class(OpenLayers.Control,
 28         /** 
 29          * @lends framework.widgets.control.InfoPoint.prototype 
 30          */
 31                 {
 32                     /** 
 33                      * If provided, a marker will be drawn on this
 34                      * layer with the location returned by click point.
 35                      * @public
 36                      * @type OpenLayers.Layer.Vector
 37                      */
 38                     layer: null,
 39                     /** 
 40                      * If provided, calculate altitude from this layer. 
 41                      * Insert layer WMS and record name with value altitude
 42                      * @public
 43                      * @type array (OpenLayers.Layer.WMS, String)
 44                      */
 45                     layerAltitude: null,
 46                     
 47                     
 48                     radiusLayer: null,
 49                     /**
 50                      * paht for images marker,
 51                      * default value is "theme/app/img/".
 52                      * @public
 53                      * @type String
 54                      */
 55                     markersImgPath: 'theme/app/img/',
 56                     /**
 57                      * Default options object
 58                      * @private
 59                      * @type object
 60                      */
 61                     defaultHandlerOptions: {
 62                         'single': true,
 63                         'double': false,
 64                         'pixelTolerance': 0,
 65                         'stopSingle': false,
 66                         'stopDouble': false
 67                     },
 68                     /**
 69                      * Control with Altitude
 70                      * @private
 71                      * @type OpenLayers.Control.WMSGetFeatureInfo
 72                      */
 73                     controlPoint: null,
 74                     /**
 75                      * Unit of measurement for Altitude
 76                      * @private
 77                      * @type String
 78                      */
 79                     textUnit: "metri",
 80                     /** 
 81                      * Create a handler for the click event 
 82                      * @private
 83                      */
 84                     initialize: function(options) {
 85 
 86                         this.handlerOptions = OpenLayers.Util.extend({}, this.defaultHandlerOptions);
 87                         OpenLayers.Control.prototype.initialize.apply(this, arguments);
 88                         this.handler = new OpenLayers.Handler.Click(this,
 89                                 {
 90                                     'click': this.onClick
 91                                 },
 92                         this.handlerOptions
 93                                 );
 94                         
 95                         if (!this.layer) {
 96                             this.layer = new OpenLayers.Layer.Vector('infoPoint', {
 97                                 displayInLayerSwitcher: false,
 98                                 visibility: true,
 99                                 styleMap: new OpenLayers.StyleMap({
100                                     'default': new OpenLayers.Style({
101                                         graphicZIndex: 100,
102                                         externalGraphic: this.markersImgPath + "fa_marker.png",
103                                         graphicWidth: 68,
104                                         graphicHeight: 32,
105                                         graphicOpacity: 1
106                                     })})
107                             });
108                         }
109                                 
110                                
111                     },
112                     /**
113                      * APIMethod: activate
114                      * Extend method OpenLayers.Control.
115                      * Explicitly activates a control and it's associated
116                      * handler if one has been set.  Controls can be
117                      * deactivated by calling the deactivate() method.
118                      * 
119                      * Returns:
120                      * {Boolean}  True if the control was successfully activated or
121                      *            false if the control was already active.
122                      * @private
123                      */
124                     activate: function() {
125 
126 
127                         if (this.active) {
128                             return false;
129                         }
130                         else if (this.layerAltitude[0]) {
131 
132                             if (this.controlPoint == null) {
133 
134                                 this.controlPoint = new OpenLayers.Control.WMSGetFeatureInfo({
135                                     url: this.layerAltitude[0].url,
136                                     queryVisible: true,
137                                     layers: [this.layerAltitude[0]],
138                                     infoFormat: "application/json",
139                                     eventListeners: {
140                                         getfeatureinfo: function(evt) {
141                                             try {
142                                                 var altitudeJSON = JSON.parse(evt.text.replace(this.layerAltitude[1], "Altitude"));
143                                                 var altitude = null;
144                                                 if (altitudeJSON.features.length) {
145                                                     altitude = altitudeJSON.features[0].properties.Altitude;
146                                                     altitude = Math.round(altitude) + ' ' + this.textUnit;
147                                                 }
148                                                 this.onClick(evt, altitude);
149                                             } catch (error) {}
150                                             this.controlPoint.deactivate();
151 
152                                         },
153                                         scope: this
154                                     }
155                                 });
156                                 this.map.addLayer(this.layerAltitude[0]);
157                                 this.map.addControl(this.controlPoint);
158                                 this.map.removeLayer(this.layerAltitude[0]);
159 
160                             }
161 
162                             this.controlPoint.activate();
163 
164                         }
165                         
166                         
167                         if (this.handler) {
168                             this.handler.activate();
169                         }
170                         this.active = true;
171                         if (this.map) {
172                             OpenLayers.Element.addClass(
173                                     this.map.viewPortDiv,
174                                     this.displayClass.replace(/ /g, "") + "Active"
175                                     );
176                         }
177                         this.events.triggerEvent("activate");
178                         return true;
179 
180 
181 
182                     },
183                     /** 
184                      * Perform the click event getting longitude and latidude information from the selected point
185                      * @private
186                      * @param {Object} evt event object.                    
187                      */
188                     onClick: function(evt, altitude) {
189                         var position = this.map.getLonLatFromViewPortPx(evt.xy);
190                         var location = position;
191 
192                         if (position instanceof OpenLayers.LonLat){
193                             //this.map.boundRicerca = new OpenLayers.Geometry.Point(position.lat, position.lon).getBounds().toGeometry();
194                             var bound = new OpenLayers.Bounds(position.lon - 1, position.lat - 1, position.lon + 1, position.lat + 1);
195                             this.map.boundRicerca = bound.toGeometry();
196                         }
197 
198                         layerVector = this.layer;
199                         if (this.map.getLayersByName(this.layer.name).length === 0) {
200                             this.map.addLayer(this.layer);
201                         }
202                         ;
203                         //create popup on "featureselected"                            
204                         layerVector.events.on({
205                             featureselected: function(e) {
206                                 createPopup(e.feature);
207                             }
208                         });
209 
210                         this.deactivate();
211 
212                         if (this.map.getLayersByName(this.layer.name).length === 0) {
213                             this.map.addLayer(this.layer);
214                         }
215 
216                         // Reproject (if required)
217                         position.transform(new OpenLayers.Projection("EPSG:3003"), this.map.getProjectionObject());
218                         
219                         //Se utilizzato in ambiente di ricerca, agganciare a questo evento la pulizia della mappa
220                         this.map.events.triggerEvent('cleanSearchObjects'); 
221 
222                         //remove marker
223                         var f = this.layer.features;
224                         if (this.map.boundRicerca != null) {
225                             this.layer.removeAllFeatures({silent: true});
226                         } else {
227                             for (i = f.length - 1; i > -1; i--) {
228                                 if (f[i].selfRemove)
229                                     this.layer.removeFeatures(f[i]);
230                             }
231                         }
232 
233                         //create new feature with marker
234                         var feature = new OpenLayers.Feature.Vector(new OpenLayers.Geometry.Point(position.lon, position.lat)
235                                 , null, {externalGraphic: this.markersImgPath + "fa_marker.png",
236                                     graphicWidth: 60, graphicHeight: 38, graphicYOffset: -38, fillOpacity: 1});
237                         var coordinateText = '<p>lon: ' + (Math.round(position.lon * 100) / 100) + '<br />lat: ' + Math.round(position.lat * 100) / 100 + '</p>';
238                         feature.selfRemove = true;
239 
240                         var altitudeText = "";
241 
242                         if (altitude) {
243                             altitudeText = '<h1>Altitudine</h1>' +
244                                     '<p> ' + (Math.round(parseFloat(altitude) * 100) / 100) + ' m</p>';
245                         }
246 
247                         feature.text = '<h1>Coordinate</h1>' + coordinateText + ' ' + altitudeText;
248                         feature.location = location;
249 
250                         this.layer.addFeatures(feature);
251                         this.events.triggerEvent('drawn');
252 
253                         var selectCtrl = new OpenLayers.Control.SelectFeature([this.layer], {toggle: true, clickout: true});
254 
255                         this.map.addControl(selectCtrl);
256                         selectCtrl.activate();
257 
258                         // remove popup
259                         removePopup();
260                         createPopup(feature);
261 
262                         function removePopup() {
263                             if (this.popupAddr) {
264                                 this.popupAddr.close();
265                                 this.popupAddr.destroy();
266                             }
267 
268                         }
269 
270 
271                         function createPopup(feature) {
272 
273                             removePopup();
274                             var hiddenPanelSearch = true;
275                             if(Ext.getCmp('idPanelSearch') && feature.selfRemove == true) {
276                                 hiddenPanelSearch = false;
277                             }
278 
279                             this.popupAddr = new framework.plugins.PopUp({
280                                 location: feature,
281                                 width: 250,
282                                 border: false,
283                                 items: [{
284                                     xtype: 'box',
285                                     cls: 'boxAltitude',
286                                     autoEl: {id: 'userId'},
287                                     html: '<div class="popupAddr">' + feature.text + '</div>',
288                                     width: 'auto'
289                                 },{
290                                     xtype: 'box',
291                                     cls: 'boxSearchPOI',
292                                     hidden: hiddenPanelSearch,
293                                     autoEl: {id: 'userId'},
294                                     html: '<div class="popupSearchPOI">Cosa c\'รจ qui vicino? (in metri)</div>',
295                                     width: 'auto'
296                                 },{
297                                     id: 'poiRadius',
298                                     xtype: 'textfield',
299                                     cls: 'fieldSearchPOIRadius',
300                                     hidden: hiddenPanelSearch,
301                                     //fieldLabel: 'Comune',
302                                     name: 'poiradius',
303                                     value: '100',
304                                     width: 100,
305                                     allowBlank: true
306                                 },{
307                                     id: 'poiBtnSearchPOIRadius',
308                                     xtype: 'button',
309                                     hidden: hiddenPanelSearch,
310                                     cls: 'btnSearchPOIRadius',
311                                     text: '    ',
312                                     handler : function(){
313 
314                                         var comboPoi = Ext.getCmp('comboPoi');
315                                         
316                                          // Reproject (if required)
317                                         feature.location.transform(new OpenLayers.Projection("EPSG:3003"), new OpenLayers.Projection("EPSG:4326"));
318                        
319                                         var panelsearch = Ext.getCmp('idPanelSearch');
320                                         
321                                         panelsearch.selectItem(2);
322                                         
323                                         comboPoi.store.baseParams.lon = feature.location.lon;
324                                         comboPoi.store.baseParams.lat = feature.location.lat;
325                                         comboPoi.store.baseParams.radius = Ext.getCmp('poiRadius').getValue();
326                                         
327                                         var searchText = comboPoi.getValue();
328                                         
329 //                                      comboPoi.store.load();
330                                         comboPoi.focus();
331                                         comboPoi.setValue(searchText);
332                                         comboPoi.doQuery(searchText,true);
333                                         //Ext.getCmp("searchadvpoiID").hide();
334 //                                        comboPoi.clearBaseParams(comboPoi.store);
335 
336                                     }
337                                 }],
338                                 maximizable: false,
339                                 collapsible: false
340                             });
341 
342                             // unselect feature when the popup
343                             // is closed
344                             this.popupAddr.on({
345                                 close: function() {
346                                     if (OpenLayers.Util.indexOf(layerVector.selectedFeatures, this.feature) > -1) {
347                                         selectCtrl.unselect(this.feature);
348                                     }
349                                 }
350                             });
351                             this.popupAddr.show();
352                         }
353 
354 
355 
356 
357                     }
358 
359 
360 
361                 });
362