diff options
Diffstat (limited to 'templates/blocks')
| -rw-r--r-- | templates/blocks/markdown.html | 1 | ||||
| -rw-r--r-- | templates/blocks/trail.html | 71 |
2 files changed, 72 insertions, 0 deletions
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 %} |