Implement long URL option, toggling, and labeling for share

app/assets/javascripts/application.js

@@ -120,6 +120,18 @@ function getShortUrl(map) {
           makeShortCode(map);
 }
 
+function getUrl(map) {
+  var center = map.getCenter(),
+      zoom = map.getZoom();
+  return (window.location.hostname.match(/^www\.openstreetmap\.org/i) ?
+          'http://openstreetmap.org/?' : '/?') +
+        querystring.stringify({
+            lat: center.lat,
+            lon: center.lng,
+            zoom: zoom
+        });
+}
+
 function minZoomAlert() {
     alert(I18n.t("javascripts.site." + name + "_zoom_alert")); return false;
 }

app/assets/javascripts/index.js

@@ -81,8 +81,10 @@ $(document).ready(function () {
   }).addTo(map);
 
   L.OSM.share({
-    getUrl: getShortUrl,
+    getShortUrl: getShortUrl,
-    sidebar: sidebar
+    getUrl: getUrl,
+    sidebar: sidebar,
+    short: true
   }).addTo(map);
 
   L.control.scale()

app/assets/javascripts/leaflet.layers.js

@@ -89,7 +89,7 @@ L.OSM.layers = function(options) {
 
       map.whenReady(function() {
         var miniMap = L.map(div[0], {attributionControl: false, zoomControl: false})
-          .addLayer(new layer.constructor);
+          .addLayer(new layer.constructor());
 
         miniMap.dragging.disable();
         miniMap.touchZoom.disable();

app/assets/javascripts/leaflet.share.js

@@ -20,9 +20,31 @@ L.OSM.share = function (options) {
       .text(I18n.t('javascripts.share.title'))
       .appendTo($ui);
 
-    var $input = $('<input>')
+    var $share_link = $('<div></div>')
       .appendTo($ui);
 
+    var $title = $('<h3></h3>')
+      .text(I18n.t('javascripts.share.link'))
+      .appendTo($share_link);
+
+    var $short_url_input = $('<input />')
+      .attr('id', 'short_url')
+      .attr('type', 'checkbox')
+      .prop('checked', 'checked')
+      .appendTo($share_link)
+      .bind('change', function() {
+          options.short = $(this).prop('checked');
+          update();
+      });
+
+    var $short_url_label = $('<label></label>')
+      .text(I18n.t('javascripts.share.short_url'))
+      .attr('for', 'short_url')
+      .appendTo($share_link);
+
+    var $input = $('<input />')
+      .appendTo($share_link);
+
     map.on('moveend layeradd layerremove', update);
 
     options.sidebar.addPane($ui);
@@ -36,7 +58,9 @@ L.OSM.share = function (options) {
     function update() {
       var center = map.getCenter().wrap();
       var layers = getMapLayers(map);
-      $input.val(options.getUrl(map));
+      $input.val(
+          options.short ? options.getShortUrl(map) : options.getUrl(map)
+      );
     }
 
     return $container[0];

config/locales/en.yml

@@ -2040,6 +2040,8 @@ en:
     share:
       title: "Share"
       cancel: "Cancel"
+      link: "Link"
+      short_url: "Short URL"
     key:
       title: "Map Key"
       tooltip: "Key for the map"