raimund@605: /* Copyright (C) 2013 by Bundesamt fuer Strahlenschutz raimund@605: * Software engineering by Intevation GmbH raimund@605: * raimund@605: * This file is Free Software under the GNU GPL (v>=3) raimund@605: * and comes with ABSOLUTELY NO WARRANTY! Check out raimund@605: * the documentation coming with IMIS-Labordaten-Application for details. raimund@605: */ dustin@893: dustin@893: dustin@893: /** dustin@893: * This is the MapPanel. dustin@893: * It uses OpenLayers to display the map dustin@893: */ raimund@605: Ext.define('Lada.view.panel.Map', { raimund@605: extend: 'Ext.panel.Panel', raimund@605: alias: 'widget.map', dustin@1021: name: 'map', raimund@605: raimund@614: record: null, raimund@638: locationRecord: null, dustin@1021: externalOrteStore: false, dustin@1021: /* dustin@1021: * if externalOrteStore is true, the mappanel will not load the orte dustin@1021: * store on it's own; it expects an already loaded store instead dustin@1021: */ raimund@614: raimund@605: /** raimund@605: * @cfg raimund@605: * OpenLayers map options. mkrambach@1279: * Please note that TMS zoom levels are roughly as this: mkrambach@1279: * 7 = 1:4000000 14 = 1:35000 raimund@605: */ raimund@605: mapOptions: { raimund@1274: maxExtent: new OpenLayers.Bounds(-20037508.34,-20037508.34,20037508.34,20037508.34), mkrambach@1279: numZoomLevels: 15, raimund@1274: projection: 'EPSG:3857', raimund@1274: displayProjection: new OpenLayers.Projection('EPSG:4326') raimund@605: }, raimund@605: raimund@605: raimund@605: /** raimund@605: * @private raimund@605: * Initialize the map panel. raimund@605: */ raimund@605: initComponent: function() { dustin@796: var id = Ext.id(); raimund@614: this.layers = [ raimund@1274: new OpenLayers.Layer.TMS( raimund@643: 'Standard' + id, raimund@1274: 'http://www.imis.bfs.de/mapcache/tms/', raimund@614: { raimund@1274: layername: 'osm_bfs_google@GoogleMapsCompatible', raimund@614: isBaseLayer: true, raimund@1274: displayInLayerSwitcher: false, raimund@1274: type: 'png', raimund@1274: visibility: true, raimund@1274: projection: 'EPSG:3857', raimund@614: }) raimund@614: ]; raimund@643: this.map = new OpenLayers.Map('map_' + id, { raimund@605: controls: [], raimund@605: tileManager: null, mkrambach@1279: zoomMethod: null, mkrambach@1279: // initializing with view centered on germany mkrambach@1279: center: new OpenLayers.LonLat(1160000,6694000), raimund@605: }); raimund@605: this.map.setOptions(this.mapOptions); raimund@605: this.map.addLayers(this.layers); mkrambach@1288: this.map.zoomTo(6); raimund@605: var keyControl = new OpenLayers.Control.KeyboardDefaults(); raimund@605: this.map.addControl(keyControl); raimund@605: keyControl.activate(); raimund@605: this.bodyStyle = {background: '#fff'}; raimund@614: this.initData(); dustin@796: this.addEvents('featureselected'); raimund@614: this.callParent(arguments); raimund@614: }, raimund@614: dustin@895: /** dustin@895: * Initialise the Data and Create an dustin@895: * Array of OpenLayers.Layer objects. dustin@895: */ raimund@614: initData: function() { raimund@614: var me = this; dustin@1021: dustin@1021: if (!this.externalOrteStore) { dustin@1021: this.locationStore = Ext.data.StoreManager.get('orte'); raimund@1055: this.addLocations(this.locationStore); raimund@614: } raimund@614: }, raimund@614: raimund@1049: selectFeature: function(model, record) { raimund@1130: if (!record.get('id') || record.get('id') === '') { raimund@1130: return; raimund@1130: } mkrambach@1279: var feature = this.featureLayer.getFeaturesByAttribute('id', record.get('id'))[0]; raimund@614: this.map.setCenter( mkrambach@1279: new OpenLayers.LonLat(feature.geometry.x, feature.geometry.y)); mkrambach@1279: this.map.zoomTo(12); mkrambach@1279: mkrambach@1279: if (this.selectedFeatureLayer) { mkrambach@1279: if (this.selectedFeatureLayer.features.lenght > 0) { mkrambach@1279: this.featureLayer.addFeatures(this.selectedFeatureLayer.features); mkrambach@1279: } mkrambach@1279: this.selectedFeatureLayer.addFeatures([feature]); mkrambach@1279: } else { mkrambach@1279: this.selectControl.select(feature); mkrambach@1279: } mkrambach@1279: //TODO: the text of new features is still drawn on top of the old feature's text raimund@605: }, raimund@605: raimund@638: activateDraw: function(record) { raimund@638: this.locationRecord = record; raimund@638: if (!this.drawPoint) { raimund@638: this.drawPoint = new OpenLayers.Control.DrawFeature(this.featureLayer, raimund@638: OpenLayers.Handler.Point); raimund@638: this.map.addControl(this.drawPoint); raimund@638: } raimund@638: this.drawPoint.activate(); raimund@638: this.drawPoint.events.register('featureadded', this, this.featureAdded); raimund@638: }, raimund@638: raimund@638: featureAdded: function(features) { tom@1263: this.locationRecord.set('kdaId', 4); tom@1263: this.locationRecord.set('koordYExtern', features.feature.geometry.y); tom@1263: this.locationRecord.set('koordXExtern', features.feature.geometry.x); raimund@638: this.drawPoint.deactivate(); raimund@1130: this.fireEvent('featureadded', this.locationRecord); raimund@1130: // this.selectControl.unselectAll(); raimund@1130: // this.selectControl.select(features.feature); raimund@638: }, raimund@638: dustin@1021: addLocations: function(locationStore) { raimund@1049: var me = this; dustin@1021: locationFeatures = []; dustin@1021: dustin@1021: // Iterate the Store and create features from it dustin@1021: for (var i = 0; i < locationStore.count(); i++) { dustin@1021: locationFeatures.push(new OpenLayers.Feature.Vector( dustin@1021: new OpenLayers.Geometry.Point( dustin@1021: locationStore.getAt(i).get('longitude'), dustin@1021: locationStore.getAt(i).get('latitude') dustin@1021: ), dustin@1021: { dustin@1021: id: locationStore.getAt(i).get('id'), raimund@1049: bez: locationStore.getAt(i).get('ortId') dustin@1021: } dustin@1021: )); dustin@1021: } dustin@1021: dustin@1021: // Create a new Feature Layer and add it to the map raimund@1049: if (!this.featureLayer) { mkrambach@1279: this.featureLayer = new OpenLayers.Layer.Vector( 'alle Messpunkte', { raimund@1049: styleMap: new OpenLayers.StyleMap({ raimund@1049: 'default': new OpenLayers.Style(OpenLayers.Util.applyDefaults({ raimund@1049: externalGraphic: 'resources/lib/OpenLayers/img/marker-green.png', raimund@1049: graphicOpacity: 1, raimund@1049: pointRadius: 10, raimund@1049: label: '${bez}', raimund@1049: labelAlign: 'rt', raimund@1049: fontColor: 'green', raimund@1049: fontWeight: 'bold' raimund@1049: }, OpenLayers.Feature.Vector.style['default'])), raimund@1049: 'select': new OpenLayers.Style({ raimund@1049: externalGraphic: 'resources/lib/OpenLayers/img/marker-blue.png', raimund@1049: pointRadius: 15, raimund@1049: label: '${bez}', raimund@1049: labelAlign: 'rt', raimund@1049: fontColor: 'blue', raimund@1049: fontWeight: 'bold' raimund@1049: }) raimund@1274: }), mkrambach@1279: projection: new OpenLayers.Projection('EPSG:3857'), raimund@1274: preFeatureInsert: function(feature) { mkrambach@1279: feature.geometry.transform(new OpenLayers.Projection('EPSG:4326'), mkrambach@1279: new OpenLayers.Projection('EPSG:3857')); raimund@1274: } raimund@1049: }); raimund@1049: this.selectControl = new OpenLayers.Control.SelectFeature(this.featureLayer, { raimund@1049: clickout: false, raimund@1049: toggle: false, raimund@1049: multiple: false, raimund@1049: hover: false, raimund@1049: onSelect: me.selectedFeature, mkrambach@1279: layers: [me.featureLayer], raimund@1049: scope: me raimund@1049: }); raimund@1049: this.map.addControl(this.selectControl); raimund@1049: this.selectControl.activate(); raimund@1049: } raimund@1049: this.featureLayer.removeAllFeatures(); dustin@1021: this.featureLayer.addFeatures(locationFeatures); dustin@1021: this.map.addLayer(this.featureLayer); mkrambach@1279: this.featureLayer.setZIndex(500); dustin@1021: }, dustin@1021: raimund@605: /** raimund@605: * @private raimund@605: * Override to display and update the map view in the panel. raimund@605: */ raimund@605: afterRender: function() { raimund@605: this.superclass.afterRender.apply(this, arguments); dustin@796: raimund@605: this.map.render(this.body.dom); raimund@605: this.map.addControl(new OpenLayers.Control.Navigation()); raimund@605: this.map.addControl(new OpenLayers.Control.PanZoomBar()); raimund@605: this.map.addControl(new OpenLayers.Control.ScaleLine()); dustin@796: }, dustin@796: dustin@796: /** dustin@796: * Forward OpenlayersEvent to EXT dustin@796: */ mkrambach@1279: selectedFeature: function(feature) { mkrambach@1279: this.selectControl.unselectAll({except:feature}); dustin@796: this.fireEvent('featureselected', this, arguments); raimund@614: }, raimund@614: raimund@614: beforeDestroy: function() { raimund@614: if (this.map) { raimund@614: this.map.destroy(); raimund@614: } raimund@614: delete this.map; raimund@614: this.callParent(arguments); raimund@605: }, raimund@605: raimund@605: /** raimund@605: * @private raimund@605: * Override to resize the map and reposition the logo. raimund@605: */ raimund@605: onResize: function() { raimund@605: this.superclass.onResize.apply(this, arguments); raimund@605: this.map.updateSize(); raimund@605: } raimund@605: });