aboutsummaryrefslogtreecommitdiff
path: root/web/app/view
diff options
context:
space:
mode:
Diffstat (limited to 'web/app/view')
-rw-r--r--web/app/view/BaseMap.js118
-rw-r--r--web/app/view/Map.js122
2 files changed, 134 insertions, 106 deletions
diff --git a/web/app/view/BaseMap.js b/web/app/view/BaseMap.js
new file mode 100644
index 000000000..c2a889188
--- /dev/null
+++ b/web/app/view/BaseMap.js
@@ -0,0 +1,118 @@
+/*
+ * Copyright 2016 Anton Tananaev (anton.tananaev@gmail.com)
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+Ext.define('Traccar.view.BaseMap', {
+ extend: 'Ext.form.Panel',
+ xtype: 'baseMapView',
+
+ title: Strings.mapTitle,
+ layout: 'fit',
+
+ getMap: function () {
+ return this.map;
+ },
+
+ getMapView: function () {
+ return this.mapView;
+ },
+
+ initMap: function() {
+ var user, server, layer, type, bingKey, lat, lon, zoom, target;
+
+ user = Traccar.app.getUser();
+ server = Traccar.app.getServer();
+
+ type = user.get('map') || server.get('map');
+ bingKey = server.get('bingKey');
+
+ if (type === 'custom') {
+ layer = new ol.layer.Tile({
+ source: new ol.source.XYZ({
+ url: server.get('mapUrl'),
+ attributions: [new ol.Attribution({
+ html: ''
+ })]
+ })
+ });
+ } else if (type === 'bingRoad') {
+ layer = new ol.layer.Tile({
+ source: new ol.source.BingMaps({
+ key: bingKey,
+ imagerySet: 'Road'
+ })
+ });
+ } else if (type === 'bingAerial') {
+ layer = new ol.layer.Tile({
+ source: new ol.source.BingMaps({
+ key: bingKey,
+ imagerySet: 'Aerial'
+ })
+ });
+ } else {
+ layer = new ol.layer.Tile({
+ source: new ol.source.OSM({})
+ });
+ }
+
+ lat = user.get('latitude') || server.get('latitude') || Traccar.Style.mapDefaultLat;
+ lon = user.get('longitude') || server.get('longitude') || Traccar.Style.mapDefaultLon;
+ zoom = user.get('zoom') || server.get('zoom') || Traccar.Style.mapDefaultZoom;
+
+ this.mapView = new ol.View({
+ center: ol.proj.fromLonLat([lon, lat]),
+ zoom: zoom,
+ maxZoom: Traccar.Style.mapMaxZoom
+ });
+
+ this.map = new ol.Map({
+ target: this.body.dom.id,
+ layers: [layer],
+ view: this.mapView
+ });
+
+ target = this.map.getTarget();
+ if (typeof target === 'string') {
+ target = Ext.get(target).dom;
+ }
+
+ this.map.on('pointermove', function (e) {
+ var hit = this.forEachFeatureAtPixel(e.pixel, function (feature, layer) {
+ return true;
+ });
+ if (hit) {
+ target.style.cursor = 'pointer';
+ } else {
+ target.style.cursor = '';
+ }
+ });
+
+ this.map.on('click', function (e) {
+ this.map.forEachFeatureAtPixel(e.pixel, function (feature, layer) {
+ this.fireEvent('selectFeature', feature);
+ }, this);
+ }, this);
+ },
+
+ listeners: {
+ afterrender: function () {
+ this.initMap();
+ },
+
+ resize: function () {
+ this.map.updateSize();
+ }
+ }
+});
diff --git a/web/app/view/Map.js b/web/app/view/Map.js
index b8c0d8dc5..d06630e38 100644
--- a/web/app/view/Map.js
+++ b/web/app/view/Map.js
@@ -1,5 +1,5 @@
/*
- * Copyright 2015 Anton Tananaev (anton.tananaev@gmail.com)
+ * Copyright 2015 - 2016 Anton Tananaev (anton.tananaev@gmail.com)
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
@@ -15,7 +15,7 @@
*/
Ext.define('Traccar.view.Map', {
- extend: 'Ext.form.Panel',
+ extend: 'Traccar.view.BaseMap',
xtype: 'mapView',
requires: [
@@ -24,17 +24,6 @@ Ext.define('Traccar.view.Map', {
controller: 'map',
- title: Strings.mapTitle,
- layout: 'fit',
-
- getMap: function () {
- return this.map;
- },
-
- getMapView: function () {
- return this.mapView;
- },
-
getLatestSource: function () {
return this.latestSource;
},
@@ -47,101 +36,22 @@ Ext.define('Traccar.view.Map', {
return this.reportSource;
},
- listeners: {
- afterrender: function () {
- var user, server, layer, type, bingKey, latestLayer, routeLayer, reportLayer, lat, lon, zoom, target;
-
- user = Traccar.app.getUser();
- server = Traccar.app.getServer();
-
- type = user.get('map') || server.get('map');
- bingKey = server.get('bingKey');
-
- if (type === 'custom') {
- layer = new ol.layer.Tile({
- source: new ol.source.XYZ({
- url: server.get('mapUrl'),
- attributions: [new ol.Attribution({
- html: ''
- })]
- })
- });
- } else if (type === 'bingRoad') {
- layer = new ol.layer.Tile({
- source: new ol.source.BingMaps({
- key: bingKey,
- imagerySet: 'Road'
- })
- });
- } else if (type === 'bingAerial') {
- layer = new ol.layer.Tile({
- source: new ol.source.BingMaps({
- key: bingKey,
- imagerySet: 'Aerial'
- })
- });
- } else {
- layer = new ol.layer.Tile({
- source: new ol.source.OSM({})
- });
- }
-
- this.latestSource = new ol.source.Vector({});
- latestLayer = new ol.layer.Vector({
- source: this.latestSource
- });
-
- this.routeSource = new ol.source.Vector({});
- routeLayer = new ol.layer.Vector({
- source: this.routeSource
- });
-
- this.reportSource = new ol.source.Vector({});
- reportLayer = new ol.layer.Vector({
- source: this.reportSource
- });
-
- lat = user.get('latitude') || server.get('latitude') || Traccar.Style.mapDefaultLat;
- lon = user.get('longitude') || server.get('longitude') || Traccar.Style.mapDefaultLon;
- zoom = user.get('zoom') || server.get('zoom') || Traccar.Style.mapDefaultZoom;
-
- this.mapView = new ol.View({
- center: ol.proj.fromLonLat([lon, lat]),
- zoom: zoom,
- maxZoom: Traccar.Style.mapMaxZoom
- });
-
- this.map = new ol.Map({
- target: this.body.dom.id,
- layers: [layer, routeLayer, reportLayer, latestLayer],
- view: this.mapView
- });
-
- target = this.map.getTarget();
- if (typeof target === 'string') {
- target = Ext.get(target).dom;
- }
+ initMap: function () {
+ this.callParent();
- this.map.on('pointermove', function (e) {
- var hit = this.forEachFeatureAtPixel(e.pixel, function (feature, layer) {
- return true;
- });
- if (hit) {
- target.style.cursor = 'pointer';
- } else {
- target.style.cursor = '';
- }
- });
+ this.latestSource = new ol.source.Vector({});
+ this.map.addLayer(new ol.layer.Vector({
+ source: this.latestSource
+ }));
- this.map.on('click', function (e) {
- this.map.forEachFeatureAtPixel(e.pixel, function (feature, layer) {
- this.fireEvent('selectFeature', feature);
- }, this);
- }, this);
- },
+ this.routeSource = new ol.source.Vector({});
+ this.map.addLayer(new ol.layer.Vector({
+ source: this.routeSource
+ }));
- resize: function () {
- this.map.updateSize();
- }
+ this.reportSource = new ol.source.Vector({});
+ this.map.addLayer(new ol.layer.Vector({
+ source: this.reportSource
+ }));
}
});
generated by cgit v1.2.3 (git 2.39.1) at 2024-11-07 18:53:37 +0000