From 167dec228bf9227fbf1f9fa4a428b8bb309c5f94 Mon Sep 17 00:00:00 2001 From: Anton Tananaev Date: Sat, 15 Jul 2017 18:01:12 +1200 Subject: Improvement to events panel --- web/app/view/Events.js | 18 ++++++++++-- web/app/view/EventsController.js | 37 +++++++++++++++++++++++-- web/app/view/ReportController.js | 6 ++-- web/app/view/StateController.js | 4 +-- web/app/view/edit/AttributeAliasesController.js | 6 ++-- web/app/view/edit/DevicesController.js | 8 +++--- web/app/view/edit/GroupsController.js | 2 +- web/app/view/edit/ToolbarController.js | 2 +- web/app/view/map/MapMarkerController.js | 35 +++++++++++++++++++---- 9 files changed, 93 insertions(+), 25 deletions(-) (limited to 'web/app/view') diff --git a/web/app/view/Events.js b/web/app/view/Events.js index 1965690..ca1f3ea 100644 --- a/web/app/view/Events.js +++ b/web/app/view/Events.js @@ -60,7 +60,7 @@ Ext.define('Traccar.view.Events', { toggleHandler: 'onScrollToLastClick', stateId: 'events-scroll-to-last-button', tooltip: Strings.eventsScrollToLast, - reference: 'scrollToLast' + reference: 'scrollToLastButton' }, { id: 'soundButton', glyph: 'xf0a2@FontAwesome', @@ -68,6 +68,14 @@ Ext.define('Traccar.view.Events', { stateId: 'sound-button' }, { glyph: 'xf014@FontAwesome', + tooltip: Strings.sharedRemove, + handler: 'onRemoveClick', + reference: 'removeEventButton', + disabled: true, + stateful: false, + enableToggle: false + }, { + glyph: 'xf1f8@FontAwesome', tooltip: Strings.reportClear, handler: 'onClearClick', stateful: false, @@ -76,20 +84,24 @@ Ext.define('Traccar.view.Events', { glyph: 'xf00d@FontAwesome', tooltip: Strings.sharedHide, handler: 'onHideEvents', - reference: 'hideEvents', + reference: 'hideEventsButton', hidden: true, stateful: false, enableToggle: false }] }, + listeners: { + selectionchange: 'onSelectionChange' + }, + columns: { defaults: { flex: 1, minWidth: Traccar.Style.columnWidthNormal }, items: [{ - text: Strings.reportDeviceName, + text: Strings.sharedDevice, dataIndex: 'deviceId', renderer: Traccar.AttributeFormatter.getFormatter('deviceId') }, { diff --git a/web/app/view/EventsController.js b/web/app/view/EventsController.js index 5cd9fb8..1737f26 100644 --- a/web/app/view/EventsController.js +++ b/web/app/view/EventsController.js @@ -22,6 +22,11 @@ Ext.define('Traccar.view.EventsController', { config: { listen: { + controller: { + '*': { + deselectevent: 'deselectEvent' + } + }, store: { '#Events': { add: 'onAddEvent' @@ -37,16 +42,28 @@ Ext.define('Traccar.view.EventsController', { }, Traccar.Style.refreshPeriod); if (Traccar.app.isMobile()) { - this.lookupReference('hideEvents').setHidden(false); + this.lookupReference('hideEventsButton').setHidden(false); + } + }, + + onRemoveClick: function (button) { + var event = this.getView().getSelectionModel().getSelection()[0]; + if (event) { + Ext.getStore('Events').remove(event); + if (event.get('positionId')) { + Ext.getStore('EventPositions').remove( + Ext.getStore('EventPositions').getById(event.get('positionId'))); + } } }, onClearClick: function (button) { Ext.getStore('Events').removeAll(); + Ext.getStore('EventPositions').removeAll(); }, onAddEvent: function (store, data) { - if (this.lookupReference('scrollToLast').pressed) { + if (this.lookupReference('scrollToLastButton').pressed) { this.getView().scrollBy(0, Number.POSITIVE_INFINITY, true); } }, @@ -59,5 +76,21 @@ Ext.define('Traccar.view.EventsController', { onHideEvents: function () { Traccar.app.showEvents(false); + }, + + deselectEvent: function () { + this.getView().getSelectionModel().deselectAll(); + }, + + onSelectionChange: function (selection, selected) { + var event, position; + event = selected.length > 0 ? selected[0] : null; + if (event && event.get('positionId')) { + position = Ext.getStore('EventPositions').getById(event.get('positionId')); + if (position) { + this.fireEvent('selectevent', position); + } + } + this.lookupReference('removeEventButton').setDisabled(!event); } }); diff --git a/web/app/view/ReportController.js b/web/app/view/ReportController.js index 7dfeaf3..d74fdfb 100644 --- a/web/app/view/ReportController.js +++ b/web/app/view/ReportController.js @@ -184,10 +184,10 @@ Ext.define('Traccar.view.ReportController', { } }, - onSelectionChange: function (selected) { + onSelectionChange: function (selection, selected) { var report; - if (selected.getCount() > 0) { - report = selected.getLastSelected(); + if (selected.length > 0) { + report = selected[0]; this.fireEvent('selectreport', report, true); if (report instanceof Traccar.model.ReportTrip) { this.selectTrip(report); diff --git a/web/app/view/StateController.js b/web/app/view/StateController.js index 4c99a8b..23369b8 100644 --- a/web/app/view/StateController.js +++ b/web/app/view/StateController.js @@ -176,8 +176,8 @@ Ext.define('Traccar.view.StateController', { } }, - onSelectionChange: function (selected, records) { - var enabled = selected.getCount() > 0 && records[0].get('priority') === 1024; + onSelectionChange: function (selection, selected) { + var enabled = selected.length > 0 && selected[0].get('priority') === 1024; this.lookupReference('aliasEditButton').setDisabled(!enabled); }, diff --git a/web/app/view/edit/AttributeAliasesController.js b/web/app/view/edit/AttributeAliasesController.js index fc2b57f..d1beb13 100644 --- a/web/app/view/edit/AttributeAliasesController.js +++ b/web/app/view/edit/AttributeAliasesController.js @@ -53,17 +53,17 @@ Ext.define('Traccar.view.edit.AttributeAliasesController', { dialog.show(); }, - onSelectionChange: function (selected) { + onSelectionChange: function (selection, selected) { var disabled = !this.lookupReference('deviceField').getValue(); this.lookupReference('toolbarAddButton').setDisabled(disabled); - disabled = selected.length === 0 || !this.lookupReference('deviceField').getValue(); + disabled = !selected || selected.length === 0 || !this.lookupReference('deviceField').getValue(); this.lookupReference('toolbarEditButton').setDisabled(disabled); this.lookupReference('toolbarRemoveButton').setDisabled(disabled); }, onDeviceChange: function (combobox, newValue, oldValue) { var manager = Traccar.app.getUser().get('admin') || Traccar.app.getUser().get('userLimit') > 0; - this.onSelectionChange(''); + this.onSelectionChange(); if (newValue !== null) { this.getView().getStore().filter('deviceId', newValue); if (manager && this.getView().getStore().getCount() === 0) { diff --git a/web/app/view/edit/DevicesController.js b/web/app/view/edit/DevicesController.js index 0cdf18a..48c5f5b 100644 --- a/web/app/view/edit/DevicesController.js +++ b/web/app/view/edit/DevicesController.js @@ -133,7 +133,7 @@ Ext.define('Traccar.view.edit.DevicesController', { var readonly, deviceReadonly, empty; deviceReadonly = Traccar.app.getPreference('deviceReadonly', false) && !Traccar.app.getUser().get('admin'); readonly = Traccar.app.getPreference('readonly', false) && !Traccar.app.getUser().get('admin'); - empty = selected.getCount() === 0; + empty = selected.length === 0; this.lookupReference('toolbarEditButton').setDisabled(empty || readonly || deviceReadonly); this.lookupReference('toolbarRemoveButton').setDisabled(empty || readonly || deviceReadonly); this.lookupReference('toolbarGeofencesButton').setDisabled(empty || readonly); @@ -142,10 +142,10 @@ Ext.define('Traccar.view.edit.DevicesController', { this.lookupReference('deviceCommandButton').setDisabled(empty || readonly); }, - onSelectionChange: function (selected) { + onSelectionChange: function (selection, selected) { this.updateButtons(selected); - if (selected.getCount() > 0) { - this.fireEvent('selectdevice', selected.getLastSelected(), true); + if (selected.length > 0) { + this.fireEvent('selectdevice', selected[0], true); } else { this.fireEvent('deselectfeature'); } diff --git a/web/app/view/edit/GroupsController.js b/web/app/view/edit/GroupsController.js index a170b3e..34eec8d 100644 --- a/web/app/view/edit/GroupsController.js +++ b/web/app/view/edit/GroupsController.js @@ -83,7 +83,7 @@ Ext.define('Traccar.view.edit.GroupsController', { }).show(); }, - onSelectionChange: function (selected) { + onSelectionChange: function (selection, selected) { var disabled = selected.length > 0; this.lookupReference('toolbarGeofencesButton').setDisabled(disabled); this.lookupReference('toolbarAttributesButton').setDisabled(disabled); diff --git a/web/app/view/edit/ToolbarController.js b/web/app/view/edit/ToolbarController.js index fdbaa7e..2b2297a 100644 --- a/web/app/view/edit/ToolbarController.js +++ b/web/app/view/edit/ToolbarController.js @@ -62,7 +62,7 @@ Ext.define('Traccar.view.edit.ToolbarController', { }); }, - onSelectionChange: function (selected) { + onSelectionChange: function (selection, selected) { var disabled = selected.length > 0; this.lookupReference('toolbarEditButton').setDisabled(disabled); this.lookupReference('toolbarRemoveButton').setDisabled(disabled); diff --git a/web/app/view/map/MapMarkerController.js b/web/app/view/map/MapMarkerController.js index a9732dd..5d41932 100644 --- a/web/app/view/map/MapMarkerController.js +++ b/web/app/view/map/MapMarkerController.js @@ -31,7 +31,8 @@ Ext.define('Traccar.view.map.MapMarkerController', { controller: { '*': { selectdevice: 'selectDevice', - selectreport: 'selectReport' + selectreport: 'selectReport', + selectevent: 'selectEvent' }, 'devices': { deselectfeature: 'deselectDevice' @@ -57,6 +58,10 @@ Ext.define('Traccar.view.map.MapMarkerController', { add: 'addReportMarkers', load: 'loadReport', clear: 'clearReport' + }, + '#EventPositions': { + remove: 'clearEvent', + clear: 'clearEvent' } }, component: { @@ -330,8 +335,8 @@ Ext.define('Traccar.view.map.MapMarkerController', { marker.set('record', position); style = this.getReportMarker(position.get('deviceId'), position.get('course')); marker.setStyle(style); - this.reportMarkers[position.get('id')] = marker; this.getView().getMarkersSource().addFeature(marker); + return marker; }, addReportMarkers: function (store, data) { @@ -339,7 +344,7 @@ Ext.define('Traccar.view.map.MapMarkerController', { this.clearReport(); for (i = 0; i < data.length; i++) { if (store.showMarkers) { - this.addReportMarker(data[i]); + this.reportMarkers[data[i].get('id')] = this.addReportMarker(data[i]); } } this.zoomToAllPositions(data); @@ -364,11 +369,20 @@ Ext.define('Traccar.view.map.MapMarkerController', { this.reportMarkers = {}; } - if (this.selectedMarker && this.selectedMarker.get('record') instanceof Traccar.model.Position) { + if (this.selectedMarker && !this.selectedMarker.get('event') && + this.selectedMarker.get('record') instanceof Traccar.model.Position) { this.selectedMarker = null; } }, + clearEvent: function () { + if (this.selectedMarker && this.selectedMarker.get('event')) { + if (!Ext.getStore('EventPositions').getById(this.selectedMarker.get('record').getId())) { + this.selectMarker(null, false); + } + } + }, + getRouteStyle: function (deviceId) { return new ol.style.Style({ stroke: new ol.style.Stroke({ @@ -438,7 +452,10 @@ Ext.define('Traccar.view.map.MapMarkerController', { selectMarker: function (marker, center) { if (this.selectedMarker) { - if (!Ext.getStore('ReportRoute').showMarkers && + if (this.selectedMarker.get('event')) { + this.getView().getMarkersSource().removeFeature(this.selectedMarker); + this.fireEvent('deselectevent'); + } else if (!Ext.getStore('ReportRoute').showMarkers && this.selectedMarker.get('record') instanceof Traccar.model.Position) { this.getView().getMarkersSource().removeFeature(this.selectedMarker); delete this.reportMarkers[this.selectedMarker.get('record').get('id')]; @@ -471,12 +488,18 @@ Ext.define('Traccar.view.map.MapMarkerController', { selectReport: function (position, center) { if (position instanceof Traccar.model.Position) { if (!Ext.getStore('ReportRoute').showMarkers) { - this.addReportMarker(position); + this.reportMarkers[position.get('id')] = this.addReportMarker(position); } this.selectMarker(this.reportMarkers[position.get('id')], center); } }, + selectEvent: function (position) { + var maker = this.addReportMarker(position); + maker.set('event', true); + this.selectMarker(maker, true); + }, + selectFeature: function (feature) { var record = feature.get('record'); if (record) { -- cgit v1.2.3