- Add other icons

- Add Category combobox

4 files changed, 56 insertions, 17 deletions

diff --git a/web/app/DeviceImages.js b/web/app/DeviceImages.js
index d781b529..87f2ca87 100644
--- a/web/app/DeviceImages.js
+++ b/web/app/DeviceImages.js
@@ -48,14 +48,14 @@ Ext.define('Traccar.DeviceImages', {
         svg.getElementById(device.get('rotateId')).setAttribute('transform', rotateTransform);
 
         // Adjust size and prepare scale transformation
-        width *= device.get('scale');
-        height *= device.get('scale');
+        width *= Traccar.Style.mapScaleNormal;
+        height *= Traccar.Style.mapScaleNormal;
         if (zoom) {
             width *= Traccar.Style.mapScaleSelected;
             height *= Traccar.Style.mapScaleSelected;
-            scaleTransform = 'scale(' + device.get('scale') * Traccar.Style.mapScaleSelected + ') ';
+            scaleTransform = 'scale(' + Traccar.Style.mapScaleSelected + ') ';
         } else {
-            scaleTransform = 'scale(' + device.get('scale') + ') ';
+            scaleTransform = 'scale(' + Traccar.Style.mapScaleNormal + ') ';
         }
 
         if (device.get('scaleId') !== device.get('rotateId')) {
diff --git a/web/app/Style.js b/web/app/Style.js
index 4fe5afd7..b19584f0 100644
--- a/web/app/Style.js
+++ b/web/app/Style.js
@@ -59,6 +59,7 @@ Ext.define('Traccar.Style', {
     mapColorUnknown: 'rgba(250, 190, 77, 1.0)',
     mapColorOffline: 'rgba(255, 84, 104, 1.0)',
 
+    mapScaleNormal: 1,
     mapScaleSelected: 1.5,
 
     mapMaxZoom: 19,
diff --git a/web/app/store/DeviceImages.js b/web/app/store/DeviceImages.js
index ba91575a..64a78556 100644
--- a/web/app/store/DeviceImages.js
+++ b/web/app/store/DeviceImages.js
@@ -21,43 +21,73 @@ Ext.define('Traccar.store.DeviceImages', {
 
     data: [{
         key: 'route',
-        name: Strings.categoryDefault,
+        name: Strings.categoryRoute,
         svg: document.getElementById('routeSvg').contentDocument,
         fillId: 'arrow',
         rotateId: 'arrow',
-        scaleId: 'arrow',
-        scale: 1
+        scaleId: 'arrow'
     }, {
         key: 'default',
         name: Strings.categoryDefault,
         svg: document.getElementById('defaultSvg').contentDocument,
-        fillId: ['arrow', 'path4148'],
-        rotateId: 'layer2',
-        scaleId: 'layer2',
-        scale: 1
+        fillId: ['path4148', 'path4149'],
+        rotateId: 'path4148',
+        scaleId: 'layer2'
     }, {
         key: 'car',
         name: Strings.categoryCar,
         svg: document.getElementById('carSvg').contentDocument,
         fillId: ['path4148', 'path4157'],
         rotateId: 'path4148',
-        scaleId: 'layer2',
-        scale: 1
+        scaleId: 'layer2'
     }, {
         key: 'bus',
         name: Strings.categoryBus,
         svg: document.getElementById('busSvg').contentDocument,
         fillId: ['path4148', 'path4200'],
         rotateId: 'path4148',
-        scaleId: 'layer2',
-        scale: 1
+        scaleId: 'layer2'
     }, {
         key: 'truck',
         name: Strings.categoryTruck,
         svg: document.getElementById('truckSvg').contentDocument,
         fillId: ['path4148', 'path4336'],
         rotateId: 'path4148',
-        scaleId: 'layer2',
-        scale: 1
+        scaleId: 'layer2'
+    }, {
+        key: 'ship',
+        name: Strings.categoryShip,
+        svg: document.getElementById('shipSvg').contentDocument,
+        fillId: ['path4148', 'path4177'],
+        rotateId: 'path4148',
+        scaleId: 'layer2'
+    }, {
+        key: 'plane',
+        name: Strings.categoryPlane,
+        svg: document.getElementById('planeSvg').contentDocument,
+        fillId: ['path4148', 'path4203'],
+        rotateId: 'path4148',
+        scaleId: 'layer2'
+    }, {
+        key: 'motorcycle',
+        name: Strings.categoryMotorcycle,
+        svg: document.getElementById('motorcycleSvg').contentDocument,
+        fillId: ['path4148', 'path4256'],
+        rotateId: 'path4148',
+        scaleId: 'layer2'
+    }, {
+        key: 'bicycle',
+        name: Strings.categoryBicycle,
+        svg: document.getElementById('bicycleSvg').contentDocument,
+        fillId: ['path4148', 'path4282'],
+        rotateId: 'path4148',
+        scaleId: 'layer2'
+    }, {
+        key: 'person',
+        name: Strings.categoryPerson,
+        svg: document.getElementById('personSvg').contentDocument,
+        fillId: ['path4148', 'path4308'],
+        rotateId: 'path4148',
+        scaleId: 'layer2'
     }]
 });
\ No newline at end of file
diff --git a/web/app/view/DeviceDialog.js b/web/app/view/DeviceDialog.js
index 68740b24..dea50749 100644
--- a/web/app/view/DeviceDialog.js
+++ b/web/app/view/DeviceDialog.js
@@ -57,6 +57,14 @@ Ext.define('Traccar.view.DeviceDialog', {
             xtype: 'textfield',
             name: 'contact',
             fieldLabel: Strings.deviceContact
+        }, {
+            xtype: 'combobox',
+            name: 'category',
+            fieldLabel: Strings.deviceCategory,
+            store: 'DeviceImages',
+            queryMode: 'local',
+            displayField: 'name',
+            valueField: 'key',
         }]
     }
 });