Add new categories (fix #495)

2 files changed, 16 insertions, 79 deletions

diff --git a/web/app/store/DeviceImages.js b/web/app/store/DeviceImages.js
index c1a8201d..6f8e8cfd 100644
--- a/web/app/store/DeviceImages.js
+++ b/web/app/store/DeviceImages.js
@@ -19,82 +19,19 @@ Ext.define('Traccar.store.DeviceImages', {
     extend: 'Ext.data.Store',
     fields: ['key', 'name', 'svg', 'fillId', 'rotateId', 'scaleId'],
 
-    data: [{
-        key: 'arrow',
-        name: Strings.categoryArrow,
-        svg: document.getElementById('arrowSvg').contentDocument,
-        fillId: 'arrow',
-        rotateId: 'arrow',
-        scaleId: 'arrow'
-    }, {
-        key: 'default',
-        name: Strings.categoryDefault,
-        svg: document.getElementById('defaultSvg').contentDocument,
-        fillId: 'background',
-        rotateId: 'background',
-        scaleId: 'layer1'
-    }, {
-        key: 'car',
-        name: Strings.categoryCar,
-        svg: document.getElementById('carSvg').contentDocument,
-        fillId: 'background',
-        rotateId: 'background',
-        scaleId: 'layer1'
-    }, {
-        key: 'bus',
-        name: Strings.categoryBus,
-        svg: document.getElementById('busSvg').contentDocument,
-        fillId: 'background',
-        rotateId: 'background',
-        scaleId: 'layer1'
-    }, {
-        key: 'truck',
-        name: Strings.categoryTruck,
-        svg: document.getElementById('truckSvg').contentDocument,
-        fillId: 'background',
-        rotateId: 'background',
-        scaleId: 'layer1'
-    }, {
-        key: 'ship',
-        name: Strings.categoryShip,
-        svg: document.getElementById('shipSvg').contentDocument,
-        fillId: 'background',
-        rotateId: 'background',
-        scaleId: 'layer1'
-    }, {
-        key: 'plane',
-        name: Strings.categoryPlane,
-        svg: document.getElementById('planeSvg').contentDocument,
-        fillId: 'background',
-        rotateId: 'background',
-        scaleId: 'layer1'
-    }, {
-        key: 'motorcycle',
-        name: Strings.categoryMotorcycle,
-        svg: document.getElementById('motorcycleSvg').contentDocument,
-        fillId: 'background',
-        rotateId: 'background',
-        scaleId: 'layer1'
-    }, {
-        key: 'bicycle',
-        name: Strings.categoryBicycle,
-        svg: document.getElementById('bicycleSvg').contentDocument,
-        fillId: 'background',
-        rotateId: 'background',
-        scaleId: 'layer1'
-    }, {
-        key: 'person',
-        name: Strings.categoryPerson,
-        svg: document.getElementById('personSvg').contentDocument,
-        fillId: 'background',
-        rotateId: 'background',
-        scaleId: 'layer1'
-    }, {
-        key: 'animal',
-        name: Strings.categoryAnimal,
-        svg: document.getElementById('animalSvg').contentDocument,
-        fillId: 'background',
-        rotateId: 'background',
-        scaleId: 'layer1'
-    }]
+    data: (function () {
+        var i, key, data = [];
+        for (i = 0; i < window.Images.length; i++) {
+            key = window.Images[i];
+            data.push({
+                key: key,
+                name: Strings['category' + key.charAt(0).toUpperCase() + key.slice(1)],
+                svg: document.getElementById(key + 'Svg').contentDocument,
+                fillId: key === 'arrow' ? 'arrow' : 'background',
+                rotateId: key === 'arrow' ? 'arrow' : 'background',
+                scaleId: key === 'arrow' ? 'arrow' : 'layer1'
+            });
+        }
+        return data;
+    })()
 });
diff --git a/web/app/view/dialog/Device.js b/web/app/view/dialog/Device.js
index bd4a1286..054931c5 100644
--- a/web/app/view/dialog/Device.js
+++ b/web/app/view/dialog/Device.js
@@ -75,7 +75,7 @@ Ext.define('Traccar.view.dialog.Device', {
                         return '<table><tr valign="middle" ><td><div align="center" style="width:40px;height:40px;" >' +
                         '{[new XMLSerializer().serializeToString(Traccar.DeviceImages.getImageSvg(' +
                         'Traccar.Style.mapColorOnline, false, 0, values.key))]}</div></td>' +
-                        '<td>- {name}</td></tr></table>';
+                        '<td>{name}</td></tr></table>';
                     }
                 }
             }]