Display reverse geolocated location in location panel

(closes #2515)

css/80_app.css

@@ -2707,6 +2707,10 @@ img.tile-removing {
     position: relative;
 }
 
+.panel-content-location .location-name {
+    padding-top: 10px;
+}
+
 .panel-content-measurement .button {
     position: absolute;
     background: #7092ff;

data/core.yaml

@@ -277,7 +277,6 @@ en:
     location:
       key: L
       title: Location
-      pointer: Pointer
     measurement:
       key: M
       title: Measurement

dist/locales/en.json

@@ -352,8 +352,7 @@
             "key": "I",
             "location": {
                 "key": "L",
-                "title": "Location",
-                "pointer": "Pointer"
+                "title": "Location"
             },
             "measurement": {
                 "key": "M",

modules/ui/info/location.js

@@ -1,15 +1,21 @@
 import * as d3 from 'd3';
+import _ from 'lodash';
 import { t } from '../../util/locale';
+import { services } from '../../services';
 
 
 export function uiPanelLocation(context) {
+    var lastLocation = '';
+    var debouncedUpdate = _.debounce(updateLocation, 250);
     var OSM_PRECISION = 7;
 
+
     function wrap(x, min, max) {
         var d = max - min;
         return ((x - min) % d + d) % d + min;
     }
 
+
     function clamp(x, min, max) {
         return Math.max(min, Math.min(x, max));
     }
@@ -25,13 +31,39 @@ export function uiPanelLocation(context) {
 
         // Mouse coordinates
         var coord = context.map().mouseCoordinates();
+        if (coord.some(isNaN)) {
+            coord = context.map().center();
+        }
+
         var coordStr =
             clamp(coord[1], -90, 90).toFixed(OSM_PRECISION) + ', ' +
             wrap(coord[0], -180, 180).toFixed(OSM_PRECISION);
 
         list
             .append('li')
-            .text(t('infobox.location.pointer') + ': ' + coordStr);
+            .text(coordStr);
+
+        // Location Name
+        if (services.geocoder) {
+            selection
+                .append('p')
+                .attr('class', 'location-name')
+                .text(lastLocation);
+
+            debouncedUpdate(selection, coord);
+        }
+    }
+
+
+    function updateLocation(selection, coord) {
+        if (!services.geocoder) return;
+        services.geocoder.reverse(coord, function(err, result) {
+            if (result) {
+                lastLocation = result.display_name;
+                selection.selectAll('.location-name')
+                    .text(lastLocation);
+            }
+        });
     }