Include layers in hash

app/assets/javascripts/application.js

@@ -4,6 +4,7 @@
 //= require jquery.cookie
 //= require jquery.throttle-debounce
 //= require augment
+//= require osm
 //= require leaflet
 //= require leaflet.osm
 //= require leaflet.hash
@@ -12,7 +13,6 @@
 //= require leaflet.locationfilter
 //= require i18n/translations
 //= require oauth
-//= require osm
 //= require piwik
 //= require map
 //= require menu
@@ -61,17 +61,27 @@ function remoteEditHandler(bbox, select) {
  */
 function updatelinks(loc, zoom, layers, bounds, object) {
   $(".geolink").each(function(index, link) {
-    var base = link.href.split('?')[0],
+    var href = link.href.split(/[?#]/)[0],
         args = querystring.parse(link.search.substring(1));
 
     if (bounds && $(link).hasClass("bbox")) args.bbox = normalBounds(bounds).toBBoxString();
-    if (layers && $(link).hasClass("layers")) args.layers = layers;
     if (object && $(link).hasClass("object")) args[object.type] = object.id;
 
-    var href = base + '?' + querystring.stringify(args);
+    var query = querystring.stringify(args);
+    if (query) href += '?' + query;
 
     if ($(link).hasClass("llz")) {
-      href += OSM.formatHash({lat: loc.lat, lon: loc.lon || loc.lng, zoom: zoom});
+      args = {
+        lat: loc.lat,
+        lon: loc.lon || loc.lng,
+        zoom: zoom
+      };
+
+      if (layers && $(link).hasClass("layers")) {
+        args.layers = layers;
+      }
+
+      href += OSM.formatHash(args);
     }
 
     link.href = href;

app/assets/javascripts/index.js

@@ -19,7 +19,7 @@ $(document).ready(function () {
 
   map.attributionControl.setPrefix('');
 
-  new L.Hash(map);
+  map.hash = L.hash(map);
 
   var layers = [
     new L.OSM.Mapnik({
@@ -50,8 +50,11 @@ $(document).ready(function () {
 
   layers[0].addTo(map);
 
-  map.noteLayer = new L.LayerGroup({code: 'N'});
+  map.noteLayer = new L.LayerGroup();
+  map.noteLayer.options = {code: 'N'};
+
   map.dataLayer = new L.OSM.DataLayer(null);
+  map.dataLayer.options.code = 'D';
 
   $("#sidebar").on("opened closed", function () {
     map.invalidateSize();
@@ -161,8 +164,8 @@ $(document).ready(function () {
   }
 
   initializeExport(map);
-  initializeBrowse(map);
+  initializeBrowse(map, params);
-  initializeNotes(map);
+  initializeNotes(map, params);
 });
 
 function updateLocation() {
@@ -174,6 +177,9 @@ function updateLocation() {
   var expiry = new Date();
   expiry.setYear(expiry.getFullYear() + 10);
   $.cookie("_osm_location", cookieContent(this), { expires: expiry });
+
+  // Trigger hash update on layer changes.
+  this.hash.onMapMove();
 }
 
 function setPositionLink(map) {

app/assets/javascripts/index/browse.js

@@ -2,7 +2,7 @@
 //= require templates/browse/feature_list
 //= require templates/browse/feature_history
 
-function initializeBrowse(map) {
+function initializeBrowse(map, params) {
   var browseBounds;
   var layersById;
   var selectedLayer;
@@ -49,6 +49,12 @@ function initializeBrowse(map) {
     }
   });
 
+  if (OSM.STATUS != 'api_offline' && OSM.STATUS != 'database_offline') {
+    if (params.layers.indexOf(dataLayer.options.code) >= 0) {
+      map.addLayer(dataLayer);
+    }
+  }
+
   function startBrowse(sidebarHtml) {
     locationFilter = new L.LocationFilter({
       enableButton: false,

app/assets/javascripts/index/notes.js.erb

@@ -1,9 +1,8 @@
 //= require templates/notes/show
 //= require templates/notes/new
 
-function initializeNotes(map) {
+function initializeNotes(map, params) {
-  var params = OSM.mapParams(),
+  var noteLayer = map.noteLayer,
-      noteLayer = map.noteLayer,
       notes = {},
       newNote;
 
@@ -50,7 +49,7 @@ function initializeNotes(map) {
   });
 
   if (OSM.STATUS != 'api_offline' && OSM.STATUS != 'database_offline') {
-    if (params.notes || (params.layers && params.layers.indexOf('N')) >= 0) {
+    if (params.layers.indexOf(noteLayer.options.code) >= 0) {
       map.addLayer(noteLayer);
     }
 

app/assets/javascripts/leaflet.extend.js.erb

@@ -30,15 +30,21 @@ L.extend(L.Map.prototype, {
 
   getUrl: function(marker) {
     var precision = zoomPrecision(this.getZoom()),
-        params = { layers: this.getLayersCode() };
+        params = {};
 
     if (marker && this.hasLayer(marker)) {
       params.mlat = marker.getLatLng().lat.toFixed(precision);
       params.mlon = marker.getLatLng().lng.toFixed(precision);
     }
 
-    return 'http://' + OSM.SERVER_URL + '/?' + querystring.stringify(params) +
+    var url = 'http://' + OSM.SERVER_URL + '/',
-      OSM.formatHash({lat: this.getCenter().lat, lon: this.getCenter().lng, zoom: this.getZoom()});
+      query = querystring.stringify(params),
+      hash = OSM.formatHash(this);
+
+    if (query) url += '?' + query;
+    if (hash) url += hash;
+
+    return url;
   },
 
   getShortUrl: function(marker) {
@@ -87,3 +93,6 @@ L.extend(L.Map.prototype, {
 });
 
 L.Icon.Default.imagePath = <%= "#{asset_prefix}/images".to_json %>;
+
+L.Hash.prototype.parseHash = OSM.parseHash;
+L.Hash.prototype.formatHash = OSM.formatHash;

app/assets/javascripts/osm.js.erb

@@ -41,10 +41,6 @@ OSM = {
       mapParams.mlat = parseFloat(params.mlat);
     }
 
-    if (params.layers) {
-      mapParams.layers = params.layers;
-    }
-
     if (params.node || params.way || params.relation) {
       mapParams.object_zoom = true;
 
@@ -76,9 +72,10 @@ OSM = {
       mapParams.box = bounds;
     }
 
+    var hash = OSM.parseHash(location.hash);
+
     // Decide on a map starting position. Various ways of doing this.
-    var hash = L.Hash.parseHash(location.hash);
+    if (hash.lat && hash.lon) {
-    if (hash) {
       mapParams.lon = hash.center.lng;
       mapParams.lat = hash.center.lat;
       mapParams.zoom = hash.zoom;
@@ -101,7 +98,6 @@ OSM = {
       mapParams.lon = parseFloat(loc[0]);
       mapParams.lat = parseFloat(loc[1]);
       mapParams.zoom = parseInt(loc[2]);
-      mapParams.layers = loc[3];
     } else if (OSM.home) {
       mapParams.lon = OSM.home.lon;
       mapParams.lat = OSM.home.lat;
@@ -118,7 +114,7 @@ OSM = {
       mapParams.zoom = parseInt(params.zoom || 5);
     }
 
-    mapParams.notes = params.notes == "yes";
+    mapParams.layers = hash.layers || (loc && loc[3]) || '';
 
     if (params.note) {
       mapParams.note = parseInt(params.note);
@@ -132,10 +128,39 @@ OSM = {
     return mapParams;
   },
 
+  parseHash: function(hash) {
+    if (hash.indexOf('#') === 0) {
+      hash = hash.substr(1);
+    }
+    hash = querystring.parse(hash);
+    var args = L.Hash.parseHash(hash.map || '') || {};
+    if (hash.layers) args.layers = hash.layers;
+    return args;
+  },
+
   formatHash: function(args) {
-    var precision = zoomPrecision(args.zoom);
+    if (args instanceof L.Map) {
-    return '#' + args.zoom +
+      args = {
+        lat: args.getCenter().lat,
+        lon: args.getCenter().lng,
+        zoom: args.getZoom(),
+        layers: args.getLayersCode()
+      };
+    }
+
+    var precision = zoomPrecision(args.zoom),
+      hash = '#map=' + args.zoom +
         '/' + args.lat.toFixed(precision) +
         '/' + args.lon.toFixed(precision);
+
+    if (args.layers) {
+      args.layers = args.layers.replace('M', '');
+    }
+
+    if (args.layers) {
+      hash += '&layers=' + args.layers;
+    }
+
+    return hash;
   }
 };

app/controllers/site_controller.rb

@@ -8,9 +8,20 @@ class SiteController < ApplicationController
   before_filter :require_oauth, :only => [:index]
 
   def index
+    anchor = []
+
     if params[:lat] && params[:lon]
-      params[:anchor] = "#{params.delete(:zoom) || 5}/#{params.delete(:lat)}/#{params.delete(:lon)}"
+      anchor << "map=#{params.delete(:zoom) || 5}/#{params.delete(:lat)}/#{params.delete(:lon)}"
-      redirect_to params
+    end
+
+    if params[:layers]
+      anchor << "layers=#{params.delete(:layers)}"
+    elsif params.delete(:notes) == 'yes'
+      anchor << "layers=N"
+    end
+
+    if anchor.present?
+      redirect_to params.merge(:anchor => anchor.join('&'))
       return
     end
 

test/functional/site_controller_test.rb

@@ -75,10 +75,19 @@ class SiteControllerTest < ActionController::TestCase
 
   def test_index_redirect
     get :index, :lat => 4, :lon => 5
-    assert_redirected_to :controller => :site, :action => 'index', :anchor => '5/4/5'
+    assert_redirected_to :controller => :site, :action => 'index', :anchor => 'map=5/4/5'
 
     get :index, :lat => 4, :lon => 5, :zoom => 3
-    assert_redirected_to :controller => :site, :action => 'index', :anchor => '3/4/5'
+    assert_redirected_to :controller => :site, :action => 'index', :anchor => 'map=3/4/5'
+
+    get :index, :layers => 'T'
+    assert_redirected_to :controller => :site, :action => 'index', :anchor => 'layers=T'
+
+    get :index, :notes => 'yes'
+    assert_redirected_to :controller => :site, :action => 'index', :anchor => 'layers=N'
+
+    get :index, :lat => 4, :lon => 5, :zoom => 3, :layers => 'T'
+    assert_redirected_to :controller => :site, :action => 'index', :anchor => 'map=3/4/5&layers=T'
   end
 
   def test_permalink