75 lines
4.4 KiB
HTML
75 lines
4.4 KiB
HTML
---
|
|
# "Timeline" page
|
|
layout: page
|
|
custom-foot: js/timeline-js.html
|
|
---
|
|
{%- assign field = site.data.theme.timeline-field | default: page.timeline-field | default: "date" -%}
|
|
{% if site.data.theme.timeline-child-objects == true %}
|
|
{%- assign items = site.data[site.metadata] | where_exp: 'item','item.objectid' -%}
|
|
{% else %}
|
|
{%- assign items = site.data[site.metadata] | where_exp: 'item','item.objectid and item.parentid == nil' -%}
|
|
{% endif %}
|
|
{%- assign items = items | where_exp: 'item','item[field]' | sort: field -%}
|
|
{%- assign raw-dates = items | map: field | compact | uniq -%}
|
|
{%- capture clean-years -%}{% for date in raw-dates %}{% if date contains "-" %}{{ date | strip | split: "-" | first }}{% elsif date contains "/" %}{{ date | strip | split: "/" | last }}{% else %}{{ date | strip }}{% endif %}{% unless forloop.last %};{% endunless %}{%- endfor -%}{%- endcapture -%}
|
|
{%- assign uniqueYears = clean-years | replace: ";;",";" | split: ";" | compact | uniq | sort -%}
|
|
{%- if site.data.theme.year-navigation -%}
|
|
{%- assign navYears = site.data.theme.year-navigation | split: ";" -%}
|
|
{%- elsif site.data.theme.year-nav-increment -%}
|
|
{%- capture navYears -%}
|
|
{%- for i in uniqueYears -%}{%- assign t = i | modulo: site.data.theme.year-nav-increment -%}
|
|
{%- if t == 0 -%}{{ i }}{% unless forloop.last %};{% endunless %}{% endif %}{% endfor %}{%- endcapture -%}
|
|
{%- assign navYears = navYears | split: ";" -%}
|
|
{%- endif -%}
|
|
{%- if navYears -%}
|
|
<div class="dropdown float-end" id="year-nav">
|
|
<button class="btn btn-primary dropdown-toggle" type="button" id="yearButton" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
|
Year
|
|
</button>
|
|
<div class="dropdown-menu" aria-labelledby="yearButton">
|
|
{% for y in navYears %}
|
|
<a class="dropdown-item" href="#y{{ y }}">{{ y }}</a>{% endfor %}
|
|
</div>
|
|
</div>
|
|
{%- endif -%}
|
|
|
|
{{ content }}
|
|
|
|
<h3><a href="#y{{ uniqueYears | first }}">{{ uniqueYears | first }}</a> to <a href="#y{{ uniqueYears | last }}">{{ uniqueYears | last }}</a></h3>
|
|
|
|
<table id="timeline" class="table table-striped">
|
|
<tbody>
|
|
{% for year in uniqueYears %}
|
|
<tr id="y{{ year }}">
|
|
<th>
|
|
<h3>{{ year }}</h3>
|
|
</th>
|
|
<td>
|
|
<div class="row">
|
|
{%- assign inYear = items | where_exp: 'item', 'item[field] contains year' -%}
|
|
{% for item in inYear %}
|
|
<div class="col-lg-4 col-md-6">
|
|
<a href="{{ '/items/' | relative_url }}{% if item.parentid %}{{ item.parentid }}.html#{{ item.objectid }}{% else %}{{ item.objectid }}.html{% endif %}" >
|
|
{% if item.image_thumb %}
|
|
<img class="lazyload img-thumbnail timeline-thumb" src="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 3 2'%3E%3C/svg%3E" data-src="{{ item.image_thumb | relative_url }}" alt="{{ item.image_alt_text | default: item.description | default: item.title | escape }}" data-bs-toggle="tooltip" data-bs-placement="bottom" title="{{ item.title | escape }}">
|
|
{% else %}
|
|
<div class="card">
|
|
<div class="card-body text-center">
|
|
<div class="h5 text-dark">{{ item.title }}</div>
|
|
<svg class="bi timeline-thumb text-body" fill="currentColor" aria-hidden="true">
|
|
{%- assign icon_template = item.display_template | default: item.format -%}
|
|
<use xlink:href="{{ '/assets/css/cb-icons.svg' | relative_url }}#{% if icon_template contains 'image' %}icon-image{% elsif icon_template contains 'pdf' %}icon-pdf{% elsif icon_template contains 'audio' %}icon-audio{% elsif icon_template contains 'video' %}icon-video{% elsif icon_template contains 'panorama' %}icon-panorama{% elsif icon_template contains 'compound' %}icon-compound-object{% elsif icon_template contains 'multiple' %}icon-multiple{% else %}icon-default{% endif %}"/>
|
|
</svg>
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
</a>
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
{% endfor %}
|
|
</tbody>
|
|
</table>
|