diff options
Diffstat (limited to 'templates')
| -rw-r--r-- | templates/.djlintrc | 26 | ||||
| -rw-r--r-- | templates/base.html | 31 | ||||
| -rw-r--r-- | templates/blocks/markdown.html | 1 | ||||
| -rw-r--r-- | templates/blocks/trail.html | 71 | ||||
| -rw-r--r-- | templates/blog-post.html | 10 | ||||
| -rw-r--r-- | templates/blog.html | 12 | ||||
| -rw-r--r-- | templates/macros/blog.html | 13 |
7 files changed, 149 insertions, 15 deletions
diff --git a/templates/.djlintrc b/templates/.djlintrc index 5882faa..75269c1 100644 --- a/templates/.djlintrc +++ b/templates/.djlintrc @@ -1,14 +1,16 @@ { -"blank_line_before_tag": "macro", -"blank_line_after_tag": "endmacro,extends,import,from", -"profile": "jinja", -"format_css": true, -"css": { -"indent_size": 2 -}, -"format_js": true, -"js": { -"indent_size": 2 -}, -"indent": "2" + "blank_line_before_tag": "macro", + "blank_line_after_tag": "endmacro,extends,import,from", + "profile": "jinja", + "format_css": true, + "css": { + "indent_size": 2 + }, + "format_js": true, + "js": { + "indent_size": 2 + }, + "indent": "2", + "max_blank_lines": 0, + "preserve_blank_lines": true } diff --git a/templates/base.html b/templates/base.html index 024907d..99341e7 100644 --- a/templates/base.html +++ b/templates/base.html @@ -75,6 +75,19 @@ type="text/css" href="{{ '/static/css/style.css' | asseturl }}"> {% endblock styles %} + + {% block feature_styles %} + {% if needs_trail_assets | default(false) %} + <link rel="stylesheet" + href="{{ '/static/vendor/leaflet/leaflet.css' | asseturl }}"> + <link rel="stylesheet" + href="{{ '/static/vendor/leaflet-fullscreen/Control.FullScreen.css' | asseturl }}"> + <link rel="stylesheet" + href="{{ '/static/vendor/leaflet-elevation/dist/leaflet-elevation.css' | asseturl }}"> + <link rel="stylesheet" href="{{ '/static/css/trail.css' | asseturl }}"> + {% endif %} + {% endblock feature_styles %} + {% block meta_links %} <link rel="canonical" href="{{ this|url(absolute=True, external=True) }}"> <link rel="alternate" @@ -187,7 +200,7 @@ id="atom" aria-label="Atom feed — Latest posts"></a> <a rel="nofollow" - href="/email/" + href="mailto:me+blog@dennisfink.me" id="email" aria-label="Mail address: me plus blog at dennisfink.me"></a> <a rel="me" @@ -210,5 +223,21 @@ {% endblock %} </footer> {% endblock body %} + {% block scripts %} + {% if needs_trail_assets | default(false) %} + <script src="{{ '/static/vendor/leaflet/leaflet.js' | asseturl }}" defer></script> + <script src="{{ '/static/vendor/leaflet-providers/leaflet-providers.js' | asseturl }}" + defer></script> + <script src="{{ '/static/vendor/leaflet-i18n/leaflet-i18n.js' | asseturl }}" + defer></script> + + <script src="{{ '/static/vendor/leaflet-elevation/dist/leaflet-elevation.min.js' | asseturl }}" + defer></script> + <script src="{{ '/static/vendor/leaflet-fullscreen/Control.FullScreen.umd.js' | asseturl }}" + defer></script> + <script src="{{ '/static/js/trail.js' | asseturl }}" defer></script> + {% endif %} + {% endblock scripts %} + </body> </html> diff --git a/templates/blocks/markdown.html b/templates/blocks/markdown.html new file mode 100644 index 0000000..8ee0a42 --- /dev/null +++ b/templates/blocks/markdown.html @@ -0,0 +1 @@ +{{ this.text }} diff --git a/templates/blocks/trail.html b/templates/blocks/trail.html new file mode 100644 index 0000000..b32b7c1 --- /dev/null +++ b/templates/blocks/trail.html @@ -0,0 +1,71 @@ +{% set trail_gpx = record.attachments.get(this.trail_gpx) if this.trail_gpx else none %} +{% set activity_gpx = record.attachments.get(this.activity_gpx) if this.activity_gpx else none %} +{% if trail_gpx %} + {% set trail_gpx_url = trail_gpx | url(absolute=True, external=False) %} +{% endif %} +{% if activity_gpx %} + {% set activity_gpx_url = activity_gpx | url(absolute=True, external=False) %} +{% endif %} +{% if trail_gpx or activity_gpx %} + <figure class="trail" + {% if trail_gpx %}data-trail-gpx-url="{{ trail_gpx_url }}"{% endif %} + {% if activity_gpx %}data-activity-gpx-url="{{ activity_gpx_url }}"{% endif %}> + <figcaption class="visually-hidden">Interactive map of the trail</figcaption> + <div data-trail-map role="region" aria-label="Interactive trail map"></div> + <details> + <summary>Trail details</summary> + <div> + <div data-trail-chart role="region" aria-label="Trail elevation profile"></div> + <div data-trail-summary> + <table aria-label="Trail summary"> + <tbody> + <tr> + <th scope="row">Distance:</th> + <td data-trail-distance></td> + <th scope="row">Time:</th> + <td data-trail-time></td> + <th scope="row">Overall pace:</th> + <td data-trail-pace></td> + </tr> + <tr> + <th scope="row">Maximum elevation:</th> + <td data-trail-maximum-elevation></td> + <th scope="row">Minimum elevation:</th> + <td data-trail-minimum-elevation></td> + <th scope="row">Average elevation:</th> + <td data-trail-average-elevation></td> + </tr> + <tr> + <th scope="row">Ascent:</th> + <td data-trail-ascent></td> + <th scope="row">Descent:</th> + <td data-trail-descent></td> + </tr> + <tr> + <th scope="row">Average speed:</th> + <td data-trail-average-speed></td> + <th scope="row">Maximum speed:</th> + <td data-trail-maximum-speed></td> + </tr> + </tbody> + </table> + </div> + <p> + <a href="{% if trail_gpx %}{{ trail_gpx_url }}{% else %}{{ activity_gpx_url }}{% endif %}" + download>Download the GPX track</a> + </p> + + </div> + </details> + + <p data-trail-message role="status" hidden>The interactive trail map could not be loaded.</p> + <noscript> + <p class="trail-message">JavaScript is required to display the interactive trail map.</p> + </noscript> + </figure> +{% else %} + <figure class="trail"> + <figcaption class="visually-hidden">Interactive map of the trail</figcaption> + <p class="trail-message" role="status">The interactive trail map could not be loaded.</p> + </figure> +{% endif %} diff --git a/templates/blog-post.html b/templates/blog-post.html index f5e8bbe..1cb33db 100644 --- a/templates/blog-post.html +++ b/templates/blog-post.html @@ -2,6 +2,16 @@ {% from "macros/blog.html" import render_blog_post %} +{% set features = namespace(trail=false) %} + +{% for block in this.body.blocks %} + {% if block._flowblock == "trail" %} + {% set features.trail = true %} + {% endif %} +{% endfor %} + +{% set needs_trail_assets = features.trail %} + {% block meta %} {{ super() }} <meta property="og:type" content="article"> diff --git a/templates/blog.html b/templates/blog.html index 4c011a1..3e187cb 100644 --- a/templates/blog.html +++ b/templates/blog.html @@ -2,6 +2,18 @@ {% from "macros/blog.html" import render_blog_index %} +{% set features = namespace(trail=false) %} + +{% for post in this.pagination.items %} + {% for block in post.body.blocks %} + {% if block._flowblock == "trail" %} + {% set features.trail = true %} + {% endif %} + {% endfor %} +{% endfor %} + +{% set needs_trail_assets = features.trail %} + {% block meta %} {{ super() }} <meta property="og:type" content="website"> diff --git a/templates/macros/blog.html b/templates/macros/blog.html index 7f2ca60..13c2526 100644 --- a/templates/macros/blog.html +++ b/templates/macros/blog.html @@ -19,6 +19,16 @@ {% endmacro %} {% macro render_blog_post(post, show_toc=True) %} + {% set toc = namespace(items=[]) %} + + {% if show_toc and post.render_toc %} + {% for block in post.body.blocks %} + {% if block._flowblock == "markdown" and block.text %} + {% set toc.items = toc.items + (block.text.toc | default([])) %} + {% endif %} + {% endfor %} + {% endif %} + <article class="h-entry"> <header> <div> @@ -68,8 +78,7 @@ </dl> </div> {% if show_toc and post.render_toc %} - {% set toc = post.body.toc|default([]) %} - {{ render_toc(toc) }} + {{ render_toc(toc.items) }} {% endif %} </header> <div class="e-content">{{ post.body }}</div> |