Add L as the keyboard shortcut for geolocation (close #7395)

data/core.yaml

@@ -535,6 +535,7 @@ en:
     search: Search worldwide...
     no_results_worldwide: No results found
   geolocate:
+    key: L
     title: Show My Location
     locating: "Locating, please wait..."
   inspector:
@@ -1974,6 +1975,7 @@ en:
         pan_more: "Pan map by one screenful"
         zoom: "Zoom in / Zoom out"
         zoom_more: "Zoom in / Zoom out by a lot"
+        geolocate: "Zoom to my location"
       help:
         title: "Help"
         help: "Show help/documentation"

data/shortcuts.json

@@ -31,6 +31,10 @@
             "text": "shortcuts.browsing.navigation.zoom_more",
             "separator": ","
           },
+          {
+            "shortcuts": ["geolocate.key"],
+            "text": "shortcuts.browsing.navigation.geolocate"
+          },
           {
             "section": "display_options",
             "text": "shortcuts.browsing.display_options.title"

dist/locales/en.json

@@ -678,6 +678,7 @@
             "no_results_worldwide": "No results found"
         },
         "geolocate": {
+            "key": "L",
             "title": "Show My Location",
             "locating": "Locating, please wait..."
         },
@@ -2430,7 +2431,8 @@
                     "pan": "Pan map",
                     "pan_more": "Pan map by one screenful",
                     "zoom": "Zoom in / Zoom out",
-                    "zoom_more": "Zoom in / Zoom out by a lot"
+                    "zoom_more": "Zoom in / Zoom out by a lot",
+                    "geolocate": "Zoom to my location"
                 },
                 "help": {
                     "title": "Help",

modules/ui/geolocate.js

@@ -4,7 +4,7 @@ import { geoExtent } from '../geo';
 import { modeBrowse } from '../modes/browse';
 import { svgIcon } from '../svg/icon';
 import { uiLoading } from './loading';
-
+import { uiTooltipHtml } from './tooltipHtml';
 
 export function uiGeolocate(context) {
     var geoOptions = { enableHighAccuracy: false, timeout: 6000 /* 6sec */ };
@@ -14,7 +14,6 @@ export function uiGeolocate(context) {
     var _extent;
     var _timeoutID;
 
-
     function click() {
         if (context.inIntro()) return;
         context.enter(modeBrowse(context));
@@ -39,7 +38,6 @@ export function uiGeolocate(context) {
         map.centerZoomEase(_extent.center(), Math.min(20, map.extentZoom(_extent)));
     }
 
-
     function success(geolocation) {
         _position = geolocation;
         var coords = _position.coords;
@@ -48,28 +46,29 @@ export function uiGeolocate(context) {
         finish();
     }
 
-
     function error() {
         finish();
     }
 
-
     function finish() {
         locating.close();  // unblock ui
         if (_timeoutID) { clearTimeout(_timeoutID); }
         _timeoutID = undefined;
     }
 
-
     return function(selection) {
         if (!navigator.geolocation) return;
 
         selection
             .append('button')
-            .attr('title', t('geolocate.title'))
             .on('click', click)
             .call(svgIcon('#iD-icon-geolocate', 'light'))
             .call(tooltip()
-                .placement((textDirection === 'rtl') ? 'right' : 'left'));
+                .placement((textDirection === 'rtl') ? 'right' : 'left')
+                .html(true)
+                .title(uiTooltipHtml(t('geolocate.title'), t('geolocate.key')))
+            );
+
+        context.keybinding().on(t('geolocate.key'), click);
     };
 }