Split functions to controllers

1 files changed, 3 insertions, 332 deletions

diff --git a/web/app/view/MapController.js b/web/app/view/MapController.js
index bea1253b..c52fdd5f 100644
--- a/web/app/view/MapController.js
+++ b/web/app/view/MapController.js
@@ -16,59 +16,33 @@
  */
 
 Ext.define('Traccar.view.MapController', {
-    extend: 'Ext.app.ViewController',
+    extend: 'Traccar.view.MapMarkerController',
     alias: 'controller.map',
 
     requires: [
-        'Traccar.model.Position',
-        'Traccar.model.Device',
-        'Traccar.GeofenceConverter',
-        'Traccar.DeviceImages'
+        'Traccar.GeofenceConverter'
     ],
 
     config: {
         listen: {
             controller: {
                 '*': {
-                    selectdevice: 'selectDevice',
-                    selectreport: 'selectReport',
                     mapstaterequest: 'getMapState'
                 }
             },
             store: {
-                '#Devices': {
-                    add: 'updateDevice',
-                    update: 'updateDevice',
-                    remove: 'removeDevice'
-                },
-                '#LatestPositions': {
-                    add: 'updateLatest',
-                    update: 'updateLatest'
-                },
-                '#ReportRoute': {
-                    load: 'loadReport',
-                    clear: 'clearReport'
-                },
                 '#Geofences': {
                     load: 'showGeofences',
                     add: 'updateGeofences',
                     update: 'updateGeofences',
                     remove: 'updateGeofences'
                 }
-            },
-            component: {
-                '#': {
-                    selectfeature: 'selectFeature'
-                }
             }
         }
     },
 
     init: function () {
-        this.latestMarkers = {};
-        this.reportMarkers = {};
-        this.liveRoutes = {};
-        this.liveRouteLength = Traccar.app.getAttributePreference('web.liveRouteLength', 10);
+        this.callParent();
         this.lookupReference('showReportsButton').setVisible(Traccar.app.isMobile());
     },
 
@@ -76,56 +50,6 @@ Ext.define('Traccar.view.MapController', {
         Traccar.app.showReports(true);
     },
 
-    getDeviceColor: function (device) {
-        switch (device.get('status')) {
-            case 'online':
-                return Traccar.Style.mapColorOnline;
-            case 'offline':
-                return Traccar.Style.mapColorOffline;
-            default:
-                return Traccar.Style.mapColorUnknown;
-        }
-    },
-
-    updateDevice: function (store, data) {
-        var i, device, deviceId, marker, style;
-
-        if (!Ext.isArray(data)) {
-            data = [data];
-        }
-
-        for (i = 0; i < data.length; i++) {
-            device = data[i];
-            deviceId = device.get('id');
-
-            if (deviceId in this.latestMarkers) {
-                marker = this.latestMarkers[deviceId];
-                style = marker.getStyle();
-                if (style.getImage().fill !== this.getDeviceColor(device) ||
-                        style.getImage().category !== device.get('category')) {
-                    marker.setStyle(this.updateDeviceMarker(style, this.getDeviceColor(device), device.get('category')));
-                }
-                if (style.getText().getText() !== device.get('name')) {
-                    style.getText().setText(device.get('name'));
-                    marker.changed();
-                }
-            }
-        }
-    },
-
-    removeDevice: function (store, data) {
-        var i, deviceId;
-        if (!Ext.isArray(data)) {
-            data = [data];
-        }
-        for (i = 0; i < data.length; i++) {
-            deviceId = data[i].get('id');
-            if (this.latestMarkers[deviceId]) {
-                this.getView().getLatestSource().removeFeature(this.latestMarkers[deviceId]);
-            }
-        }
-    },
-
     onFollowClick: function (button, pressed) {
         if (pressed && this.selectedMarker) {
             this.getView().getMapView().setCenter(this.selectedMarker.getGeometry().getCoordinates());
@@ -136,259 +60,6 @@ Ext.define('Traccar.view.MapController', {
         this.getView().getLiveRouteLayer().setVisible(button.pressed);
     },
 
-    updateLatest: function (store, data) {
-        var i, position, device;
-
-        if (!Ext.isArray(data)) {
-            data = [data];
-        }
-
-        for (i = 0; i < data.length; i++) {
-            position = data[i];
-            device = Ext.getStore('Devices').findRecord('id', position.get('deviceId'), 0, false, false, true);
-
-            if (device) {
-                this.updateLatestMarker(position, device);
-                this.updateLiveRoute(position);
-            }
-        }
-    },
-
-    updateLatestMarker: function (position, device) {
-        var geometry, deviceId, marker, style;
-        geometry = new ol.geom.Point(ol.proj.fromLonLat([
-            position.get('longitude'),
-            position.get('latitude')
-        ]));
-        deviceId = position.get('deviceId');
-        if (deviceId in this.latestMarkers) {
-            marker = this.latestMarkers[deviceId];
-            style = marker.getStyle();
-            if (style.getImage().angle !== position.get('course')) {
-                Traccar.DeviceImages.rotateImageIcon(style.getImage(), position.get('course'));
-            }
-            marker.setGeometry(geometry);
-        } else {
-            marker = new ol.Feature(geometry);
-            marker.set('record', device);
-
-            style = this.getLatestMarker(this.getDeviceColor(device),
-                    position.get('course'),
-                    device.get('category'));
-            style.getText().setText(device.get('name'));
-            marker.setStyle(style);
-            this.latestMarkers[deviceId] = marker;
-            this.getView().getLatestSource().addFeature(marker);
-
-        }
-
-        if (marker === this.selectedMarker && this.lookupReference('deviceFollowButton').pressed) {
-            this.getView().getMapView().setCenter(marker.getGeometry().getCoordinates());
-        }
-    },
-
-    updateLiveRoute: function (position) {
-        var deviceId, liveLine, liveCoordinates, lastLiveCoordinates, newCoordinates;
-        deviceId = position.get('deviceId');
-        if (deviceId in this.liveRoutes) {
-            liveCoordinates = this.liveRoutes[deviceId].getGeometry().getCoordinates();
-            lastLiveCoordinates = liveCoordinates[liveCoordinates.length - 1];
-            newCoordinates = ol.proj.fromLonLat([position.get('longitude'), position.get('latitude')]);
-            if (lastLiveCoordinates[0] === newCoordinates[0] &&
-                    lastLiveCoordinates[1] === newCoordinates[1]) {
-                return;
-            }
-            if (liveCoordinates.length >= this.liveRouteLength) {
-                liveCoordinates.shift();
-            }
-            liveCoordinates.push(newCoordinates);
-            this.liveRoutes[deviceId].getGeometry().setCoordinates(liveCoordinates);
-        } else {
-            liveLine = new ol.Feature({
-                geometry: new ol.geom.LineString([
-                    ol.proj.fromLonLat([
-                        position.get('longitude'),
-                        position.get('latitude')
-                    ])
-                ])
-            });
-            liveLine.setStyle(this.getRouteStyle(deviceId));
-            this.liveRoutes[deviceId] = liveLine;
-            this.getView().getLiveRouteSource().addFeature(liveLine);
-        }
-    },
-
-    loadReport: function (store, data) {
-        var i, position, point, geometry, marker, style;
-
-        this.clearReport(store);
-
-        if (data.length > 0) {
-            this.reportRoute = [];
-            for (i = 0; i < data.length; i++) {
-                if (i === 0 || data[i].get('deviceId') !== data[i - 1].get('deviceId')) {
-                    this.reportRoute.push(new ol.Feature({
-                        geometry: new ol.geom.LineString([])
-                    }));
-                    this.reportRoute[this.reportRoute.length - 1].setStyle(this.getRouteStyle(data[i].get('deviceId')));
-                    this.getView().getRouteSource().addFeature(this.reportRoute[this.reportRoute.length - 1]);
-                }
-                position = data[i];
-
-                point = ol.proj.fromLonLat([
-                    position.get('longitude'),
-                    position.get('latitude')
-                ]);
-                geometry = new ol.geom.Point(point);
-
-                marker = new ol.Feature(geometry);
-                marker.set('record', position);
-                this.reportMarkers[position.get('id')] = marker;
-                this.getView().getReportSource().addFeature(marker);
-
-                style = this.getReportMarker(position.get('deviceId'), position.get('course'));
-                /*style.getText().setText(
-                    Ext.Date.format(position.get('fixTime'), Traccar.Style.dateTimeFormat24));*/
-
-                marker.setStyle(style);
-
-                this.reportRoute[this.reportRoute.length - 1].getGeometry().appendCoordinate(point);
-            }
-
-            this.getView().getMapView().fit(this.reportRoute[0].getGeometry(), this.getView().getMap().getSize());
-        }
-    },
-
-    clearReport: function (store) {
-        var key, i;
-
-        if (this.reportRoute) {
-            for (i = 0; i < this.reportRoute.length; i++) {
-                this.getView().getRouteSource().removeFeature(this.reportRoute[i]);
-            }
-            this.reportRoute = null;
-        }
-
-        if (this.reportMarkers) {
-            for (key in this.reportMarkers) {
-                if (this.reportMarkers.hasOwnProperty(key)) {
-                    this.getView().getReportSource().removeFeature(this.reportMarkers[key]);
-                }
-            }
-            this.reportMarkers = {};
-        }
-    },
-
-    getRouteStyle: function (deviceId) {
-        var index = 0;
-        if (deviceId !== undefined) {
-            index = deviceId % Traccar.Style.mapRouteColor.length;
-        }
-        return new ol.style.Style({
-            stroke: new ol.style.Stroke({
-                color: Traccar.Style.mapRouteColor[index],
-                width: Traccar.Style.mapRouteWidth
-            })
-        });
-    },
-
-    getMarkerStyle: function (zoom, color, angle, category) {
-        var image = Traccar.DeviceImages.getImageIcon(color, zoom, angle, category);
-        return new ol.style.Style({
-            image: image,
-            text: new ol.style.Text({
-                textBaseline: 'bottom',
-                fill: new ol.style.Fill({
-                    color: Traccar.Style.mapTextColor
-                }),
-                stroke: new ol.style.Stroke({
-                    color: Traccar.Style.mapTextStrokeColor,
-                    width: Traccar.Style.mapTextStrokeWidth
-                }),
-                offsetY: -image.getSize()[1] / 2 - Traccar.Style.mapTextOffset,
-                font : Traccar.Style.mapTextFont
-            })
-        });
-    },
-
-    getLatestMarker: function (color, angle, category) {
-        return this.getMarkerStyle(false, color, angle, category);
-    },
-
-    getReportMarker: function (deviceId, angle) {
-        var index = 0;
-        if (deviceId !== undefined) {
-            index = deviceId % Traccar.Style.mapRouteColor.length;
-        }
-        return this.getMarkerStyle(false, Traccar.Style.mapRouteColor[index], angle, 'arrow');
-    },
-
-    resizeMarker: function (style, zoom) {
-        var image, text;
-        image = Traccar.DeviceImages.getImageIcon(style.getImage().fill,
-                zoom,
-                style.getImage().angle,
-                style.getImage().category);
-        text = style.getText();
-        text.setOffsetY(-image.getSize()[1] / 2 - Traccar.Style.mapTextOffset);
-        return new ol.style.Style({
-            image: image,
-            text: text
-        });
-    },
-
-    updateDeviceMarker: function (style, color, category) {
-        var image, text;
-        image = Traccar.DeviceImages.getImageIcon(color,
-                style.getImage().zoom,
-                style.getImage().angle,
-                category);
-        text = style.getText();
-        text.setOffsetY(-image.getSize()[1] / 2 - Traccar.Style.mapTextOffset);
-        return new ol.style.Style({
-            image: image,
-            text: text
-        });
-    },
-
-    selectMarker: function (marker, center) {
-        if (this.selectedMarker) {
-            this.selectedMarker.setStyle(
-                this.resizeMarker(this.selectedMarker.getStyle(), false));
-        }
-
-        if (marker) {
-            marker.setStyle(
-                this.resizeMarker(marker.getStyle(), true));
-            if (center) {
-                this.getView().getMapView().setCenter(marker.getGeometry().getCoordinates());
-            }
-        }
-
-        this.selectedMarker = marker;
-    },
-
-    selectDevice: function (device, center) {
-        this.selectMarker(this.latestMarkers[device.get('id')], center);
-    },
-
-    selectReport: function (position, center) {
-        if (position instanceof Traccar.model.Position) {
-            this.selectMarker(this.reportMarkers[position.get('id')], center);
-        }
-    },
-
-    selectFeature: function (feature) {
-        var record = feature.get('record');
-        if (record) {
-            if (record instanceof Traccar.model.Device) {
-                this.fireEvent('selectdevice', record, false);
-            } else {
-                this.fireEvent('selectreport', record, false);
-            }
-        }
-    },
-
     getMapState: function () {
         var zoom, center, projection;
         projection = this.getView().getMapView().getProjection();