guide.deuxfleurs.fr/templates/_nav.html

99 lines
3.7 KiB
HTML
Raw Permalink Normal View History

2023-03-01 14:38:36 +00:00
{# (Public) Entrypoint to be used by zola "pages" #}
{% macro page(target) %}
{% set root = get_section(path=target.ancestors | last) %}
{{ nav::inner_nav(root=root, current=target) }}
{% endmacro %}
2022-09-25 14:11:47 +00:00
2023-03-01 14:38:36 +00:00
{# (Public) Entrypoint to be used by zola "sections" #}
{% macro section(target) %}
{{ nav::inner_nav(root=target, current=target) }}
{% endmacro %}
2022-09-25 13:19:38 +00:00
2023-03-01 18:45:01 +00:00
{# -------------------------- #}
2023-03-01 14:38:36 +00:00
{# -------------------------- #}
2022-09-25 14:11:47 +00:00
2023-03-01 14:38:36 +00:00
{# (Private) Shared+root logic to build the menu #}
{% macro inner_nav(root, current) %}
{{ nav::hamburger(root=root) }}
2022-09-25 13:19:38 +00:00
2023-03-01 14:38:36 +00:00
{# Section title #}
<div class="toc-item toc-section">
<a class="subtext" href="{{root.permalink | safe}}">{{ root.title }}</a>
</div>
2022-06-01 14:41:21 +00:00
2023-03-01 14:38:36 +00:00
{# Choose between "tree" (has extra.parent) and "list" (default) collections #}
{% set root_tree = root.pages | group_by(attribute="extra.parent") %}
{% if root.relative_path in root_tree %}
{% set tree_breadcrumb = nav::breadcrumb(corpus=root.pages, root=root.relative_path, target=current)|split(pat=":")|slice(start=1) %}
{{ nav::tree(
tree=root_tree,
cursor=root.relative_path,
selected=current,
crumb=tree_breadcrumb) }}
2022-06-01 14:41:21 +00:00
{% else %}
2023-03-01 14:38:36 +00:00
{{ nav::list(list=root.pages, selected=current) }}
{% endif %}
{% endmacro %}
2022-12-21 23:35:27 +00:00
2023-03-01 18:45:01 +00:00
{# (Private) On small screens, like a smartphone, hide the menu behind an hamburger icon #}
2023-03-01 14:38:36 +00:00
{% macro hamburger(root) %}
2022-12-21 23:35:27 +00:00
<input id="menu-toggle" type="checkbox" />
<label class='menu-button-container' for="menu-toggle">
<div class="menu-button"></div>
<div class="toc-item toc-menu-title subtext">{{ root.title }}</div>
</label>
2023-03-01 14:38:36 +00:00
{% endmacro %}
2023-03-01 18:45:01 +00:00
{# (Private) Build a breadcrumb for the page #}
2023-03-01 14:38:36 +00:00
{# It's ugly because this is the hacky part of the project #}
{% macro breadcrumb(corpus, root, target) %}{% if 'parent' in target.extra and target.extra.parent != root %}{% set new_target = get_page(path=target.extra.parent) %}{{ nav::breadcrumb(corpus=corpus, root=root, target=new_target) }}:{{ new_target.relative_path }}{% endif %}{% endmacro %}
2023-03-01 18:45:01 +00:00
{# (Private) Render a list menu (this is the simple fallback when extra.parent is not defined #}
2023-03-01 14:38:36 +00:00
{% macro list(list, selected) %}
{% for page in list %}
{% set is_selected = page.relative_path == selected.relative_path %}
<div class="toc-item">
{{ nav::link(page=page, is_selected=is_selected, is_parent=false) }}
</div>
{% endfor %}
{% endmacro %}
2023-03-01 18:45:01 +00:00
{# (Private) Tree menu rendering; this function is recursive #}
{# this function takes a breadcrumb to know which part of the menu must be unfolded #}
2023-03-01 14:38:36 +00:00
{% macro tree(tree, cursor, selected, crumb) %}
{% for page in tree | get(key=cursor) %}
{% set is_selected = page.relative_path == selected.relative_path %}
<div class="toc-item">
2023-03-01 18:45:01 +00:00
{# Link with a (possible) subsection #}
2023-03-01 14:38:36 +00:00
{% if page.relative_path in tree %}
2023-03-01 18:45:01 +00:00
{# Display link as a section #}
2023-03-01 14:38:36 +00:00
{{ nav::link(page=page, is_selected=is_selected, is_parent=true) }}
2023-03-01 18:45:01 +00:00
{# Should we unroll this part of the tree? #}
2023-03-01 14:38:36 +00:00
{% if page.relative_path in crumb or is_selected %}
<div class="nav-subsection">
2023-03-01 18:45:01 +00:00
{# do the recursive call #}
{{ nav::tree(tree=tree, cursor=page.relative_path, selected=selected, crumb=crumb) }}
2023-03-01 14:38:36 +00:00
</div>
{% endif %}
2023-03-01 18:45:01 +00:00
{# Simple link, ie. a leaf of the tree #}
2023-03-01 14:38:36 +00:00
{% else %}
{{ nav::link(page=page, is_selected=is_selected, is_parent=false) }}
{% endif %}
2022-06-01 14:41:21 +00:00
</div>
2023-03-01 14:38:36 +00:00
{% endfor %}
{% endmacro %}
2023-03-01 18:45:01 +00:00
{# (Private) Render a single link #}
2023-03-01 14:38:36 +00:00
{% macro link(page, is_selected, is_parent) %}
<a class="subtext" href="{{page.permalink | safe}}">
{% if is_selected %}<b>{% endif %}
{% if is_parent %}‣ {% endif %}
{{ page.title }}
{% if is_selected %}</b>{% endif %}
</a>
{% endmacro %}