summaryrefslogtreecommitdiff
path: root/views/pages
diff refs
from: back
to: back
| flip
diff options
context:
space:
mode:
Diffstat (limited to 'views/pages')
-rw-r--r--views/pages/blog-catalogue.html164
-rw-r--r--views/pages/blog-page.html96
-rw-r--r--views/pages/global-map.html267
-rw-r--r--views/pages/home-page.html121
4 files changed, 0 insertions, 648 deletions
diff --git a/views/pages/blog-catalogue.html b/views/pages/blog-catalogue.html
deleted file mode 100644
index eccafd6..0000000
--- a/views/pages/blog-catalogue.html
+++ /dev/null
@@ -1,164 +0,0 @@
-{{ define "body" }}
-<div class="flex flex-row ar-lt-1.1:flex-col text-[1vmax] h-[100%]">
- <form hx-get="/api/v1/blog-search" hx-vals='{"lang": "{{ .Lang }}"}' hx-target=".blog-cards" hx-swap="innerHTML"
- class="tags-list ar-gt-1.1:min-w-[10vh] ar-gt-1.1:max-w-[20vh] ar-gt-1.1:w-fit ar-lt-1.1:w-[100%] ar-lt-1.1:max-h-[25%] flex shrink-0 flex-col ar-gt-1.1:mr-[1.2vmin]">
- <div class="flex flex-col overflow-y-auto">
- <fieldset>
- <legend class="font-bold w-[100%] text-center">{{ .L.BlogSearch.TagsHeader }}</legend>
- <div class="flex flex-col ar-lt-1.1:grid grid-cols-5 grid-flow-row-dense">
- <div class="m-[0.4vmin]">
- <label class="font-bold"><input type="checkbox" id="tagsAllCheckbox" onclick="selectAll();"> {{ .L.BlogSearch.ChooseAllTags }}</label>
- </div>
- {{- range .Tags }}
- <div class="m-[0.4vmin]">
- <label><input type="checkbox" id="tag{{ .Name }}Checkbox" name="tags[]" value="{{ .Name }}" onclick="contextAll();" {{ if contains $.QueryTags .Name }}checked{{ end }}> {{ .Name }} <span class="text-secondary italic">{{ .Count }}</span></label>
- </div>
- {{- end }}
- </div>
- </fieldset>
- <fieldset class="mt-[0.8vmin]">
- <legend class="font-bold w-[100%] text-center">{{ .L.BlogSearch.OrderByHeader }}</legend>
- <div class="flex flex-col ar-lt-1.1:grid grid-cols-3 grid-rows-2 grid-flow-col">
- <div class="m-[0.4vmin]">
- <label><input type="radio" id="sortTitleAsc" name="sort" value="titleAsc" {{ if eq .QuerySort "titleAsc" }}checked{{ end }}> {{ .L.BlogSearch.TitleOrdered }} <i class="fas fa-arrow-down-a-z"></i></label>
- </div>
- <div class="m-[0.4vmin]">
- <label><input type="radio" id="sortTitleDesc" name="sort" value="titleDesc" {{ if eq .QuerySort "titleDesc" }}checked{{ end }}> {{ .L.BlogSearch.TitleOrdered }} <i class="fas fa-arrow-down-z-a"></i></label>
- </div>
- <div class="m-[0.4vmin]">
- <label><input type="radio" id="sortActionDateAsc" name="sort" value="actionDateAsc" {{ if eq .QuerySort "actionDateAsc" }}checked{{ end }}> {{ .L.BlogSearch.ActionDateOrdered }} <i class="fas fa-arrow-down-1-9"></i></label>
- </div>
- <div class="m-[0.4vmin]">
- <label><input type="radio" id="sortActionDateDesc" name="sort" value="actionDateDesc" {{ if eq .QuerySort "actionDateDesc" }}checked{{ end }}> {{ .L.BlogSearch.ActionDateOrdered }} <i class="fas fa-arrow-down-9-1"></i></label>
- </div>
- <div class="m-[0.4vmin]">
- <label><input type="radio" id="sortPublicationDateAsc" name="sort" value="publicationDateAsc" {{ if eq .QuerySort "publicationDateAsc" }}checked{{ end }}> {{ .L.BlogSearch.PublicationDateOrdered }} <i class="fas fa-arrow-down-1-9"></i></label>
- </div>
- <div class="m-[0.4vmin]">
- <label><input type="radio" id="sortPublicationDateDesc" name="sort" value="publicationDateDesc" {{ if eq .QuerySort "publicationDateDesc" }}checked{{ end }}> {{ .L.BlogSearch.PublicationDateOrdered }} <i class="fas fa-arrow-down-9-1"></i></label>
- </div>
- </div>
- </fieldset>
- </div>
- <hr class="border-t-[0.2vmax] border-dotted border-main-dark my-[0.4vmin]">
- <div class="flex flex-row grow bg-background-light my-[2vmin] p-[0.4vmin] rounded-[0.4vmin] justify-items-center">
- <i onclick="defaultSearchParams(); cleanHrefParams();" class="fas fa-rotate-left flex-1 text-center text-[1.5vmax] hover:bg-background-dark cursor-pointer transition-colors duration-300"></i>
- <div class="w-[0.5vmin] bg-background-dark grow-0"></div>
- <button class="flex-1" type="submit">
- <i onclick="setHrefParams();" class="fas fa-magnifying-glass text-center text-[1.5vmax] hover:bg-background-dark cursor-pointer transition-colors duration-300"></i>
- </button>
- </div>
- </form>
-
- <div class="w-[0.5vh] border-r-[0.3vh] border-dotted border-main-dark bg-background-dark"></div>
-
- <div hx-get="/api/v1/blog-search" hx-vals='js:{lang: "{{ .Lang }}", tz: clientTimeZone}' hx-target="this" hx-swap="innerHTML" hx-trigger="load" hx-include=".tags-list"
- class="blog-cards grow flex flex-col overflow-y-auto bg-background-light inset-shadow p-[2.4vmin]">
- Loading...
- </div>
-</div>
-
-<script>
- function selectAll() {
- const tagsContainers = document.querySelectorAll('form.tags-list');
- tagsContainers.forEach(tagsContainer => {
- const selectAllCheckbox = tagsContainer.querySelector('#tagsAllCheckbox');
- const checkboxes = tagsContainer.querySelectorAll('input[type="checkbox"]:not([id="tagsAllCheckbox"])');
- checkboxes.forEach(checkbox => {
- checkbox.checked = selectAllCheckbox.checked;
- });
- });
- }
-
- function contextAll() {
- const tagsContainers = document.querySelectorAll('form.tags-list');
- tagsContainers.forEach(tagsContainer => {
- const selectAllCheckbox = tagsContainer.querySelector('#tagsAllCheckbox');
- const checkboxes = tagsContainer.querySelectorAll('input[type="checkbox"]:not([id="tagsAllCheckbox"])');
- var areAllChecked = true;
- checkboxes.forEach(checkbox => {
- if (!checkbox.checked) areAllChecked = false;
- });
- selectAllCheckbox.checked = areAllChecked;
- });
- }
-
- function defaultSearchParams() {
- const tagsContainers = document.querySelectorAll('form.tags-list');
- tagsContainers.forEach(tagsContainer => {
- const checkboxes = tagsContainer.querySelectorAll('input[type="checkbox"]');
- checkboxes.forEach(checkbox => {
- checkbox.checked = true;
- });
- const sortRadio = tagsContainer.querySelector('#sortPublicationDateDesc');
- sortRadio.checked = true;
- });
- }
-
- function cleanHrefParams() {
- const url = new URL(window.location.href);
- url.search = '';
-
- window.history.pushState({}, '', url.toString());
- }
-
- function setHrefParams() {
- const url = new URL(window.location.href);
- url.search = '';
-
- const tagsContainers = document.querySelectorAll('form.tags-list');
- tagsContainers.forEach(tagsContainer => {
- const checkboxes = tagsContainer.querySelectorAll('input[type="checkbox"]');
- checkboxes.forEach(checkbox => {
- if (checkbox.checked)
- url.searchParams.append('tags[]', checkbox.value);
- });
- const sortRadio = tagsContainer.querySelector('input[type="radio"]:checked');
- url.searchParams.set('sort', sortRadio.value);
- });
-
- window.history.pushState({}, '', url.toString());
- }
-
- function pickedTagSetHrefParams(tag) {
- const url = new URL(window.location.href);
- url.searchParams.delete('tags[]');
- url.searchParams.set('tags[]', tag);
-
- const tagsContainers = document.querySelectorAll('form.tags-list');
- tagsContainers.forEach(tagsContainer => {
- const checkboxes = tagsContainer.querySelectorAll('input[type="checkbox"]');
- checkboxes.forEach(checkbox => {
- checkbox.checked = false;
- });
- chosenCheckbox = tagsContainer.querySelector(`#tag${tag}Checkbox`);
- chosenCheckbox.checked = true;
- });
-
- window.history.pushState({}, '', url.toString());
- }
-
- document.addEventListener('htmx:afterRequest', (e) => {
- if (e.detail.xhr.status == 404 || e.detail.successful != true) {
- return console.error(e);
- }
- if (e.detail.target.id == 'general-page-body') {
- contextAll();
-
- const tagsContainers = document.querySelectorAll('form.tags-list');
- tagsContainers.forEach(tagsContainer => {
- const checkboxes = tagsContainer.querySelectorAll('input[type="checkbox"]');
- anyChecked = false;
- checkboxes.forEach(checkbox => {
- anyChecked = checkbox.checked ? true : anyChecked;
- });
- if (!anyChecked) {
- const selectAllCheckbox = tagsContainer.querySelector('#tagsAllCheckbox');
- selectAllCheckbox.checked = true;
- selectAll();
- }
- });
- }
- }, {once: true});
-</script>
-{{ end }}
diff --git a/views/pages/blog-page.html b/views/pages/blog-page.html
deleted file mode 100644
index 863b417..0000000
--- a/views/pages/blog-page.html
+++ /dev/null
@@ -1,96 +0,0 @@
-{{ define "top-embeds" }}
-<script>
- let galleryMap = new Map();
- let map;
-
- window.addEventListener('popout', (e) => {
- map.remove();
- galleryMap.forEach((_, g, m) => {
- g.destroy();
- });
- galleryMap.clear();
- map = null;
- galleryMap = null;
- }, {once: true});
-</script>
-{{ end }}
-
-{{ define "body" }}
-<div class="bg-background-light flex flex-col inset-shadow p-[2.4vmin] overflow-y-auto">
- {{ .ParsedMarkdown }}
-{{- if .MapLocationX }}
- <hr class="border-t-4 border-dotted border-main-dark mt-[0.8vmin] mb-[0.8vmin] w-[80%] ml-auto mr-auto">
- <div id="map-container" class="relative p-[0.8vmin] flex-none ml-auto mr-auto w-[60%] ar-lt-1.1:w-[80%] h-[40vh] ar-lt-1.1:h-[30vh]"></div>
- <hr class="border-t-4 border-dotted border-main-dark mt-[0.8vmin] mb-[0.8vmin] w-[80%] ml-auto mr-auto">
-
- <script>
- 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('htmx:afterRequest', (e) => {
- if (e.detail.target.id == 'general-page-body') {
- initLocationMap(
- 'map-container',
- {{ .MapLocationX }},
- {{ .MapLocationY }},
- {{ .MapLocationAreaMeters }}
- );
- }
- }, {once: true});
- </script>
-{{- end }}
-</div>
-{{ end }}
-
-{{ define "footer" }}
-<div hx-get="/api/v1/like" hx-target="this" hx-swap="outerHTML" hx-trigger="load"></div>
-{{ end }}
-
-{{ define "bottom-embeds" }}
-<script>
- let galleryResizeTimeout;
-
- function resizeCb() {
- clearTimeout(galleryResizeTimeout);
- galleryResizeTimeout = setTimeout(() => {
- if (map !== undefined) {
- map.invalidateSize();
- }
- var oldGalleryMap = new Map(galleryMap);
- oldGalleryMap.forEach((createFunc, g, map) => {
- galleryMap.delete(g);
- g.destroy();
- createFunc();
- });
- }, 300);
- }
-
- window.addEventListener('resize', resizeCb);
-
- document.addEventListener('popout', (e) => {
- window.removeEventListener('resize', resizeCb);
- galleryResizeTimeout = null;
- });
-</script>
-{{ end }} \ No newline at end of file
diff --git a/views/pages/global-map.html b/views/pages/global-map.html
deleted file mode 100644
index a844e06..0000000
--- a/views/pages/global-map.html
+++ /dev/null
@@ -1,267 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8">
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
- <title>SAYA TODAY // {{ .L.GlobalMap.Header }}</title>
- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.2/css/all.min.css">
- <link rel="preconnect" href="https://fonts.googleapis.com">
- <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 "header" . }}{{ end }}
- <link href="/output.css" rel="stylesheet">
- <link rel="stylesheet" href="https://f003.backblazeb2.com/file/sayana-static/libs/leaflet/1.9.4/leaflet.css">
- <link rel="stylesheet" href="https://f003.backblazeb2.com/file/sayana-static/libs/leaflet.markercluster/1.4.1/MarkerCluster.css">
- <link rel="stylesheet" href="https://f003.backblazeb2.com/file/sayana-static/libs/leaflet.markercluster/1.4.1/MarkerCluster.Default.css">
-</head>
-
-<body data-theme="ram" class="font-spectral text-main-dark overflow-hidden bg-interlocked-hexagons h-screen flex flex-row ar-lt-1.1:flex-col">
-
- <script>
- function switchTheme(theme) {
- if (theme == "" || typeof theme == "undefined") {
- const currentTheme = document.body.getAttribute('data-theme');
- switch (currentTheme) {
- case "olive": theme = "lettuce"; break;
- case "lettuce": theme = "night"; break;
- case "night": theme = "ram"; break;
- case "ram": theme = "olive"; break;
- }
- }
- localStorage.setItem('theme', theme);
- document.body.setAttribute('data-theme', theme);
- }
-
- const savedTheme = localStorage.getItem('theme') || 'ram';
- switchTheme(savedTheme);
- </script>
-
- <script>
- const clientTimeZone = Intl.DateTimeFormat().resolvedOptions().timeZone;
- </script>
-
- <div id="sidebar" class="bg-sidebar flex sticky flex-col ar-gt-1.1:items-center shadow-2xl z-20 w-[5vw] ar-lt-1.1:w-screen h-screen ar-lt-1.1:h-[8vh]">
- <div class="logo-custom ar-lt-1.1:hidden text-sidebar font-patua font-extrabold text-center relative z-20">
- saya.today
- </div>
- <div class="text-[3vw] ar-lt-1.1:text-[5vh] text-stroke-(--sidebar-stroke-color) text-stroke-[0.1vw] flex flex-col ar-lt-1.1:flex-row gap-0 relative z-20">
- <i onclick="location.href='/{{ .Lang }}';" class="fas fa-home w-[5vw] ar-lt-1.1:w-[8vh] h-[5vw] ar-lt-1.1:h-[8vh] content-center text-center text-sidebar hover:bg-background-dark cursor-pointer transition-colors duration-300 flex rounded-lg"></i>
- <i onclick="location.href='/{{ .Lang }}/blog';" class="fas fa-search w-[5vw] ar-lt-1.1:w-[8vh] h-[5vw] ar-lt-1.1:h-[8vh] content-center text-center text-sidebar hover:bg-background-dark cursor-pointer transition-colors duration-300 flex rounded-lg"></i>
- <i onclick="location.href='/{{ .Lang }}/map';" class="fas fa-map w-[5vw] ar-lt-1.1:w-[8vh] h-[5vw] ar-lt-1.1:h-[8vh] content-center text-center text-sidebar hover:bg-background-dark cursor-pointer transition-colors duration-300 flex rounded-lg"></i>
- <i onclick="toggleThemeWheel();" id="theme-button" class="fas fa-swatchbook w-[5vw] ar-lt-1.1:w-[8vh] h-[5vw] ar-lt-1.1:h-[8vh] content-center text-center text-sidebar hover:bg-background-dark cursor-pointer transition-colors duration-300 flex rounded-lg"></i>
- </div>
- <div class="theme-wheel" id="theme-wheel">
- <div class="theme-icon" data-theme="olive"></div>
- <div class="theme-icon" data-theme="lettuce"></div>
- <div class="theme-icon" data-theme="night"></div>
- <div class="theme-icon" data-theme="ram"></div>
- </div>
- </div>
-
- <div id="map-container" class="bg-background-dark flex z-10 w-[95vw] ar-lt-1.1:w-screen h-screen ar-lt-1.1:h-[92vh]"></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/leaflet/1.9.4/leaflet.js"></script>
- <script src="https://f003.backblazeb2.com/file/sayana-static/libs/leaflet.markercluster/1.4.1/leaflet.markercluster.js"></script>
-
- <script>
- const themeWheel = document.getElementById('theme-wheel');
- const themeButton = document.getElementById('theme-button');
- const themeIcons = document.querySelectorAll('.theme-icon');
-
- themeIcons.forEach(icon => {
- if (icon.getAttribute('data-theme') == savedTheme) {
- icon.classList.add('active');
- }
- });
-
- function calculateVmax(percent) {
- const viewportWidth = window.innerWidth;
- const viewportHeight = window.innerHeight;
-
- const largerDimension = Math.max(viewportWidth, viewportHeight);
-
- const vmaxValue = (largerDimension / 100) * percent;
-
- return vmaxValue;
- }
-
- function positionThemeIcons() {
- const icons = themeWheel.querySelectorAll('.theme-icon');
- const iconCount = icons.length;
- const vmax = calculateVmax(1);
- const wheelRadius = 7.5*vmax; // Radius of the wheel
- const iconRadius = 4*vmax; // Distance from center to place icons
- const iconSize = 3*vmax; // Half of icon size for centering
-
- icons.forEach((icon, index) => {
- const angle = (index * 360 / iconCount) - 90;
- const angleRad = (angle * Math.PI) / 180;
-
- const x = Math.cos(angleRad) * iconRadius + wheelRadius - iconSize;
- const y = Math.sin(angleRad) * iconRadius + wheelRadius - iconSize;
-
- icon.style.left = x + 'px';
- icon.style.top = y + 'px';
- });
- }
-
- function positionThemeWheel() {
- const buttonRect = themeButton.getBoundingClientRect();
- const buttonCenterX = buttonRect.left + buttonRect.width / 2;
- const buttonCenterY = buttonRect.top + buttonRect.height / 2;
-
- const wheelRadius = calculateVmax(7.5);
- const margin = calculateVmax(1);
-
- let wheelX = buttonCenterX - wheelRadius;
- let wheelY = buttonCenterY - wheelRadius;
-
- const viewportWidth = window.innerWidth;
- const viewportHeight = window.innerHeight;
-
- if (wheelX < margin) {
- wheelX = margin;
- } else if (wheelX + (wheelRadius * 2) > viewportWidth - margin) {
- wheelX = viewportWidth - (wheelRadius * 2) - margin;
- }
-
- if (wheelY < margin) {
- wheelY = margin;
- } else if (wheelY + (wheelRadius * 2) > viewportHeight - margin) {
- wheelY = viewportHeight - (wheelRadius * 2) - margin;
- }
-
- themeWheel.style.left = wheelX + 'px';
- themeWheel.style.top = wheelY + 'px';
- }
-
- function hideThemeWheel() {
- themeWheel.classList.remove('active');
- }
-
- function showThemeWheel() {
- positionThemeWheel();
- positionThemeIcons();
- themeWheel.classList.add('active');
- }
-
- function toggleThemeWheel() {
- if (themeWheel.classList.contains('active')) {
- hideThemeWheel();
- } else {
- showThemeWheel();
- }
- }
-
- themeIcons.forEach(icon => {
- icon.addEventListener('click', (e) => {
- e.stopPropagation();
- const theme = icon.getAttribute('data-theme');
- switchTheme(theme);
- themeIcons.forEach(icon => {
- icon.classList.remove('active');
- })
- icon.classList.add('active');
- });
- });
-
- themeWheel.addEventListener('mouseleave', hideThemeWheel);
-
- document.addEventListener('click', (e) => {
- if (!themeWheel.contains(e.target) && e.target !== themeButton) {
- hideThemeWheel();
- }
- });
- </script>
-
- <script>
- var map;
- var markers = L.markerClusterGroup();
-
- function createCustomIcon(color, borderColor = "var(--main-light-color)") {
- const svgIcon = `
- <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
- <path d="M12 1C7.5 1 4 4.5 4 9c0 6.5 8 14 8 14s8-7.5 8-14c0-4.5-3.5-8-8-8zm0 11c-1.5 0-3-1.5-3-3s1.5-3 3-3 3 1.5 3 3-1.5 3-3 3z"
- fill="${color}"
- stroke="${borderColor}"
- stroke-width="1"
- stroke-linejoin="round"/>
- </svg>
- `;
-
- return L.divIcon({
- html: svgIcon,
- className: 'custom-svg-marker',
- iconSize: [32, 32],
- iconAnchor: [16, 32],
- popupAnchor: [0, -32]
- });
- }
-
- function initLocationMap() {
- map = L.map('map-container').setView([{{ .MapLocationLat }}, {{ .MapLocationLong }}], 4);
-
- 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);
-
- map.addLayer(markers);
- }
-
- function stringToColor(str) {
- let hash = 0;
- for (let i = 0; i < str.length; i++) {
- hash = str.charCodeAt(i) + ((hash << 5) - hash);
- }
-
- let color = '#';
- for (let i = 0; i < 3; i++) {
- const value = (hash >> (i * 8)) & 0xFF;
- color += ('00' + value.toString(16)).substr(-2);
- }
-
- return color;
- }
-
- function mapAddMarker(x, y, relativeErrorMeters = 0, title = "", link = "", thumbnail = "") {
- const titleColor = stringToColor(title);
-
- if (relativeErrorMeters != 0) {
- var circle = L.circle([x, y], {
- color: titleColor,
- fillColor: titleColor,
- fillOpacity: 0.15,
- radius: relativeErrorMeters
- }).addTo(map);
- }
-
- var marker = L.marker([x, y], {
- icon: createCustomIcon(titleColor),
- title: title,
- }).bindPopup(`
- <div class="flex flex-row justify-center justify-items-center">
- <img onclick="location.href='${link}';" class="cursor-pointer object-cover rounded-[10%] select-none w-[3vmax] h-[3vmax] mr-[0.5vmax]" src="https://f003.backblazeb2.com/file/sayana-photos/webp-320p/${thumbnail}.webp">
- <span><b><a href="${link}">${title}</a></b><br><a href="https://www.openstreetmap.org/#map=13/${x}/${y}">${x}, ${y}</a></span>
- </div>`);
-
- markers.addLayer(marker);
- }
-
- document.addEventListener('DOMContentLoaded', () => {
- initLocationMap();
- {{- range .MapMarkers }}
- mapAddMarker({{ .Lat }}, {{ .Long }}, {{ .AccuracyMeters }}, {{ .Title }}, {{ .PageLink }}, {{ .Thumbnail }});
- {{- end }}
- });
-
- window.addEventListener('resize', function() {
- setTimeout(() => {
- map.invalidateSize();
- }, 100);
- });
- </script>
-
-</body>
-</html>
diff --git a/views/pages/home-page.html b/views/pages/home-page.html
deleted file mode 100644
index 6fd716b..0000000
--- a/views/pages/home-page.html
+++ /dev/null
@@ -1,121 +0,0 @@
-{{ define "body" }}
-<div class="bg-background-light flex flex-row ar-lt-0.6:flex-col w-full h-full inset-shadow overflow-y-auto text-[1vmax]/[2] tracking-[0.04vmin]">
- <div class="ar-gt-0.6:flex-3/5 justify-center content-start p-[5%]">
- <div class="flex flex-col justify-start items-start bg-background-dark mb-[2vmax]">
- <p class="text-[3vmax]/[2] tracking-[0.2vmin] uppercase w-full font-spectral italic text-left
- border-l-[0.4vmax] border-solid border-(--background-dark-color)
- bg-gradient-to-r from-(--background-dark-color) to-(--background-light-color)">{{ .L.HomePage.Hymn1 }}</p>
- <hr class="w-full border-t-[0.2vmax] border-dotted border-main-dark mb-[0.8vmin]">
- <p class="text-[2vmax]/[2] -indent-[2vmax] ml-[2vmax] p-[0.4vmax]">{{ .L.HomePage.Hymn2 }}</p>
- <p class="text-[2vmax]/[2] -indent-[2vmax] ml-[2vmax] p-[0.4vmax]">{{ .L.HomePage.Hymn3 }}</p>
- <p class="text-[2vmax]/[2] -indent-[2vmax] ml-[2vmax] p-[0.4vmax]">{{ .L.HomePage.Hymn4 }}</p>
- </div>
-
- <div class="flex flex-col justify-center items-center">
- <p class="text-[2vmax] w-full font-spectral italic text-left
- border-l-[0.4vmax] border-solid border-(--background-dark-color)
- bg-gradient-to-r from-(--background-dark-color) to-(--background-light-color)">{{ .L.HomePage.DidYouKnowThat }}</p>
- <hr class="w-full border-t-[0.2vmax] border-dotted border-main-dark mb-[0.8vmin]">
- <ul class="w-full text-left list-[circle]">
- <li class="ml-[2vmax] mb-[0.8vmin]">{{ index .FunFacts 0 }}</li>
- <li class="ml-[2vmax] mb-[0.8vmin]">{{ index .FunFacts 1 }}</li>
- <li class="ml-[2vmax]">{{ index .FunFacts 2 }}</li>
- </ul>
- </div>
- </div>
-
- <div class="ar-gt-0.6:flex-2/5 justify-center content-start p-[5%]">
- <div class="flex flex-col justify-center items-start mb-[2vmax]">
- <p class="text-[2vmax] w-full font-spectral italic text-left
- border-l-[0.4vmax] border-solid border-(--background-dark-color)
- bg-gradient-to-r from-(--background-dark-color) to-(--background-light-color)">{{ .L.HomePage.Contacts }}</p>
- <a href="https://t.me/EarlInisMona">
- <i class="fa-brands fa-telegram w-[1vmax] h-[1vmax] mr-[0.4vmax]"></i>
- <span class="font-bold">Telegram:</span>
- <span>@EarlInisMona</span>
- </a>
- <a href="https://discord.com/users/356057270951346176">
- <i class="fa-brands fa-discord w-[1vmax] h-[1vmax] mr-[0.4vmax]"></i>
- <span class="font-bold">Discord:</span>
- <span>montferrat</span>
- </a>
- <a href="mailto:saya.andy@posteo.com">
- <i class="fas fa-envelope w-[1vmax] h-[1vmax] mr-[0.4vmax]"></i>
- <span class="font-bold">E-mail:</span>
- <span>saya.andy@posteo.com</span>
- </a>
- </div>
-
- <div class="flex relative aspect-square justify-center content-center mb-[2vmax]">
- {{- range $_ := iterate .FilledHeartCount }}
- <div class="home-page-heart z-50">♥</div>
- {{- end }}
- {{- range $_ := iterate .OutlineHeartCount }}
- <div class="home-page-heart z-50">♡</div>
- {{- end }}
- <img src="https://f003.backblazeb2.com/file/sayana-static/home-page-gifs/{{ .GifName }}"
- class="home-page-gif z-49 -rotate-12 max-w-[70%] max-h-[70%] border-[1vmin] border-(--background-dark-color) border-inset">
- </div>
-
- <script>
- function shuffleHearts() {
- vmin = calculateVmin(1);
- document.querySelectorAll('.home-page-heart').forEach((e) => {
- let top, left;
- do {
- top = Math.floor(rand() * 90) + 5;
- left = Math.floor(rand() * 90) + 5;
- } while (top > 30 && top < 70 && left > 30 && left < 70);
- const opacity = rand() * 0.7 + 0.2;
- const size = rand() * 3.2 + 0.8;
- e.style["top"] = `calc(${top}% - ${size}vmin / 2)`;
- e.style["left"] = `calc(${left}% - ${size}vmin / 2)`;
- e.style["opacity"] = `${opacity}`;
- e.style["font-size"] = `${size}vmin`;
- });
- }
-
- let shuffleHeartsResizeTimeout;
- function shuffleHeartsResizeCb() {
- clearTimeout(shuffleHeartsResizeTimeout);
- shuffleHeartsResizeTimeout = setTimeout(shuffleHearts, 300);
- }
- window.addEventListener('resize', shuffleHeartsResizeCb);
-
- document.addEventListener('popout', (e) => {
- window.removeEventListener('resize', shuffleHeartsResizeCb);
- shuffleHeartsResizeCb = null;
- });
- </script>
-
- <script>
- document.addEventListener('htmx:afterRequest', (e) => {
- if (e.detail.xhr.status == 404 || e.detail.successful != true) {
- return console.error(e);
- }
- if (e.detail.target.id == 'general-page-body') {
- shuffleHearts();
- }
- }, {once: true});
- </script>
-
- <div class="flex flex-col justify-center items-center">
- <p class="text-[2vmax] w-full font-spectral italic text-left
- border-l-[0.4vmax] border-solid border-(--background-dark-color)
- bg-gradient-to-r from-(--background-dark-color) to-(--background-light-color)">{{ .L.HomePage.SidebarDescription }}</p>
- <hr class="w-full border-t-[0.2vmax] border-dotted border-main-dark mb-[0.8vmin]">
- <div class="w-full grid grid-cols-[1fr_4fr] content-center items-center
- [&>*:nth-child(4n+2)]:bg-(--background-medium-color) [&>*:nth-child(4n+3)]:bg-(--background-medium-color)" style="container-type: inline-size;">
- <i class="fas fa-home w-full h-full text-[10cqi] content-center text-center text-main-dark"></i>
- <p class="p-[0.4vmax]">{{ .L.HomePage.HomePageDescription }}</p>
- <i class="fas fa-search w-full h-full text-[10cqi] content-center text-center text-main-dark"></i>
- <p class="p-[0.4vmax]">{{ .L.HomePage.BlogSearchDescription }}</p>
- <i class="fas fa-map w-full h-full text-[10cqi] content-center text-center text-main-dark"></i>
- <p class="p-[0.4vmax]">{{ .L.HomePage.MarkerMapDescription }}</p>
- <i class="fas fa-swatchbook w-full h-full text-[10cqi] content-center text-center text-main-dark"></i>
- <p class="p-[0.4vmax]">{{ .L.HomePage.ThemeSwitchDescription }}</p>
- </div>
- </div>
- </div>
-</div>
-{{ end }}
generated by cgitext v1.3.1+17 (git 2.54.0) at 2026-09-16 17:51:57 +0000