feature: localize of zoom, geoposition, about and home control

src/controls/about.js

@@ -5,11 +5,16 @@ const About = function About(options = {}) {
     buttonText,
     target
   } = options;
+  const localization = options.localization;
+
+  function localize(key) {
+    return localization.getStringByKeys({ targetParentKey: 'about', targetKey: key });
+  }
   const {
     content = '<p></p>',
     icon = '#ic_help_outline_24px',
     placement = ['menu'],
-    title = 'Om kartan',
+    title = localize('title'),
     style
   } = options;
 

src/controls/geoposition.js

@@ -21,6 +21,11 @@ const Geoposition = function Geoposition(options = {}) {
   let positionButton;
   let markerOverlay;
   let geolocation;
+  const localization = options.localization;
+
+  function localize(key) {
+    return localization.getStringByKeys({ targetParentKey: 'geoposition', targetKey: key });
+  }
 
   const centerPosition = () => {
     if (geolocation.getTracking()) {
@@ -137,7 +142,7 @@ const Geoposition = function Geoposition(options = {}) {
           toggleState();
         },
         icon: geolocationIcon,
-        tooltipText: 'Visa din nuvarande position i kartan',
+        tooltipText: localize('positionButtonTooltip'),
         tooltipPlacement: 'east',
         methods: {
           active: onActive,

src/controls/home.js

@@ -11,6 +11,11 @@ const Home = function Home(options = {}) {
 
   let viewer;
   let homeButton;
+  const localization = options.localization;
+
+  function localize(key) {
+    return localization.getStringByKeys({ targetParentKey: 'home', targetKey: key });
+  }
 
   const zoomToHome = function zoomToHome() {
     viewer.getMap().getView().fit(extent, { duration: 1000 });
@@ -37,7 +42,7 @@ const Home = function Home(options = {}) {
           zoomToHome();
         },
         icon: '#ic_home_24px',
-        tooltipText: 'Zooma till hela kartan',
+        tooltipText: localize('zoomHomeButtonTooltip'),
         tooltipPlacement: 'east'
       });
     },

src/controls/zoom.js

@@ -10,6 +10,11 @@ const Zoom = function Zoom(options = {}) {
   let viewer;
   let zoomIn;
   let zoomOut;
+  const localization = options.localization;
+
+  function localize(key) {
+    return localization.getStringByKeys({ targetParentKey: 'zoom', targetKey: key });
+  }
 
   const zoomByDelta = function zoomByDelta(deltaValue) {
     const map = viewer.getMap();
@@ -43,7 +48,7 @@ const Zoom = function Zoom(options = {}) {
           zoomByDelta(delta);
         },
         icon: '#ic_add_24px',
-        tooltipText: 'Zooma in i kartan',
+        tooltipText: localize('zoomInButtonTooltip'),
         tooltipPlacement: 'east'
       });
       zoomOut = Button({
@@ -52,7 +57,7 @@ const Zoom = function Zoom(options = {}) {
           zoomByDelta(-delta);
         },
         icon: '#ic_remove_24px',
-        tooltipText: 'Zooma ut i kartan',
+        tooltipText: localize('zoomOutButtonTooltip'),
         tooltipPlacement: 'east'
       });
     },

src/loc/en_US.json

@@ -105,7 +105,21 @@
             "drawSquare": "Square",
             "drawCircle": "Circle",
             "drawFreehand": "Freehand"
+        },
+        "zoom": {
+            "zoomInButtonTooltip": "Zoom into the map",
+            "zoomOutButtonTooltip": "Zoom out in the map"
+        },
+        "home": {
+            "zoomHomeButtonTooltip": "Zoom to the entire map"
+        },
+        "geoposition": {
+            "positionButtonTooltip": "Show your current position on the map"
+        },
+        "about": {
+            "title": "About the map"
         }
+
     },
     "style": {
         "drawStyles": {

src/loc/sv_SE.json

@@ -105,8 +105,20 @@
             "drawSquare": "Fyrkant",
             "drawCircle": "Cirkel",
             "drawFreehand": "Frihand"
+        },
+        "zoom": {
+            "zoomInButtonTooltip": "Zooma in i kartan",
+            "zoomOutButtonTooltip": "Zooma ut i kartan"
+        },
+        "home": {
+            "zoomHomeButtonTooltip": "Zooma till hela kartan"
+        },
+        "geoposition": {
+            "positionButtonTooltip": "Visa din nuvarande position i kartan"
+        },
+        "about": {
+            "title": "Om kartan"
         }
-
     },
     "style": {
         "drawStyles": {