feat: dailies merges stories, id attrs for map sync; stories escape link
This commit is contained in:
@@ -1,17 +1,29 @@
|
|||||||
{% extends 'default.html.twig' %}
|
{% extends 'default.html.twig' %}
|
||||||
|
|
||||||
{% block content %}
|
{% block content %}
|
||||||
{% set entries = page.collection() %}
|
{% set journal_entries = page.collection() %}
|
||||||
|
{% set stories_page = grav.pages.find(page.parent().route ~ '/stories') %}
|
||||||
|
{% set story_entries = stories_page ? stories_page.children.published() : [] %}
|
||||||
|
|
||||||
|
{% set all_items = [] %}
|
||||||
|
{% for e in journal_entries %}
|
||||||
|
{% set all_items = all_items|merge([{'type': 'journal', 'page': e, 'date': e.date}]) %}
|
||||||
|
{% endfor %}
|
||||||
|
{% for s in story_entries %}
|
||||||
|
{% set all_items = all_items|merge([{'type': 'story', 'page': s, 'date': s.date}]) %}
|
||||||
|
{% endfor %}
|
||||||
|
{% set all_items = all_items|sort((a, b) => a.date < b.date ? 1 : -1) %}
|
||||||
|
|
||||||
{# Collect GPS entries for mini-map #}
|
{# Collect GPS entries for mini-map #}
|
||||||
{% set map_entries = [] %}
|
{% set map_entries = [] %}
|
||||||
{% for entry in entries %}
|
{% for item in all_items %}
|
||||||
{% if entry.header.lat is not empty and entry.header.lng is not empty %}
|
{% if item.type == 'journal' and item.page.header.lat is not empty and item.page.header.lng is not empty %}
|
||||||
{% set map_entries = map_entries|merge([{
|
{% set map_entries = map_entries|merge([{
|
||||||
'lat': entry.header.lat,
|
'lat': item.page.header.lat,
|
||||||
'lng': entry.header.lng,
|
'lng': item.page.header.lng,
|
||||||
'title': entry.title,
|
'title': item.page.title,
|
||||||
'url': entry.url
|
'slug': item.page.slug,
|
||||||
|
'url': item.page.url
|
||||||
}]) %}
|
}]) %}
|
||||||
{% endif %}
|
{% endif %}
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
@@ -51,7 +63,10 @@ FEED_ENTRIES.forEach(function(entry, i) {
|
|||||||
});
|
});
|
||||||
L.marker([parseFloat(entry.lat), parseFloat(entry.lng)], { icon: icon })
|
L.marker([parseFloat(entry.lat), parseFloat(entry.lng)], { icon: icon })
|
||||||
.addTo(map)
|
.addTo(map)
|
||||||
.on('click', function() { window.location = entry.url; });
|
.on('click', function() {
|
||||||
|
var card = document.getElementById('entry-' + entry.slug);
|
||||||
|
if (card) { card.scrollIntoView({ behavior: 'smooth', block: 'center' }); }
|
||||||
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
if (latLngs.length === 1) {
|
if (latLngs.length === 1) {
|
||||||
@@ -63,9 +78,9 @@ if (latLngs.length === 1) {
|
|||||||
{% endif %}
|
{% endif %}
|
||||||
|
|
||||||
<div class="feed">
|
<div class="feed">
|
||||||
{% if entries|length > 0 %}
|
{% if all_items|length > 0 %}
|
||||||
{% for entry in entries %}
|
{% for item in all_items %}
|
||||||
<article class="entry-card">
|
{% set entry = item.page %}
|
||||||
{% set hero = null %}
|
{% set hero = null %}
|
||||||
{% if entry.header.hero_image and entry.media[entry.header.hero_image] is defined %}
|
{% if entry.header.hero_image and entry.media[entry.header.hero_image] is defined %}
|
||||||
{% set hero = entry.media[entry.header.hero_image] %}
|
{% set hero = entry.media[entry.header.hero_image] %}
|
||||||
@@ -73,6 +88,8 @@ if (latLngs.length === 1) {
|
|||||||
{% set hero = entry.media.images|first %}
|
{% set hero = entry.media.images|first %}
|
||||||
{% endif %}
|
{% endif %}
|
||||||
|
|
||||||
|
{% if item.type == 'journal' %}
|
||||||
|
<article class="entry-card" id="entry-{{ entry.slug }}" data-lat="{{ entry.header.lat }}" data-lng="{{ entry.header.lng }}">
|
||||||
<a class="entry-card-inner" href="{{ entry.url }}">
|
<a class="entry-card-inner" href="{{ entry.url }}">
|
||||||
{% if hero %}
|
{% if hero %}
|
||||||
<div class="entry-card-photo">
|
<div class="entry-card-photo">
|
||||||
@@ -106,7 +123,6 @@ if (latLngs.length === 1) {
|
|||||||
{% endif %}
|
{% endif %}
|
||||||
</div>
|
</div>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
|
|
||||||
<div class="entry-card-body">
|
<div class="entry-card-body">
|
||||||
<h2 class="entry-title">{{ entry.title }}</h2>
|
<h2 class="entry-title">{{ entry.title }}</h2>
|
||||||
<p class="entry-excerpt">{{ entry.summary|striptags|slice(0, 250)|trim }}</p>
|
<p class="entry-excerpt">{{ entry.summary|striptags|slice(0, 250)|trim }}</p>
|
||||||
@@ -114,6 +130,21 @@ if (latLngs.length === 1) {
|
|||||||
</div>
|
</div>
|
||||||
</a>
|
</a>
|
||||||
</article>
|
</article>
|
||||||
|
{% else %}
|
||||||
|
<article class="entry-card entry-card--story" id="entry-{{ entry.slug }}">
|
||||||
|
<a class="entry-card-inner" href="{{ entry.url }}">
|
||||||
|
{% if hero %}
|
||||||
|
<div class="entry-card-photo entry-card-photo--story">
|
||||||
|
<img src="{{ hero.cropResize(720, 405).url }}" alt="{{ entry.title }}" loading="lazy">
|
||||||
|
</div>
|
||||||
|
{% endif %}
|
||||||
|
<div class="entry-card-body">
|
||||||
|
<span class="story-badge">✦ Story</span>
|
||||||
|
<h2 class="entry-title">{{ entry.title }}</h2>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
</article>
|
||||||
|
{% endif %}
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
{% else %}
|
{% else %}
|
||||||
<p class="feed-empty">No entries yet. The journey is about to begin.</p>
|
<p class="feed-empty">No entries yet. The journey is about to begin.</p>
|
||||||
|
|||||||
@@ -1,5 +1,9 @@
|
|||||||
{% extends 'partials/base.html.twig' %}
|
{% extends 'partials/base.html.twig' %}
|
||||||
|
|
||||||
|
{% block nav %}
|
||||||
|
<a class="story-escape" href="{{ page.parent.parent.url }}">← Back</a>
|
||||||
|
{% endblock %}
|
||||||
|
|
||||||
{% block content %}
|
{% block content %}
|
||||||
<h1>{{ page.title }}</h1>
|
<h1>{{ page.title }}</h1>
|
||||||
<p>Stories coming soon.</p>
|
<p>Stories coming soon.</p>
|
||||||
|
|||||||
Reference in New Issue
Block a user