Improve CustomNumberField

3 files changed, 81 insertions, 53 deletions

diff --git a/web/app/store/TimeUnits.js b/web/app/store/TimeUnits.js
index 6afeb935..0d16c4bb 100644
--- a/web/app/store/TimeUnits.js
+++ b/web/app/store/TimeUnits.js
@@ -1,5 +1,5 @@
 /*
- * Copyright 2015 Anton Tananaev (anton@traccar.org)
+ * Copyright 2015 - 2017 Anton Tananaev (anton@traccar.org)
  *
  * This program is free software: you can redistribute it and/or modify
  * it under the terms of the GNU General Public License as published by
@@ -17,16 +17,28 @@
 
 Ext.define('Traccar.store.TimeUnits', {
     extend: 'Ext.data.Store',
-    fields: ['name', 'factor'],
+    fields: ['key', 'name', 'factor'],
 
     data: [{
+        key: 's',
         name: Strings.sharedSecondAbbreviation,
         factor: 1
     }, {
+        key: 'm',
         name: Strings.sharedMinuteAbbreviation,
         factor: 60
     }, {
+        key: 'h',
         name: Strings.sharedHourAbbreviation,
         factor: 3600
-    }]
+    }],
+
+    convertValue: function (value, unit, back) {
+        var model;
+        if (!unit) {
+            unit = 'kn';
+        }
+        model = this.findRecord('key', unit);
+        return back ? value * model.get('factor') : value / model.get('factor');
+    }
 });
diff --git a/web/app/view/CustomNumberField.js b/web/app/view/CustomNumberField.js
index 9144b524..bc07691b 100644
--- a/web/app/view/CustomNumberField.js
+++ b/web/app/view/CustomNumberField.js
@@ -19,63 +19,80 @@ Ext.define('Traccar.view.CustomNumberField', {
     extend: 'Ext.form.field.Number',
     xtype: 'customNumberField',
 
-    beforeEl: '<div style="width:100%;display:inline-table;">',
-    unitEl: '<div id="unitEl" style="display:table-cell;padding-left:10px;vertical-align:middle;width:30%">',
+    beforeEl: '<div style="display:inline-table;width:100%">',
+    unitEl: '<div id="numberUnitEl" style="display:table-cell;padding-left:10px;vertical-align:middle;width:1px;white-space:nowrap;">',
 
     constructor: function (config) {
-        var unit;
-        if (config.dataType === 'speed') {
-            unit = Traccar.app.getPreference('speedUnit', 'kn');
-            config.beforeSubTpl = this.beforeEl;
-            config.afterSubTpl = this.unitEl + Ext.getStore('SpeedUnits').findRecord('key', unit).get('name') + '</div></div>';
-            config.rawToValue = function (rawValue) {
-                return Ext.getStore('SpeedUnits').convertValue(rawValue, Traccar.app.getPreference('speedUnit', 'kn'), true);
-            };
-            config.valueToRaw = function (value) {
-                return Ext.getStore('SpeedUnits').convertValue(value, Traccar.app.getPreference('speedUnit', 'kn'));
-            };
-        } else if (config.dataType === 'distance') {
-            config.beforeSubTpl = this.beforeEl;
-            unit = Traccar.app.getPreference('distanceUnit', 'km');
-            config.afterSubTpl = this.unitEl + Ext.getStore('DistanceUnits').findRecord('key', unit).get('name') + '</div></div>';
-            config.rawToValue = function (rawValue) {
-                return Ext.getStore('DistanceUnits').convertValue(rawValue, Traccar.app.getPreference('distanceUnit', 'km'), true);
-            };
-            config.valueToRaw = function (value) {
-                return Ext.getStore('DistanceUnits').convertValue(value, Traccar.app.getPreference('distanceUnit', 'km'));
-            };
-        } else if (config.dataType === 'frequency') {
-            config.beforeSubTpl = this.beforeEl;
-            config.afterSubTpl = this.unitEl + '</div></div>';
-            config.listeners = {
-                afterrender: function (numberField) {
-                    if (!numberField.timeUnits) {
-                        numberField.timeUnits = Ext.create({
-                            xtype: 'combobox',
-                            renderTo: 'unitEl',
-                            store: 'TimeUnits',
-                            displayField: 'name',
-                            valueField: 'factor',
-                            value: 1,
-                            width: 70
-                        });
+        var unitName = '';
+        if (config.dataType) {
+            config.beforeBodyEl = this.beforeEl;
+            switch (config.dataType) {
+                case 'speed':
+                    config.units = {};
+                    config.units.getStore = function () {
+                        return Ext.getStore('SpeedUnits');
+                    };
+                    config.units.getValue = function () {
+                        return Traccar.app.getPreference('speedUnit', 'kn');
+                    };
+                    unitName = Ext.getStore('SpeedUnits').findRecord('key', config.units.getValue()).get('name');
+                    break;
+                case 'distance':
+                    config.units = {};
+                    config.units.getStore = function () {
+                        return Ext.getStore('DistanceUnits');
+                    };
+                    config.units.getValue = function () {
+                        return Traccar.app.getPreference('distanceUnit', 'km');
+                    };
+                    unitName = Ext.getStore('DistanceUnits').findRecord('key', config.units.getValue()).get('name');
+                    break;
+                case 'frequency':
+                    if (!config.listeners) {
+                        config.listeners = {};
                     }
-                }
-            };
+                    config.listeners.afterrender = function () {
+                        if (!this.units) {
+                            this.units = Ext.create({
+                                xtype: 'combobox',
+                                renderTo: 'numberUnitEl',
+                                store: 'TimeUnits',
+                                displayField: 'name',
+                                valueField: 'key',
+                                editable: false,
+                                numberField: this,
+                                value: 's',
+                                width: '70px',
+                                listeners: {
+                                    select: function () {
+                                        this.numberField.step = this.getStore().convertValue(1, this.getValue(), true);
+                                    }
+                                }
+                            });
+                        }
+                    };
+                    break;
+                default:
+                    break;
+            }
+            config.afterBodyEl = this.unitEl + unitName + '</div></div>';
             config.rawToValue = function (rawValue) {
-                if (this.timeUnits) {
-                    return rawValue * this.timeUnits.getValue();
+                if (this.units) {
+                    return this.units.getStore().convertValue(rawValue, this.units.getValue(), true);
                 } else {
-                    return rawValue;
+                    return this.parseValue(rawValue);
                 }
             };
             config.valueToRaw = function (value) {
-                if (this.timeUnits) {
-                    return value / this.timeUnits.getValue();
+                if (this.units) {
+                    return this.units.getStore().convertValue(value, this.units.getValue(), false);
                 } else {
-                    return value;
+                    return this.parseValue(value);
                 }
             };
+            if (config.units) {
+                config.step = config.units.getStore().convertValue(1, config.units.getValue(), true);
+            }
         }
         this.callParent(arguments);
     }
diff --git a/web/app/view/dialog/CommandController.js b/web/app/view/dialog/CommandController.js
index 4ab51847..fc233f30 100644
--- a/web/app/view/dialog/CommandController.js
+++ b/web/app/view/dialog/CommandController.js
@@ -75,11 +75,10 @@ Ext.define('Traccar.view.dialog.CommandController', {
         record = form.getRecord();
         parameters = this.lookupReference('parameters').items.items;
 
-        if (parameters.length > 0) {
-            for (i = 0; i < parameters.length; i++) {
-                attributes[parameters[i].key] = parameters[i].getValue();
-            }
+        for (i = 0; i < parameters.length; i++) {
+            attributes[parameters[i].key] = parameters[i].getValue();
         }
+
         record.set('attributes', attributes);
 
         Ext.Ajax.request({