From 3cda48aadae9033f6041e19bbaca4f02ff777d56 Mon Sep 17 00:00:00 2001
From: SayaAndy <saya.andy@posteo.com>
Date: Sun, 31 Aug 2025 11:28:05 +0700
Subject: refactor: move embeds right into general page

---
 static/input.css                |  5 +++
 views/layouts/general-page.html | 66 +++++++++++++++++++++++++++++++++-
 views/pages/blog-catalogue.html |  3 --
 views/pages/blog-page.html      | 78 -----------------------------------------
 4 files changed, 70 insertions(+), 82 deletions(-)

diff --git a/static/input.css b/static/input.css
index 47e7d16..a64c59d 100644
--- a/static/input.css
+++ b/static/input.css
@@ -472,6 +472,11 @@ body:has(.lg-container:not([class~="lg-inline"])) #sidebar {
     }
 }
 
+.map-container .leaflet-container {
+    width: 100% !important;
+    height: 100% !important;
+}
+
 body[data-theme~="night"] .leaflet-tile,
 body[data-theme~="ram"] .leaflet-tile {
     filter: invert(1) hue-rotate(190deg) contrast(1.1) brightness(1.2) !important;
diff --git a/views/layouts/general-page.html b/views/layouts/general-page.html
index 0b020c6..675b6e9 100644
--- a/views/layouts/general-page.html
+++ b/views/layouts/general-page.html
@@ -9,6 +9,12 @@
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
     <link href="https://fonts.googleapis.com/css2?family=Spectral:ital,wght@0,200;0,300;0,400;0,500;0,600;0,700;0,800;1,200;1,300;1,400;1,500;1,600;1,700;1,800&family=Patua+One&display=swap" rel="stylesheet">
     {{ block "top-embeds" . }}{{ end }}
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/css/lightgallery.min.css">
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/css/lg-zoom.min.css">
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/css/lg-thumbnail.min.css">
+    {{- if .MapLocationX }}
+    <link rel="stylesheet" href="https://f003.backblazeb2.com/file/sayana-static/libs/leaflet/1.9.4/leaflet.css">
+    {{- end }}
     <link href="/output.css" rel="stylesheet">
 </head>
 
@@ -140,6 +146,10 @@
         switchTheme(savedTheme);
     </script>
 
+    <script>
+        const galleryMap = new Map();
+    </script>
+
     <script>
         const clientTimeZone = Intl.DateTimeFormat().resolvedOptions().timeZone;
     </script>
@@ -200,6 +210,9 @@
     </div>
 
     <script src="https://f003.backblazeb2.com/file/sayana-static/libs/htmx/2.0.6/htmx.min.js"></script>
+    <script src="https://f003.backblazeb2.com/file/sayana-static/libs/lightgallery/2.8.3/lightgallery.min.js"></script>
+    <script src="https://f003.backblazeb2.com/file/sayana-static/libs/lightgallery/2.8.3/plugins/lg-zoom.min.js"></script>
+    <script src="https://f003.backblazeb2.com/file/sayana-static/libs/lightgallery/2.8.3/plugins/lg-thumbnail.min.js"></script>
 
     <script>
         const themeWheel = document.getElementById('theme-wheel');
@@ -320,7 +333,58 @@
         });
     </script>
 
-    {{ block "bottom-embeds" . }}{{ end }}
+    {{- if .MapLocationX }}
+    <script src="https://f003.backblazeb2.com/file/sayana-static/libs/leaflet/1.9.4/leaflet.js"></script>
+
+    <script>
+        var map;
+
+        function initLocationMap(id, x, y, relativeErrorMeters = 0) {
+            map = L.map(id).setView([x, y], 8);
+
+            L.tileLayer('https://tile.openstreetmap.org/{z}/{x}/{y}.png', {
+                maxZoom: 18,
+                attribution: '&copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>'
+            }).addTo(map);
+
+            if (relativeErrorMeters != 0) {
+                var circle = L.circle([x, y], {
+                    color: '#8a9d8a',
+                    fillColor: '#8a9d8a',
+                    fillOpacity: 0.15,
+                    radius: relativeErrorMeters
+                }).addTo(map);
+            }
+
+            var marker = L.marker([x, y], {
+                title: '{{ .Title }}',
+            }).addTo(map)
+                .bindPopup('<span><b>{{ .Title }}</b><br><a href="https://www.openstreetmap.org/#map=13/{{ .MapLocationX }}/{{ .MapLocationY }}">{{ .MapLocationX }}, {{ .MapLocationY }}</a></span>')
+                .openPopup();
+        }
+
+        document.addEventListener('DOMContentLoaded', () => {initLocationMap(
+            'map-container',
+            {{ .MapLocationX }},
+            {{ .MapLocationY }},
+            {{ .MapLocationAreaMeters }}
+        )});
+
+        let galleryResizeTimeout;
+        window.addEventListener('resize', function() {
+            clearTimeout(galleryResizeTimeout);
+            galleryResizeTimeout = setTimeout(() => {
+                map.invalidateSize();
+                var oldGalleryMap = new Map(galleryMap);
+                oldGalleryMap.forEach((createFunc, g, map) => {
+                    galleryMap.delete(g);
+                    g.destroy();
+                    createFunc();
+                });
+            }, 300);
+        });
+    </script>
+    {{- end }}
 
 </body>
 </html>
diff --git a/views/pages/blog-catalogue.html b/views/pages/blog-catalogue.html
index 1bed1cc..ac2fb7d 100644
--- a/views/pages/blog-catalogue.html
+++ b/views/pages/blog-catalogue.html
@@ -57,9 +57,7 @@
         Loading...
     </div>
 </div>
-{{ end }}
 
-{{ define "bottom-embeds" }}
 <script>
     function selectAll() {
         const tagsContainers = document.querySelectorAll('form.tags-list');
@@ -157,5 +155,4 @@
         }
     });
 </script>
-
 {{ end }}
diff --git a/views/pages/blog-page.html b/views/pages/blog-page.html
index 2f5465c..d8fb118 100644
--- a/views/pages/blog-page.html
+++ b/views/pages/blog-page.html
@@ -1,23 +1,3 @@
-{{ define "top-embeds" }}
-<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/css/lightgallery.min.css">
-<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/css/lg-zoom.min.css">
-<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/lightgallery/2.8.3/css/lg-thumbnail.min.css">
-{{- if .MapLocationX }}
-<link rel="stylesheet" href="https://f003.backblazeb2.com/file/sayana-static/libs/leaflet/1.9.4/leaflet.css">
-{{- end }}
-
-<style>
-    .map-container .leaflet-container {
-        width: 100% !important;
-        height: 100% !important;
-    }
-</style>
-
-<script>
-    const galleryMap = new Map();
-</script>
-{{ end }}
-
 {{ define "body" }}
 <div class="bg-background-light flex flex-col inset-shadow p-[2.4vmin] overflow-y-auto">
     {{ .ParsedMarkdown }}
@@ -32,61 +12,3 @@
 {{ define "footer" }}
 <div hx-get="/api/v1/like" hx-target="this" hx-swap="outerHTML" hx-trigger="load"></div>
 {{ end }}
-
-{{ define "bottom-embeds" }}
-<script src="https://f003.backblazeb2.com/file/sayana-static/libs/lightgallery/2.8.3/lightgallery.min.js"></script>
-<script src="https://f003.backblazeb2.com/file/sayana-static/libs/lightgallery/2.8.3/plugins/lg-zoom.min.js"></script>
-<script src="https://f003.backblazeb2.com/file/sayana-static/libs/lightgallery/2.8.3/plugins/lg-thumbnail.min.js"></script>
-{{- if .MapLocationX }}
-<script src="https://f003.backblazeb2.com/file/sayana-static/libs/leaflet/1.9.4/leaflet.js"></script>
-
-<script>
-    var map;
-
-    function initLocationMap(id, x, y, relativeErrorMeters = 0) {
-        map = L.map(id).setView([x, y], 8);
-
-        L.tileLayer('https://tile.openstreetmap.org/{z}/{x}/{y}.png', {
-            maxZoom: 18,
-            attribution: '&copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>'
-        }).addTo(map);
-
-        if (relativeErrorMeters != 0) {
-            var circle = L.circle([x, y], {
-                color: '#8a9d8a',
-                fillColor: '#8a9d8a',
-                fillOpacity: 0.15,
-                radius: relativeErrorMeters
-            }).addTo(map);
-        }
-
-        var marker = L.marker([x, y], {
-            title: '{{ .Title }}',
-        }).addTo(map)
-            .bindPopup('<span><b>{{ .Title }}</b><br><a href="https://www.openstreetmap.org/#map=13/{{ .MapLocationX }}/{{ .MapLocationY }}">{{ .MapLocationX }}, {{ .MapLocationY }}</a></span>')
-            .openPopup();
-    }
-
-    document.addEventListener('DOMContentLoaded', () => {initLocationMap(
-        'map-container',
-        {{ .MapLocationX }},
-        {{ .MapLocationY }},
-        {{ .MapLocationAreaMeters }}
-    )});
-
-    let galleryResizeTimeout;
-    window.addEventListener('resize', function() {
-        clearTimeout(galleryResizeTimeout);
-        galleryResizeTimeout = setTimeout(() => {
-            map.invalidateSize();
-            var oldGalleryMap = new Map(galleryMap);
-            oldGalleryMap.forEach((createFunc, g, map) => {
-                galleryMap.delete(g);
-                g.destroy();
-                createFunc();
-            });
-        }, 300);
-    });
-</script>
-{{- end }}
-{{ end }}
\ No newline at end of file
-- 
cgit v1.3.1+13