From 312c4ed725760674866db8d2e9cfb2215ea0f691 Mon Sep 17 00:00:00 2001
From: Ben Goldsworthy <admin@bengoldsworthy.net>
Date: Thu, 20 Feb 2025 01:23:36 +0100
Subject: [PATCH] fix: map in locations view

---
 layouts/locations/list.html                   | 52 +++++++------
 layouts/partials/cv/locations/heatmap.js      | 73 ++++++++++---------
 .../leaflet-fullscreen/leaflet.fullscreen.css |  0
 3 files changed, 68 insertions(+), 57 deletions(-)
 rename static/{css => js}/leaflet-fullscreen/leaflet.fullscreen.css (100%)

diff --git a/layouts/locations/list.html b/layouts/locations/list.html
index 7bb3625..fc5d1ec 100644
--- a/layouts/locations/list.html
+++ b/layouts/locations/list.html
@@ -1,45 +1,53 @@
 {{ define "title" }}
-  Locations | {{ .Site.Title }}
+  Locations |
+  {{ .Site.Title }}
 {{ end }}
 
 {{ define "main-class" }}--section location-map{{ end }}
 
 {{ define "header-scripts" }}
-    <!-- Leaflet -->
-    <link rel="stylesheet" href="/css/leaflet/leaflet.css" />
-    <link rel="stylesheet" href="/js/leaflet-fullscreen/leaflet.fullscreen.css" />
+  <!-- Leaflet -->
+  <link
+    rel="stylesheet"
+    href="/css/leaflet/leaflet.css"
+  />
+  <link
+    rel="stylesheet"
+    href="/js/leaflet-fullscreen/leaflet.fullscreen.css"
+  />
 {{ end }}
 
 {{ define "footer-scripts" }}
-    <!-- Leaflet -->
-    <script src="/js/leaflet/leaflet.js"></script>
+  <!-- Leaflet -->
+  <script src="/js/leaflet/leaflet.js"></script>
 
-    <!-- Leaflet Heat -->
-    <script src="/js/leaflet-heat/leaflet-heat.js"></script>
+  <!-- Leaflet Heat -->
+  <script src="/js/leaflet-heat/leaflet-heat.js"></script>
 
-    <!-- Leaflet Fullscreen -->
-    <script src="/js/leaflet-fullscreen/leaflet.fullscreen.min.js"></script>
+  <!-- Leaflet Fullscreen -->
+  <script src="/js/leaflet-fullscreen/leaflet.fullscreen.min.js"></script>
 
-    <script>
-        {{- partial "cv/locations/heatmap.js" ( dict "all_pages" $.Site.AllPages ) -}}
-    </script>
+  {{- partial "cv/locations/heatmap.js" ( dict "all_pages" $.Site.AllPages "locations" $.Site.Data.locations ) -}}
 {{ end }}
 
 {{ define "main-header" }}
-    <header class="site-content__header">
-        <h1 class="page-title">{{ .Title | safeHTML }}.</h1>
-        {{ .Content }}
-    </header>
+  <header class="site-content__header">
+    <h1 class="page-title">{{ .Title | safeHTML }}.</h1>
+    {{ .Content }}
+  </header>
 {{ end }}
 
 {{ define "main-body" }}
-<article class="site-content__body site-content__body--chart">
-    <div id="map" style="width: 100%; height: 500px; margin: 0; display: block;"></div>
+  <article class="site-content__body site-content__body--chart">
+    <div
+      id="map"
+      style="width: 100%; height: 500px; margin: 0; display: block;"
+    ></div>
 
     {{- with ( partial "util/render_recursive_list.html" ( dict "sc" $ "pc" . "items" $.Site.Data.locations "schemaType" "Place" ) ) -}}
-    <section style="grid-area: section-content">
+      <section style="grid-area: section-content">
         {{- . -}}
-    </section>
+      </section>
     {{- end -}}
-</article>
+  </article>
 {{ end }}
diff --git a/layouts/partials/cv/locations/heatmap.js b/layouts/partials/cv/locations/heatmap.js
index 1465b5a..6427bdb 100644
--- a/layouts/partials/cv/locations/heatmap.js
+++ b/layouts/partials/cv/locations/heatmap.js
@@ -1,47 +1,50 @@
-/*
+{{/*
     Recursively render an ordered or unordered list from a set of arbitrarily-
     deeply-nested items.
 
     @params all_pages  All site pages
-*/
-
-var map = L.map('map', {
-    fullscreenControl: true
-}).setView([55, -3], 3);
-
-L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
-    maxZoom: 19,
-    attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a>'
-}).addTo(map);
-
-{{- $locations := partialCached "util/get_location_leaf_nodes.html" $.Site.Data.locations -}}
-
-{{/*
-{{- range .Site.AllPages -}}
-    {{- with .Params.locations -}}
-        {{- range . -}}
-            {{- with ( index $locations ( replaceRE `, [A-Z]+` "" . ) ) -}}
-                L.marker([{{ .lat }}, {{ .lon }}]).addTo(map);
-        {{- end -}}
-        {{- end -}}
-    {{- end -}}
-{{- end -}}
+    @params locations   All locations
 */}}
 
-L.heatLayer(
-    [
-    {{- range .all_pages -}}
+<script>
+    var map = L.map('map', {
+        fullscreenControl: true
+    }).setView([55, -3], 3);
+
+    L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
+        maxZoom: 19,
+        attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a>'
+    }).addTo(map);
+
+    {{- $locations := partialCached "util/get_location_leaf_nodes.html" .locations -}}
+
+    {{/*
+    {{- range .Site.AllPages -}}
         {{- with .Params.locations -}}
             {{- range . -}}
                 {{- with ( index $locations ( replaceRE `, [A-Z]+` "" . ) ) -}}
-                    [ {{ .lat }}, {{ .lon }} ],
-                {{- end -}}
+                    L.marker([{{ .lat }}, {{ .lon }}]).addTo(map);
+            {{- end -}}
             {{- end -}}
         {{- end -}}
     {{- end -}}
-    ],
-    {
-        minOpacity: 0.5,
-        gradient: {0.1: 'blue', 0.3: 'lime', 0.8: 'orange', 1: 'red'}
-    }
-).addTo(map);
+    */}}
+
+    L.heatLayer(
+        [
+        {{- range .all_pages -}}
+            {{- with .Params.locations -}}
+                {{- range . -}}
+                    {{- with ( index $locations ( replaceRE `, [A-Z]+` "" . ) ) -}}
+                        [ {{ .lat }}, {{ .lon }} ],
+                    {{- end -}}
+                {{- end -}}
+            {{- end -}}
+        {{- end -}}
+        ],
+        {
+            minOpacity: 0.5,
+            gradient: {0.1: 'blue', 0.3: 'lime', 0.8: 'orange', 1: 'red'}
+        }
+    ).addTo(map);
+</script>
diff --git a/static/css/leaflet-fullscreen/leaflet.fullscreen.css b/static/js/leaflet-fullscreen/leaflet.fullscreen.css
similarity index 100%
rename from static/css/leaflet-fullscreen/leaflet.fullscreen.css
rename to static/js/leaflet-fullscreen/leaflet.fullscreen.css