From ab5584984a1056b44cc52f0ecdcb3246744591f2 Mon Sep 17 00:00:00 2001
From: Henk Verlinde <henk@ventizo.com>
Date: Tue, 25 Jan 2022 16:27:13 +0100
Subject: [PATCH] setup: separate section menu logic from menu building

---
 config/_default/params.toml                   |   7 +-
 content/en/tutorial/_index.md                 |   8 +
 content/en/tutorial/lorem/_index.md           |   8 +
 content/en/tutorial/lorem/ipsum/index.md      |   8 +
 .../sidebar/auto-collapsible-menu.html        |  56 ++++++
 .../partials/sidebar/auto-default-menu.html   |   1 +
 layouts/partials/sidebar/docs-menu.html       | 166 +-----------------
 .../sidebar/manual-collapsible-menu.html      |  62 +++++++
 .../partials/sidebar/manual-default-menu.html |  40 +++++
 9 files changed, 190 insertions(+), 166 deletions(-)
 create mode 100644 content/en/tutorial/_index.md
 create mode 100644 content/en/tutorial/lorem/_index.md
 create mode 100644 content/en/tutorial/lorem/ipsum/index.md
 create mode 100644 layouts/partials/sidebar/auto-collapsible-menu.html
 create mode 100644 layouts/partials/sidebar/auto-default-menu.html
 create mode 100644 layouts/partials/sidebar/manual-collapsible-menu.html
 create mode 100644 layouts/partials/sidebar/manual-default-menu.html

diff --git a/config/_default/params.toml b/config/_default/params.toml
index 4cde9cb..1f9ef10 100644
--- a/config/_default/params.toml
+++ b/config/_default/params.toml
@@ -74,10 +74,6 @@ docsRepoBranch = "master"
 editPage = false
 lastMod = false
 
-
-mainSections = ["docs"]
-
-
 [options]
   lazySizes = true
   clipBoard = true
@@ -93,5 +89,6 @@ mainSections = ["docs"]
 
 [menu]
   [menu.section]
-    auto = true
+    auto = false
     collapsibleSidebar = true
+    mainSections = ["docs", "tutorial"]
diff --git a/content/en/tutorial/_index.md b/content/en/tutorial/_index.md
new file mode 100644
index 0000000..cbc581f
--- /dev/null
+++ b/content/en/tutorial/_index.md
@@ -0,0 +1,8 @@
+---
+title: "Tutorial"
+description: ""
+date: 2022-01-25T14:40:56+01:00
+lastmod: 2022-01-25T14:40:56+01:00
+draft: false
+images: []
+---
diff --git a/content/en/tutorial/lorem/_index.md b/content/en/tutorial/lorem/_index.md
new file mode 100644
index 0000000..a837257
--- /dev/null
+++ b/content/en/tutorial/lorem/_index.md
@@ -0,0 +1,8 @@
+---
+title: "Lorem"
+description: ""
+date: 2022-01-25T14:41:21+01:00
+lastmod: 2022-01-25T14:41:21+01:00
+draft: false
+images: []
+---
diff --git a/content/en/tutorial/lorem/ipsum/index.md b/content/en/tutorial/lorem/ipsum/index.md
new file mode 100644
index 0000000..58860ff
--- /dev/null
+++ b/content/en/tutorial/lorem/ipsum/index.md
@@ -0,0 +1,8 @@
+---
+title: "Ipsum"
+description: ""
+date: 2022-01-25T14:41:39+01:00
+lastmod: 2022-01-25T14:41:39+01:00
+draft: false
+images: []
+---
diff --git a/layouts/partials/sidebar/auto-collapsible-menu.html b/layouts/partials/sidebar/auto-collapsible-menu.html
new file mode 100644
index 0000000..8ed4fb4
--- /dev/null
+++ b/layouts/partials/sidebar/auto-collapsible-menu.html
@@ -0,0 +1,56 @@
+<!-- Auto collapsible section menu, multi level -->
+<ul class="list-unstyled collapsible-sidebar">
+  {{ $currentPage := . -}}
+  {{ range (where .Site.Sections "Section" "in" site.Params.menu.section.mainSections) }}
+    {{ range .Sections.Reverse }}
+      {{ $active := in $currentPage.RelPermalink .RelPermalink }}
+      <li class="mb-1">
+        <button class="btn btn-toggle align-items-center rounded collapsed" data-bs-toggle="collapse" data-bs-target="#section-{{ md5 .Title }}" aria-expanded="{{ if $active }}true{{ else }}false{{ end }}">
+          {{ .Title }}
+        </button>
+        <div class="collapse{{ if $active }} show{{ end }}" id="section-{{ md5 .Title }}">
+          <ul class="btn-toggle-nav list-unstyled fw-normal pb-1 small">
+            {{ range .Pages }}
+              {{ if .IsNode }}
+                {{ $active := in $currentPage.RelPermalink .RelPermalink }}
+                <li class="my-1 ms-3">
+                  <button class="btn btn-toggle align-items-center rounded collapsed" data-bs-toggle="collapse" data-bs-target="#section-{{ md5 .Title }}" aria-expanded="{{ if $active }}true{{ else }}false{{ end }}">
+                    {{ .Title }}
+                  </button>
+                  <div class="collapse{{ if $active }} show{{ end }}" id="section-{{ md5 .Title }}">
+                    <ul class="btn-toggle-nav list-unstyled fw-normal pb-1 small">
+                      {{ range .Pages }}
+                        {{ if .IsNode }}
+                          {{ $active := in $currentPage.RelPermalink .RelPermalink }}
+                          <li class="my-1 ms-3">
+                            <button class="btn btn-toggle align-items-center rounded collapsed" data-bs-toggle="collapse" data-bs-target="#section-{{ md5 .Title }}" aria-expanded="{{ if $active }}true{{ else }}false{{ end }}">
+                              {{ .Title }}
+                            </button>
+                            <div class="collapse{{ if $active }} show{{ end }}" id="section-{{ md5 .Title }}">
+                              <ul class="btn-toggle-nav list-unstyled fw-normal pb-1 small">
+                                {{ range .Pages }}
+                                  {{ $active := in $currentPage.RelPermalink .RelPermalink }}
+                                  <li><a class="docs-link rounded{{ if $active }} active{{ end }}" href="{{ .Permalink }}">{{ .Title }}</a></li>
+                                {{ end }}
+                              </ul>
+                            </div>
+                          </li>
+                        {{ else }}
+                          {{ $active := in $currentPage.RelPermalink .RelPermalink }}
+                          <li><a class="docs-link rounded{{ if $active }} active{{ end }}" href="{{ .Permalink }}">{{ .Title }}</a></li>
+                        {{ end }}
+                      {{ end }}
+                    </ul>
+                  </div>
+                </li>
+              {{ else }}
+                {{ $active := in $currentPage.RelPermalink .RelPermalink }}
+                <li><a class="docs-link rounded{{ if $active }} active{{ end }}" href="{{ .Permalink }}">{{ .Title }}</a></li>
+              {{ end }}
+            {{ end }}
+          </ul>
+        </div>
+      </li>
+    {{ end }}
+  {{ end }}
+</ul>
\ No newline at end of file
diff --git a/layouts/partials/sidebar/auto-default-menu.html b/layouts/partials/sidebar/auto-default-menu.html
new file mode 100644
index 0000000..19408ec
--- /dev/null
+++ b/layouts/partials/sidebar/auto-default-menu.html
@@ -0,0 +1 @@
+<!-- Auto default section menu, single level -->
\ No newline at end of file
diff --git a/layouts/partials/sidebar/docs-menu.html b/layouts/partials/sidebar/docs-menu.html
index 299b0ef..b7baebb 100644
--- a/layouts/partials/sidebar/docs-menu.html
+++ b/layouts/partials/sidebar/docs-menu.html
@@ -1,165 +1,9 @@
 {{ if and .Site.Params.menu.section.auto .Site.Params.menu.section.collapsibleSidebar -}}
-  <!-- Auto collapsibile section menu, multi level -->
-  <ul class="list-unstyled collapsible-sidebar">
-    {{ $currentPage := . -}}
-    {{ range (where .Site.Sections "Type" "in" site.Params.mainSections) }}
-      {{ range .Sections.Reverse }}
-        {{ $active := in $currentPage.RelPermalink .RelPermalink }}
-        <li class="mb-1">
-          <button class="btn btn-toggle align-items-center rounded collapsed" data-bs-toggle="collapse" data-bs-target="#section-{{ md5 .Title }}" aria-expanded="{{ if $active }}true{{ else }}false{{ end }}">
-            {{ .Title }}
-          </button>
-          <div class="collapse{{ if $active }} show{{ end }}" id="section-{{ md5 .Title }}">
-            <ul class="btn-toggle-nav list-unstyled fw-normal pb-1 small">
-              {{ range .Pages }}
-                {{ if .IsNode }}
-                  {{ $active := in $currentPage.RelPermalink .RelPermalink }}
-                  <li class="my-1 ms-3">
-                    <button class="btn btn-toggle align-items-center rounded collapsed" data-bs-toggle="collapse" data-bs-target="#section-{{ md5 .Title }}" aria-expanded="{{ if $active }}true{{ else }}false{{ end }}">
-                      {{ .Title }}
-                    </button>
-                    <div class="collapse{{ if $active }} show{{ end }}" id="section-{{ md5 .Title }}">
-                      <ul class="btn-toggle-nav list-unstyled fw-normal pb-1 small">
-                        {{ range .Pages }}
-                          {{ if .IsNode }}
-                            {{ $active := in $currentPage.RelPermalink .RelPermalink }}
-                            <li class="my-1 ms-3">
-                              <button class="btn btn-toggle align-items-center rounded collapsed" data-bs-toggle="collapse" data-bs-target="#section-{{ md5 .Title }}" aria-expanded="{{ if $active }}true{{ else }}false{{ end }}">
-                                {{ .Title }}
-                              </button>
-                              <div class="collapse{{ if $active }} show{{ end }}" id="section-{{ md5 .Title }}">
-                                <ul class="btn-toggle-nav list-unstyled fw-normal pb-1 small">
-                                  {{ range .Pages }}
-                                    {{ $active := in $currentPage.RelPermalink .RelPermalink }}
-                                    <li><a class="docs-link rounded{{ if $active }} active{{ end }}" href="{{ .Permalink }}">{{ .Title }}</a></li>
-                                  {{ end }}
-                                </ul>
-                              </div>
-                            </li>
-                          {{ else }}
-                            {{ $active := in $currentPage.RelPermalink .RelPermalink }}
-                            <li><a class="docs-link rounded{{ if $active }} active{{ end }}" href="{{ .Permalink }}">{{ .Title }}</a></li>
-                          {{ end }}
-                        {{ end }}
-                      </ul>
-                    </div>
-                  </li>
-                {{ else }}
-                  {{ $active := in $currentPage.RelPermalink .RelPermalink }}
-                  <li><a class="docs-link rounded{{ if $active }} active{{ end }}" href="{{ .Permalink }}">{{ .Title }}</a></li>
-                {{ end }}
-              {{ end }}
-            </ul>
-          </div>
-        </li>
-      {{ end }}
-    {{ end }}
-  </ul>
+  {{ partial "sidebar/auto-collapsible-menu.html" . -}}
 {{ else if and .Site.Params.menu.section.auto (not .Site.Params.menu.section.collapsibleSidebar) -}}
-  <!-- Auto default section menu, single level -->
-
+  {{ partial "sidebar/auto-default-menu.html" . -}}
 {{ else if and (not .Site.Params.menu.section.auto) .Site.Params.menu.section.collapsibleSidebar -}}
-  <!-- Manual collapsibile section menu, multi level -->
-  <ul class="list-unstyled collapsible-sidebar">
-    {{ $currentPage := . -}}
-    {{ range $index, $element := .Site.Menus.docs -}}
-      {{- $active := or ($currentPage.IsMenuCurrent "docs" .) ($currentPage.HasMenuCurrent "docs" .) -}}
-      {{- $active = or $active (eq $currentPage.Section .Identifier) -}}
-      <li class="mb-1">
-        <button class="btn btn-toggle align-items-center rounded collapsed" data-bs-toggle="collapse" data-bs-target="#section-{{ .Identifier }}" aria-expanded="{{ if $active }}true{{ else }}false{{ end }}">
-          {{ .Name }}
-        </button>
-        {{ if .HasChildren -}}
-          <div class="collapse{{ if $active }} show{{ end }}" id="section-{{ .Identifier }}">
-            <ul class="btn-toggle-nav list-unstyled fw-normal pb-1 small">
-              {{ range .Children -}}
-                {{ if .HasChildren -}}
-                  <li class="my-1 ms-3">
-                    <button class="btn btn-toggle align-items-center rounded collapsed" data-bs-toggle="collapse" data-bs-target="#section-{{ .Identifier }}" aria-expanded="{{ if $active }}true{{ else }}false{{ end }}">
-                      {{ .Name }}
-                    </button>
-                    {{ if .HasChildren -}}
-                      <div class="collapse{{ if $active }} show{{ end }}" id="section-{{ .Identifier }}">
-                        <ul class="btn-toggle-nav list-unstyled fw-normal pb-1 small">
-                          {{ range .Children -}}
-                            {{ if .HasChildren -}}
-                              <li class="my-1 ms-3">
-                                <button class="btn btn-toggle align-items-center rounded collapsed" data-bs-toggle="collapse" data-bs-target="#section-{{ .Identifier }}" aria-expanded="{{ if $active }}true{{ else }}false{{ end }}">
-                                  {{ .Name }}
-                                </button>
-                                {{ if .HasChildren -}}
-                                  <div class="collapse{{ if $active }} show{{ end }}" id="section-{{ .Identifier }}">
-                                    <ul class="btn-toggle-nav list-unstyled fw-normal pb-1 small">
-                                    {{ range .Children -}}
-                                      {{- $active := or ($currentPage.IsMenuCurrent "docs" .) ($currentPage.HasMenuCurrent "docs" .) -}}
-                                      {{- $active = or $active (eq $currentPage.Section .Identifier) -}}
-                                      <li><a class="docs-link rounded{{ if $active }} active{{ end }}" href="{{ .URL | relURL }}">{{ .Name }}</a></li>
-                                    {{ end -}}
-                                    </ul>
-                                  </div>
-                                {{ end -}}
-                              </li>
-                            {{ else -}}
-                              {{- $active := or ($currentPage.IsMenuCurrent "docs" .) ($currentPage.HasMenuCurrent "docs" .) -}}
-                              {{- $active = or $active (eq $currentPage.Section .Identifier) -}}
-                              <li><a class="docs-link rounded{{ if $active }} active{{ end }}" href="{{ .URL | relURL }}">{{ .Name }}</a></li>
-                            {{ end -}}
-                          {{ end -}}
-                        </ul>
-                      </div>
-                    {{ end -}}
-                  </li>
-                {{ else -}}
-                  {{- $active := or ($currentPage.IsMenuCurrent "docs" .) ($currentPage.HasMenuCurrent "docs" .) -}}
-                  {{- $active = or $active (eq $currentPage.Section .Identifier) -}}
-                  <li><a class="docs-link rounded{{ if $active }} active{{ end }}" href="{{ .URL | relURL }}">{{ .Name }}</a></li>
-                {{ end -}}
-              {{ end -}}
-            </ul>
-          </div>
-        {{ end -}}
-      </li>
-    {{ end -}}
-  </ul>
+  {{ partial "sidebar/manual-collapsible-menu.html" . -}}
 {{ else if and (not .Site.Params.menu.section.auto) (not .Site.Params.menu.section.collapsibleSidebar) -}}
-  <!-- Manual default section menu, single level -->
-  {{ $currentPage := . -}}
-  {{ range .Site.Menus.docs -}}
-    <h3 class="h6 text-uppercase mb-2">{{ .Name }}</h3>
-    {{ if .HasChildren -}}
-      <ul class="list-unstyled">
-        {{ range .Children -}}
-          {{ if .HasChildren -}}
-            <h4 class="h6 text-uppercase ms-3 mt-3 mb-2">{{ .Name }}</h4>
-            {{ if .HasChildren -}}
-              <ul class="list-unstyled ms-3">
-                {{ range .Children -}}
-                  {{ if .HasChildren -}}
-                    <h5 class="h6 text-uppercase mt-2 mb-2">{{ .Name }}</h5>
-                    {{ if .HasChildren -}}
-                      <ul class="list-unstyled ms-3">
-                        {{ range .Children -}}
-                          {{- $active := or ($currentPage.IsMenuCurrent "docs" .) ($currentPage.HasMenuCurrent "docs" .) -}}
-                          {{- $active = or $active (eq $currentPage.Section .Identifier) -}}
-                          <li><a class="docs-link{{ if $active }} active{{ end }}" href="{{ .URL | relURL }}">{{ .Name }}</a></li>
-                        {{ end -}}
-                      </ul>
-                    {{ end -}}
-                  {{ else -}}
-                    {{- $active := or ($currentPage.IsMenuCurrent "docs" .) ($currentPage.HasMenuCurrent "docs" .) -}}
-                    {{- $active = or $active (eq $currentPage.Section .Identifier) -}}
-                    <li><a class="docs-link{{ if $active }} active{{ end }}" href="{{ .URL | relURL }}">{{ .Name }}</a></li>
-                  {{ end -}}
-                {{ end -}}
-              </ul>
-            {{ end -}}
-          {{ else -}}
-            {{- $active := or ($currentPage.IsMenuCurrent "docs" .) ($currentPage.HasMenuCurrent "docs" .) -}}
-            {{- $active = or $active (eq $currentPage.Section .Identifier) -}}
-            <li><a class="docs-link{{ if $active }} active{{ end }}" href="{{ .URL | relURL }}">{{ .Name }}</a></li>
-          {{ end -}}
-        {{ end -}}
-      </ul>
-    {{ end -}}
-  {{ end -}}
-{{ end -}}
+  {{ partial "sidebar/manual-default-menu.html" . -}}
+{{ end -}}
\ No newline at end of file
diff --git a/layouts/partials/sidebar/manual-collapsible-menu.html b/layouts/partials/sidebar/manual-collapsible-menu.html
new file mode 100644
index 0000000..900d3a0
--- /dev/null
+++ b/layouts/partials/sidebar/manual-collapsible-menu.html
@@ -0,0 +1,62 @@
+<!-- Manual collapsibile section menu, multi level -->
+<ul class="list-unstyled collapsible-sidebar">
+  {{ $currentPage := . -}}
+  {{ range $index, $element := .Site.Menus.docs -}}
+    {{- $active := or ($currentPage.IsMenuCurrent "docs" .) ($currentPage.HasMenuCurrent "docs" .) -}}
+    {{- $active = or $active (eq $currentPage.Section .Identifier) -}}
+    <li class="mb-1">
+      <button class="btn btn-toggle align-items-center rounded collapsed" data-bs-toggle="collapse" data-bs-target="#section-{{ .Identifier }}" aria-expanded="{{ if $active }}true{{ else }}false{{ end }}">
+        {{ .Name }}
+      </button>
+      {{ if .HasChildren -}}
+        <div class="collapse{{ if $active }} show{{ end }}" id="section-{{ .Identifier }}">
+          <ul class="btn-toggle-nav list-unstyled fw-normal pb-1 small">
+            {{ range .Children -}}
+              {{ if .HasChildren -}}
+                <li class="my-1 ms-3">
+                  <button class="btn btn-toggle align-items-center rounded collapsed" data-bs-toggle="collapse" data-bs-target="#section-{{ .Identifier }}" aria-expanded="{{ if $active }}true{{ else }}false{{ end }}">
+                    {{ .Name }}
+                  </button>
+                  {{ if .HasChildren -}}
+                    <div class="collapse{{ if $active }} show{{ end }}" id="section-{{ .Identifier }}">
+                      <ul class="btn-toggle-nav list-unstyled fw-normal pb-1 small">
+                        {{ range .Children -}}
+                          {{ if .HasChildren -}}
+                            <li class="my-1 ms-3">
+                              <button class="btn btn-toggle align-items-center rounded collapsed" data-bs-toggle="collapse" data-bs-target="#section-{{ .Identifier }}" aria-expanded="{{ if $active }}true{{ else }}false{{ end }}">
+                                {{ .Name }}
+                              </button>
+                              {{ if .HasChildren -}}
+                                <div class="collapse{{ if $active }} show{{ end }}" id="section-{{ .Identifier }}">
+                                  <ul class="btn-toggle-nav list-unstyled fw-normal pb-1 small">
+                                  {{ range .Children -}}
+                                    {{- $active := or ($currentPage.IsMenuCurrent "docs" .) ($currentPage.HasMenuCurrent "docs" .) -}}
+                                    {{- $active = or $active (eq $currentPage.Section .Identifier) -}}
+                                    <li><a class="docs-link rounded{{ if $active }} active{{ end }}" href="{{ .URL | relURL }}">{{ .Name }}</a></li>
+                                  {{ end -}}
+                                  </ul>
+                                </div>
+                              {{ end -}}
+                            </li>
+                          {{ else -}}
+                            {{- $active := or ($currentPage.IsMenuCurrent "docs" .) ($currentPage.HasMenuCurrent "docs" .) -}}
+                            {{- $active = or $active (eq $currentPage.Section .Identifier) -}}
+                            <li><a class="docs-link rounded{{ if $active }} active{{ end }}" href="{{ .URL | relURL }}">{{ .Name }}</a></li>
+                          {{ end -}}
+                        {{ end -}}
+                      </ul>
+                    </div>
+                  {{ end -}}
+                </li>
+              {{ else -}}
+                {{- $active := or ($currentPage.IsMenuCurrent "docs" .) ($currentPage.HasMenuCurrent "docs" .) -}}
+                {{- $active = or $active (eq $currentPage.Section .Identifier) -}}
+                <li><a class="docs-link rounded{{ if $active }} active{{ end }}" href="{{ .URL | relURL }}">{{ .Name }}</a></li>
+              {{ end -}}
+            {{ end -}}
+          </ul>
+        </div>
+      {{ end -}}
+    </li>
+  {{ end -}}
+</ul>
\ No newline at end of file
diff --git a/layouts/partials/sidebar/manual-default-menu.html b/layouts/partials/sidebar/manual-default-menu.html
new file mode 100644
index 0000000..554b1e3
--- /dev/null
+++ b/layouts/partials/sidebar/manual-default-menu.html
@@ -0,0 +1,40 @@
+<!-- Manual default section menu, single level -->
+{{ $currentPage := . -}}
+{{ range .Site.Menus.docs -}}
+  <h3 class="h6 text-uppercase mb-2">{{ .Name }}</h3>
+  {{ if .HasChildren -}}
+    <ul class="list-unstyled">
+      {{ range .Children -}}
+        {{ if .HasChildren -}}
+          <h4 class="h6 text-uppercase ms-3 mt-3 mb-2">{{ .Name }}</h4>
+          {{ if .HasChildren -}}
+            <ul class="list-unstyled ms-3">
+              {{ range .Children -}}
+                {{ if .HasChildren -}}
+                  <h5 class="h6 text-uppercase mt-2 mb-2">{{ .Name }}</h5>
+                  {{ if .HasChildren -}}
+                    <ul class="list-unstyled ms-3">
+                      {{ range .Children -}}
+                        {{- $active := or ($currentPage.IsMenuCurrent "docs" .) ($currentPage.HasMenuCurrent "docs" .) -}}
+                        {{- $active = or $active (eq $currentPage.Section .Identifier) -}}
+                        <li><a class="docs-link{{ if $active }} active{{ end }}" href="{{ .URL | relURL }}">{{ .Name }}</a></li>
+                      {{ end -}}
+                    </ul>
+                  {{ end -}}
+                {{ else -}}
+                  {{- $active := or ($currentPage.IsMenuCurrent "docs" .) ($currentPage.HasMenuCurrent "docs" .) -}}
+                  {{- $active = or $active (eq $currentPage.Section .Identifier) -}}
+                  <li><a class="docs-link{{ if $active }} active{{ end }}" href="{{ .URL | relURL }}">{{ .Name }}</a></li>
+                {{ end -}}
+              {{ end -}}
+            </ul>
+          {{ end -}}
+        {{ else -}}
+          {{- $active := or ($currentPage.IsMenuCurrent "docs" .) ($currentPage.HasMenuCurrent "docs" .) -}}
+          {{- $active = or $active (eq $currentPage.Section .Identifier) -}}
+          <li><a class="docs-link{{ if $active }} active{{ end }}" href="{{ .URL | relURL }}">{{ .Name }}</a></li>
+        {{ end -}}
+      {{ end -}}
+    </ul>
+  {{ end -}}
+{{ end -}}
\ No newline at end of file