m038/intotheeast-com-content
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: DOMContentLoaded wrapper + correct asset registration in map templates

Browse Source 
- feed-map.html.twig: remove addCss/addJs calls (too late for <head>); merge
  two <script> blocks into one wrapped in DOMContentLoaded
- map.html.twig: move {% block map_assets %} above {% block content %} so
  map.css reaches <head>; add DOMContentLoaded around map init
- dailies.html.twig: add {% block map_assets %} override so map.css and
  map.js are registered for the feed-map partial

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01Vgmzx8VTTTmCskSpQtsLTr
This commit is contained in:
Mischa
2026-06-24 00:16:57 +02:00
parent 476c2c17ef
commit ed25907545
3 changed files with 20 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files
themes/intotheeast/templates/dailies.html.twig
+5
View File
@@ -1,5 +1,10 @@
{% extends 'default.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 %}
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/photoswipe@5/dist/photoswipe.css">
{% set journal_entries = page.collection() %}
themes/intotheeast/templates/map.html.twig
+7 -5
View File
@@ -1,5 +1,10 @@
{% 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_page = page.parent() %}
{% set tracker_page = grav.pages.find(page.parent().route ~ '/dailies') %}
@@ -36,17 +41,13 @@
<div class="map-container" id="trip-map"></div>
{% block map_assets %}
{% do assets.addCss('theme://css-compiled/map.css') %}
{% do assets.addJs('theme://js/map.js', {group: 'bottom'}) %}
{% endblock %}
<script>
var ENTRIES = {{ map_entries|json_encode|raw }};
var GPX_URLS = {{ gpx_urls|json_encode|raw }};
var USE_GPX = {{ trip_page.header.use_gpx ?? true ? 'true' : 'false' }};
var AUTOCONNECT = "{{ trip_page.header.autoconnect ?? 'on' }}";
document.addEventListener('DOMContentLoaded', function() {
var map = new maplibregl.Map({
container: 'trip-map',
style: MapUtils.MAP_STYLE,
@@ -96,5 +97,6 @@ map.on('load', function () {
/* ── GPX tracks + journey segments ─────────────────────────── */
MapUtils.renderGpxJourney(map, USE_GPX ? GPX_URLS : [], ENTRIES, 'gpx', 'journey', { connectMode: AUTOCONNECT });
});
}); // DOMContentLoaded
</script>
{% endblock %}
themes/intotheeast/templates/partials/feed-map.html.twig
+8 -5
View File
@@ -9,10 +9,10 @@
card_prefix — string: prefix for scroll-to card IDs ('entry-' or 'story-')
trip_page — Grav page: trip page for autoconnect setting (used when show_journey is true)
show_journey — bool: whether to draw the route connector line between markers
Callers must register map assets via {% block map_assets %} in their own template.
#}
{% if map_entries|length > 0 %}
{% do assets.addCss('theme://css-compiled/map.css') %}
{% do assets.addJs('theme://js/map.js', {group: 'bottom'}) %}
<div class="feed-map-wrap">
<div class="feed-map" id="{{ map_id }}">
<button class="feed-map-fullscreen-btn" id="{{ map_id }}-fullscreen" aria-label="Expand map">
@@ -29,12 +29,15 @@
<script>
{% set js_suffix = map_id|replace({'-': '_'})|upper %}
var MAP_ENTRIES_{{ js_suffix }} = {{ map_entries|json_encode|raw }};
{% if show_journey %}
{% set _ac = trip_page ? (trip_page.header.autoconnect ?? 'on') : 'on' %}
{% endif %}
var MAP_ENTRIES_{{ js_suffix }} = {{ map_entries|json_encode|raw }};
{% if show_journey %}
var AUTOCONNECT_{{ js_suffix }} = "{{ _ac == 'intelligent_gpx' ? 'on' : _ac }}";
{% endif %}
document.addEventListener('DOMContentLoaded', function() {
var {{ map_var }} = new maplibregl.Map({
container: '{{ map_id }}',
style: MapUtils.MAP_STYLE,
@@ -99,8 +102,7 @@ var {{ map_var }} = new maplibregl.Map({
MapUtils.addJourneySegments({{ map_var }}, segments, '{{ map_id }}-journey');
{% endif %}
});
</script>
<script>
(function() {
var fsBtn = document.getElementById('{{ map_id }}-fullscreen');
var mapWrap = document.querySelector('.feed-map-wrap');
@@ -112,5 +114,6 @@ var {{ map_var }} = new maplibregl.Map({
setTimeout(function() { typeof {{ map_var }} !== 'undefined' && {{ map_var }}.resize(); }, 50);
});
})();
}); // DOMContentLoaded
</script>
{% endif %}