From 3e3fe7718ee69bb95908dbe474fb4b15d80d329a Mon Sep 17 00:00:00 2001
From: Grant Slater <grant.slater@wearefriday.com>
Date: Fri, 17 Jun 2016 17:45:57 +0100
Subject: [PATCH] imagery: add permalink support

---
 cookbooks/imagery/files/default/imagery.css   |  6 +++
 .../imagery/templates/default/imagery.js.erb  | 39 ++++++++++++-------
 .../imagery/templates/default/index.html.erb  |  8 ++--
 3 files changed, 35 insertions(+), 18 deletions(-)

diff --git a/cookbooks/imagery/files/default/imagery.css b/cookbooks/imagery/files/default/imagery.css
index 59fd9bb66..2a72162cb 100644
--- a/cookbooks/imagery/files/default/imagery.css
+++ b/cookbooks/imagery/files/default/imagery.css
@@ -10,3 +10,9 @@
   max-height: 700px;/*less than map height! */
   overflow: auto;
 }
+
+@media print {
+  .leaflet-control {
+    display:none
+  }
+}
diff --git a/cookbooks/imagery/templates/default/imagery.js.erb b/cookbooks/imagery/templates/default/imagery.js.erb
index a728ef60e..35168e4bb 100644
--- a/cookbooks/imagery/templates/default/imagery.js.erb
+++ b/cookbooks/imagery/templates/default/imagery.js.erb
@@ -2,37 +2,50 @@ function createMap(divName) {
   // Create a map
   var map = L.map(divName).fitBounds(<%= @bbox.to_json %>);
 
-  // Create a layer switcher
-  var layers = L.control.layers(null, null, {collapsed:false});
+  // Create layer and overlays variables
+  var leaflet_layers = {}
+  var leaflet_overlays = {}
 
   // Add OpenStreetMap layer
-  layers.addBaseLayer(L.tileLayer("http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png", {
+  leaflet_layers["OpenStreetMap"] = L.tileLayer("http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png", {
     attribution: "© <a target=\"_parent\" href=\"http://www.openstreetmap.org\">OpenStreetMap</a> and contributors, under an <a target=\"_parent\" href=\"http://www.openstreetmap.org/copyright\">open license</a>",
     maxZoom: 19
-  }), "OpenStreetMap");
+  });
 
   <% @layers.sort_by { |layer| layer[:name] }.each do |layer| -%>
-  // Create <%= layer[:name] %> layer
-  var <%= layer[:name] %> = L.tileLayer(<%= layer[:url].to_json %>, {
+
+  <% if layer[:overlay] -%>
+  // Create <%= layer[:name] %> overlay
+  var leaflet_overlays[<%= layer[:name] %>] = L.tileLayer(<%= layer[:url].to_json %>, {
     attribution: <%= layer[:attribution].to_json %>,
     maxZoom: <%= layer[:maxZoom].to_json %>
   });
 
-  // Add <%= layer[:name] %> to layer switcher
-  <% if layer[:overlay] -%>
-  layers.addOverlay(<%= layer[:name] %>, <%= layer[:title].to_json %>);
-  <% else %>
-  layers.addBaseLayer(<%= layer[:name] %>, <%= layer[:title].to_json %>);
+  <% if layer[:default] -%>
+  // Add <%= layer[:name] %> to map
+  leaflet_overlays[<%= layer[:name] %>].addTo(map);
   <% end -%>
 
+  <% else %>
+  // Create <%= layer[:name] %> layer
+  var leaflet_layers[<%= layer[:name] %>] = L.tileLayer(<%= layer[:url].to_json %>, {
+    attribution: <%= layer[:attribution].to_json %>,
+    maxZoom: <%= layer[:maxZoom].to_json %>
+  });
+
   <% if layer[:default] -%>
   // Add <%= layer[:name] %> to map
-  <%= layer[:name] %>.addTo(map);
+  leaflet_layers[<%= layer[:name] %>].addTo(map);
+  <% end -%>
+
   <% end -%>
   <% end -%>
 
+  // Create a layer switcher
+  var layers = L.control.layers(leaflet_layers, leaflet_overlays, {collapsed:false});
+
   // Add the layer switch to the mao
   layers.addTo(map);
-
+  map.addControl(new L.Control.Permalink({text: 'Permalink', layers: leaflet_layers, overlays: leaflet_overlays}));
   return map;
 }
diff --git a/cookbooks/imagery/templates/default/index.html.erb b/cookbooks/imagery/templates/default/index.html.erb
index 74b7d53d0..951abe8c8 100644
--- a/cookbooks/imagery/templates/default/index.html.erb
+++ b/cookbooks/imagery/templates/default/index.html.erb
@@ -9,12 +9,10 @@
     <link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet/v0.7.7/leaflet.ie.css" />
     <![endif]-->
     <script type="text/javascript" src="http://cdn.leafletjs.com/leaflet/v0.7.7/leaflet.js"></script>
+    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/leaflet-plugins/1.6.1/control/Permalink.min.js"></script>
+    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/leaflet-plugins/1.6.1/control/Permalink.Layer.min.js"></script>
+    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/leaflet-plugins/1.6.1/control/Permalink.Overlay.js"></script>
     <script type="text/javascript" src="imagery.js"></script>
-    <style type="text/css">
-    @media print {
-      .leaflet-control { display:none }
-    }
-    </style>
   </head>
   <body onload="createMap('map')">
     <div id="map"></div>
-- 
2.43.2