diff options
Diffstat (limited to 'web/app/view')
-rw-r--r-- | web/app/view/ColorPicker.js | 43 | ||||
-rw-r--r-- | web/app/view/dialog/Attribute.js | 11 | ||||
-rw-r--r-- | web/app/view/dialog/AttributeController.js | 44 | ||||
-rw-r--r-- | web/app/view/edit/Attributes.js | 9 | ||||
-rw-r--r-- | web/app/view/edit/AttributesController.js | 56 |
5 files changed, 155 insertions, 8 deletions
diff --git a/web/app/view/ColorPicker.js b/web/app/view/ColorPicker.js new file mode 100644 index 00000000..5de03aa3 --- /dev/null +++ b/web/app/view/ColorPicker.js @@ -0,0 +1,43 @@ +/* + * Copyright 2017 Anton Tananaev (anton@traccar.org) + * Copyright 2017 Andrey Kunitsyn (andrey@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 + * the Free Software Foundation, either version 3 of the License, or + * (at your option) any later version. + * + * This program is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + * GNU General Public License for more details. + * + * You should have received a copy of the GNU General Public License + * along with this program. If not, see <http://www.gnu.org/licenses/>. + */ +Ext.define('Traccar.view.ColorPicker', { + extend: 'Ext.form.field.Picker', + xtype: 'customcolorpicker', + + config: { + value: '#008000' + }, + + editable: false, + + createPicker: function () { + return Ext.create('Ext.picker.Color', { + floating: true, + picker: this, + select: function (selColor) { + this.picker.setValue('#' + selColor); + this.picker.collapse(); + } + }); + }, + + setValue: function (color) { + this.callParent([color]); + this.setFieldStyle('background-color:' + color); + } +}); diff --git a/web/app/view/dialog/Attribute.js b/web/app/view/dialog/Attribute.js index 993c2b12..6614c87f 100644 --- a/web/app/view/dialog/Attribute.js +++ b/web/app/view/dialog/Attribute.js @@ -19,7 +19,8 @@ Ext.define('Traccar.view.dialog.Attribute', { extend: 'Traccar.view.dialog.Base', requires: [ - 'Traccar.view.dialog.AttributeController' + 'Traccar.view.dialog.AttributeController', + 'Traccar.view.ColorPicker' ], controller: 'attribute', @@ -27,19 +28,27 @@ Ext.define('Traccar.view.dialog.Attribute', { items: { xtype: 'form', + listeners: { + validitychange: 'onValidityChange' + }, items: [{ xtype: 'textfield', + reference: 'nameTextField', name: 'name', + allowBlank: false, fieldLabel: Strings.sharedName }, { xtype: 'textfield', name: 'value', + reference: 'valueField', + allowBlank: false, fieldLabel: Strings.stateValue }] }, buttons: [{ glyph: 'xf00c@FontAwesome', + reference: 'saveButton', tooltip: Strings.sharedSave, tooltipType: 'title', minWidth: 0, diff --git a/web/app/view/dialog/AttributeController.js b/web/app/view/dialog/AttributeController.js index 365a0df5..da5205b4 100644 --- a/web/app/view/dialog/AttributeController.js +++ b/web/app/view/dialog/AttributeController.js @@ -39,5 +39,49 @@ Ext.define('Traccar.view.dialog.AttributeController', { record.save(); } button.up('window').close(); + }, + + onValidityChange: function (form, valid) { + this.lookupReference('saveButton').setDisabled(!valid); + }, + + defaultFieldConfig: { + name: 'value', + reference: 'valueField', + allowBlank: false, + fieldLabel: Strings.stateValue + }, + + onNameChange: function (combobox, newValue) { + var type, config, attribute, valueField = this.lookupReference('valueField'); + attribute = combobox.getStore().getById(newValue); + if (attribute) { + type = attribute.get('type'); + config = Ext.clone(this.defaultFieldConfig); + if (type === 'number') { + config.xtype = 'numberfield'; + if (attribute.get('allowDecimals') !== undefined) { + config.allowDecimals = attribute.get('allowDecimals'); + } else { + config.allowDecimals = true; + } + config.maxValue = attribute.get('maxValue'); + config.minValue = attribute.get('minValue'); + } else if (type === 'boolean') { + config.xtype = 'checkboxfield'; + config.inputValue = true; + config.uncheckedValue = false; + } else if (type === 'color') { + config.xtype = 'customcolorpicker'; + } else { + config.xtype = 'textfield'; + } + if (valueField.getXType() !== config.xtype) { + this.getView().down('form').insert(this.getView().down('form').items.indexOf(valueField), config); + this.getView().down('form').remove(valueField); + } else if (config.xtype === 'numberfield') { + valueField.setConfig(config); + } + } } }); diff --git a/web/app/view/edit/Attributes.js b/web/app/view/edit/Attributes.js index 93e5a3a7..80083193 100644 --- a/web/app/view/edit/Attributes.js +++ b/web/app/view/edit/Attributes.js @@ -41,7 +41,14 @@ Ext.define('Traccar.view.edit.Attributes', { }, items: [{ text: Strings.sharedName, - dataIndex: 'name' + dataIndex: 'name', + renderer: function (value, metaData) { + var result; + if (this.attributesStore) { + result = Ext.getStore(this.attributesStore).getById(value); + } + return result && result.get('name') ? result.get('name') : value; + } }, { text: Strings.stateValue, dataIndex: 'value' diff --git a/web/app/view/edit/AttributesController.js b/web/app/view/edit/AttributesController.js index 1ae32c78..235f2c5b 100644 --- a/web/app/view/edit/AttributesController.js +++ b/web/app/view/edit/AttributesController.js @@ -25,8 +25,6 @@ Ext.define('Traccar.view.edit.AttributesController', { 'Traccar.model.Attribute' ], - objectModel: 'Traccar.model.Attribute', - objectDialog: 'Traccar.view.dialog.Attribute', removeTitle: Strings.stateName, init: function () { @@ -42,18 +40,18 @@ Ext.define('Traccar.view.edit.AttributesController', { store.add(Ext.create('Traccar.model.Attribute', { priority: i++, name: propertyName, - value: this.getView().record.get('attributes')[propertyName] + value: attributes[propertyName] })); } } - store.addListener('add', function (store, records, index, eOpts) { + store.addListener('add', function (store, records) { var i; for (i = 0; i < records.length; i++) { this.getView().record.get('attributes')[records[i].get('name')] = records[i].get('value'); } this.getView().record.dirty = true; }, this); - store.addListener('update', function (store, record, operation, modifiedFieldNames, details, eOpts) { + store.addListener('update', function (store, record, operation) { if (operation === Ext.data.Model.EDIT) { if (record.modified.name !== record.get('name')) { delete this.getView().record.get('attributes')[record.modified.name]; @@ -62,7 +60,7 @@ Ext.define('Traccar.view.edit.AttributesController', { this.getView().record.dirty = true; } }, this); - store.addListener('remove', function (store, records, index, isMove, eOpts) { + store.addListener('remove', function (store, records) { var i; for (i = 0; i < records.length; i++) { delete this.getView().record.get('attributes')[records[i].get('name')]; @@ -71,5 +69,51 @@ Ext.define('Traccar.view.edit.AttributesController', { }, this); this.getView().setStore(store); + if (this.getView().record instanceof Traccar.model.Device) { + this.getView().attributesStore = 'DeviceAttributes'; + } else if (this.getView().record instanceof Traccar.model.Geofence) { + this.getView().attributesStore = 'GeofenceAttributes'; + } else if (this.getView().record instanceof Traccar.model.Group) { + this.getView().attributesStore = 'GroupAttributes'; + } else if (this.getView().record instanceof Traccar.model.Server) { + this.getView().attributesStore = 'ServerAttributes'; + } else if (this.getView().record instanceof Traccar.model.User) { + this.getView().attributesStore = 'UserAttributes'; + } + }, + + comboConfig: { + xtype: 'combobox', + reference: 'nameComboField', + name: 'name', + fieldLabel: Strings.sharedName, + displayField: 'name', + valueField: 'key', + allowBlank: false, + listeners: { + change: 'onNameChange' + } + }, + + initDialog: function (record) { + var nameTextField, dialog = Ext.create('Traccar.view.dialog.Attribute'); + if (this.getView().attributesStore) { + this.comboConfig.store = this.getView().attributesStore; + nameTextField = dialog.lookupReference('nameTextField'); + dialog.down('form').insert(0, this.comboConfig); + dialog.down('form').remove(nameTextField); + } + dialog.down('form').loadRecord(record); + dialog.show(); + }, + + onAddClick: function () { + var objectInstance = Ext.create('Traccar.model.Attribute'); + objectInstance.store = this.getView().getStore(); + this.initDialog(objectInstance); + }, + + onEditClick: function () { + this.initDialog(this.getView().getSelectionModel().getSelection()[0]); } }); |