From f6ee4944f901328b7afe41e4a12933771f2652f8 Mon Sep 17 00:00:00 2001 From: Mischa Date: Thu, 25 Jun 2026 00:13:17 +0200 Subject: [PATCH] feat: complete CDN elimination + SVG icon build pipeline CDN cleanup: - entry.html.twig: remove PhotoSwipe CDN + duplicate JS (main.js handles it) - dailies.html.twig: remove PhotoSwipe CDN + duplicate JS - home.html.twig: remove PhotoSwipe CDN + MapLibre CDN + maplibre-utils.js script tags; add {% block map_assets %} to register map bundle SVG build pipeline: - Add lucide-static devDependency; gen-weather-icons.js reads icon SVGs from node_modules and emits templates/partials/weather-icons.html.twig - package.json build script now runs gen-weather-icons.js before esbuild - entry-journal.html.twig includes generated partial instead of hardcoded map - Rebuild: main.js 83.7kb, map.js 860.7kb, all fonts; zero CDN requests remain --- themes/intotheeast/package-lock.json | 10 +- themes/intotheeast/package.json | 5 +- .../intotheeast/scripts/gen-weather-icons.js | 47 +++++++ .../intotheeast/templates/dailies.html.twig | 64 --------- themes/intotheeast/templates/entry.html.twig | 129 +----------------- themes/intotheeast/templates/home.html.twig | 77 +---------- .../partials/entry-journal.html.twig | 11 +- .../partials/weather-icons.html.twig | 11 ++ 8 files changed, 82 insertions(+), 272 deletions(-) create mode 100644 themes/intotheeast/scripts/gen-weather-icons.js create mode 100644 themes/intotheeast/templates/partials/weather-icons.html.twig diff --git a/themes/intotheeast/package-lock.json b/themes/intotheeast/package-lock.json index c7a298a..1caf532 100644 --- a/themes/intotheeast/package-lock.json +++ b/themes/intotheeast/package-lock.json @@ -13,7 +13,8 @@ "scrollama": "^3" }, "devDependencies": { - "esbuild": "^0.21" + "esbuild": "^0.21", + "lucide-static": "latest" } }, "node_modules/@esbuild/aix-ppc64": { @@ -747,6 +748,13 @@ "node": ">=0.10.0" } }, + "node_modules/lucide-static": { + "version": "1.21.0", + "resolved": "https://registry.npmjs.org/lucide-static/-/lucide-static-1.21.0.tgz", + "integrity": "sha512-6248z2/4sEyKkYAPPUYxOPiB2RCfMmLdMHuoOhsTFnoD40ixAoHmTVhOPux8ADa1NTBmzpEKF7WNePm+Ms503Q==", + "dev": true, + "license": "ISC" + }, "node_modules/maplibre-gl": { "version": "4.7.1", "resolved": "https://registry.npmjs.org/maplibre-gl/-/maplibre-gl-4.7.1.tgz", diff --git a/themes/intotheeast/package.json b/themes/intotheeast/package.json index af36f53..7c91665 100644 --- a/themes/intotheeast/package.json +++ b/themes/intotheeast/package.json @@ -1,7 +1,7 @@ { "private": true, "scripts": { - "build": "esbuild js/src/main.js --bundle --minify --format=iife --outfile=js/main.js --loader:.woff2=file --loader:.woff=file --asset-names=../fonts/[name] && esbuild js/src/map.js --bundle --minify --format=iife --outfile=js/map.js && mkdir -p css-compiled fonts && { mv js/main.css css-compiled/main.css 2>/dev/null || true; } && { mv js/map.css css-compiled/map.css 2>/dev/null || true; }" + "build": "node scripts/gen-weather-icons.js && esbuild js/src/main.js --bundle --minify --format=iife --outfile=js/main.js --loader:.woff2=file --loader:.woff=file --asset-names=../fonts/[name] && esbuild js/src/map.js --bundle --minify --format=iife --outfile=js/map.js && mkdir -p css-compiled fonts && { mv js/main.css css-compiled/main.css 2>/dev/null || true; } && { mv js/map.css css-compiled/map.css 2>/dev/null || true; }" }, "dependencies": { "@fontsource-variable/dm-sans": "latest", @@ -12,6 +12,7 @@ "scrollama": "^3" }, "devDependencies": { - "esbuild": "^0.21" + "esbuild": "^0.21", + "lucide-static": "latest" } } diff --git a/themes/intotheeast/scripts/gen-weather-icons.js b/themes/intotheeast/scripts/gen-weather-icons.js new file mode 100644 index 0000000..0c14c86 --- /dev/null +++ b/themes/intotheeast/scripts/gen-weather-icons.js @@ -0,0 +1,47 @@ +#!/usr/bin/env node +'use strict'; +const fs = require('fs'); +const path = require('path'); + +const iconMap = { + 'sunny': 'sun', + 'partly cloudy': 'cloud-sun', + 'cloudy': 'cloud', + 'foggy': 'cloud-fog', + 'drizzle': 'cloud-drizzle', + 'rain': 'cloud-rain', + 'snow': 'cloud-snow', + 'thunderstorm': 'cloud-lightning' +}; + +const wrapAttrs = 'width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"'; + +function buildSvg(iconName) { + const src = path.resolve(__dirname, '..', 'node_modules', 'lucide-static', 'icons', iconName + '.svg'); + const raw = fs.readFileSync(src, 'utf8'); + const inner = raw + .replace(/^[\s\S]*?]*>/, '') + .replace(/<\/svg>[\s\S]*$/, '') + .replace(/\s+/g, ' ') + .trim(); + return `${inner}`; +} + +const entries = Object.entries(iconMap); +const lines = entries.map(([condition, iconName], i) => { + const svg = buildSvg(iconName).replace(/'/g, "\\'"); + const pad = ' '.repeat(Math.max(0, 16 - condition.length)); + const comma = i < entries.length - 1 ? ',' : ''; + return ` '${condition}':${pad}'${svg}'${comma}`; +}); + +const twig = [ + '{# Auto-generated by scripts/gen-weather-icons.js — do not edit directly #}', + '{% set weather_icons = {', + ...lines, + '} %}' +].join('\n') + '\n'; + +const dest = path.resolve(__dirname, '..', 'templates', 'partials', 'weather-icons.html.twig'); +fs.writeFileSync(dest, twig); +console.log('Generated ' + path.relative(path.resolve(__dirname, '..'), dest)); diff --git a/themes/intotheeast/templates/dailies.html.twig b/themes/intotheeast/templates/dailies.html.twig index 7aab41a..5d3dc0b 100644 --- a/themes/intotheeast/templates/dailies.html.twig +++ b/themes/intotheeast/templates/dailies.html.twig @@ -6,7 +6,6 @@ {% endblock %} {% block content %} - {% set journal_entries = page.collection() %} {% set stories_page = grav.pages.find(page.parent().route ~ '/stories') %} {% set story_entries = stories_page ? stories_page.children.published() : [] %} @@ -68,67 +67,4 @@ {% endif %} - {% endblock %} diff --git a/themes/intotheeast/templates/entry.html.twig b/themes/intotheeast/templates/entry.html.twig index 8a31fb4..3919a6f 100644 --- a/themes/intotheeast/templates/entry.html.twig +++ b/themes/intotheeast/templates/entry.html.twig @@ -1,129 +1,12 @@ -{% extends 'default.html.twig' %} +{% extends 'partials/base.html.twig' %} {% block content %} -{% set weather_icons = { - 'Sunny': '☀️', 'Partly cloudy': '⛅', 'Cloudy': '☁️', - 'Foggy': '🌫️', 'Drizzle': '🌦️', 'Rain': '🌧️', - 'Snow': '❄️', 'Thunderstorm': '⛈️' -} %} - -{% set hero = null %} -{% if page.header.hero_image and page.media[page.header.hero_image] is defined %} - {% set hero = page.media[page.header.hero_image] %} -{% elseif page.media.images|length > 0 %} - {% set hero = page.media.images|first %} -{% endif %} - ← Back -
- {% if hero %} -
- {{ page.title }} -
- {% endif %} +{% set entry = page %} +{% include 'partials/entry-journal.html.twig' %} -
-
- - {% if page.header.location_city or page.header.location_country %} -

- {%- set _loc = [] -%} - {%- if page.header.location_city -%}{%- set _loc = _loc|merge([page.header.location_city]) -%}{%- endif -%} - {%- if page.header.location_country -%}{%- set _loc = _loc|merge([page.header.location_country]) -%}{%- endif -%} - 📍 {{ _loc|join(', ') }} -

- {% endif %} - {% if page.header.weather_desc or page.header.weather_temp_c %} -

- {% if page.header.weather_desc %} - {{ weather_icons[page.header.weather_desc] ?? '🌡️' }} {{ page.header.weather_desc }} - {% endif %} - {% if page.header.weather_temp_c %} - · {{ page.header.weather_temp_c|round }}°C - {% endif %} -

- {% endif %} -
- -

{{ page.title }}

-
-
- -
- {{ page.content|raw }} -
- - {% set images = page.media.images %} - {% if images|length > 0 %} -
- {% for image in images %} - - {% endfor %} -
- - - - - {% endif %} - - -
+ {% endblock %} diff --git a/themes/intotheeast/templates/home.html.twig b/themes/intotheeast/templates/home.html.twig index cf4204d..88eb04a 100644 --- a/themes/intotheeast/templates/home.html.twig +++ b/themes/intotheeast/templates/home.html.twig @@ -1,7 +1,11 @@ {% extends 'partials/base.html.twig' %} +{% block map_assets %} +{% do assets.addCss('theme://css-compiled/map.css') %} +{% do assets.addJs('theme://js/map.js', {group: 'bottom'}) %} +{% endblock %} + {% block content %} - {% set trip_route = config.site.active_trip %} {% set trip = grav.pages.find(trip_route) %} @@ -80,12 +84,6 @@ {% if map_entries|length > 0 %} - - -{% if home_gpx_urls|length > 0 %} - -{% endif %} - {% endif %} - - {% else %} {# ══════════════════════════════════════════════════════ BETWEEN-TRIPS MODE #} @@ -305,9 +241,6 @@ document.querySelectorAll('.journal-photo-wrap').forEach(function (wrap) { {% if highlights_map_entries|length > 0 %} - - -