Skip to content

Commit

Permalink
feat: update Headroom implementation to support recent Hugo versions (#…
Browse files Browse the repository at this point in the history
…2950)

It has been reported that recent Hugo versions broke user's configuration of Headroom JS via the `header.on_scroll` option.

With this PR, Headroom JS configuration is working again.

Fixes #2935
  • Loading branch information
Agos95 authored Jul 30, 2023
1 parent 92cc5a2 commit 1c09422
Showing 1 changed file with 35 additions and 4 deletions.
39 changes: 35 additions & 4 deletions modules/wowchemy/layouts/partials/site_js.html
Original file line number Diff line number Diff line change
Expand Up @@ -126,12 +126,43 @@
<script src="{{ $js_algolia_search.RelPermalink }}" type="module"></script>
{{ end }}

{{/* Page Data */}}
{{ $default_headroom := not (.IsHome | or (eq .Type "book")) }}
{{ $use_headroom := cond (isset $.Params "header.on_scroll") (eq $.Params.header.on_scroll "disappear") (default $default_headroom) }}
{{/* Headroom */}}
{{/*
Headroom JS enables hiding the header on scrolling down and showing it on scrolling up.
This is especially valuable on smaller displays such as mobile devices.
This option can be set in the following ways:
- globally, in the site's 'params.yaml':
```
header:
on_scroll: "disappear" | "sticky"
```
- per page, in the page front matter:
```
header:
on_scroll: "disappear" | "sticky"
```
When the header is set to disappear, the Headroom JS is loaded.

By default, the header is sticky in the homepage and in the book layout,
and it disappears when scrolling in all other pages.
*/}}

{{/* By default don't use Headroom in the homepage and book layout */}}
{{ $use_headroom := not (.IsHome | or (eq .Type "book")) }}

{{/* Check for the global site parameter `header.on_scroll` */}}
{{ if (isset site.Params.header "on_scroll") }}
{{ $use_headroom = eq site.Params.header.on_scroll "disappear" }}
{{ end }}

{{/* Check for the page parameter `header.on_scroll` */}}
{{ if (isset $.Params.header "on_scroll") }}
{{ $use_headroom = eq $.Params.header.on_scroll "disappear" }}
{{ end }}

{{/* Output `use_headroom` variable for Headroom initialization in Wowchemy JS */}}
{{ printf "<script id=\"page-data\" type=\"application/json\">%s</script>" (dict "use_headroom" $use_headroom | jsonify) | safeHTML}}

{{/* Headroom */}}
{{ if $use_headroom }}
{{ $headroom := resources.Get "js/wowchemy-headroom.js" | js.Build (dict "format" "esm" "minify" true) }}
{{- if hugo.IsProduction -}}
Expand Down

1 comment on commit 1c09422

@Konafets
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@Agos95 @gcushen This PR introduces an bug:

hugo server --panicOnWarning --renderStaticToDisk -F --port 8081 --bind 0.0.0.0
Watching for changes in /Users/Konafets/Sites/wowchemy-hugo-themes/{modules,starters}
Watching for config changes in /Users/Konafets/Sites/wowchemy-hugo-themes/starters/academic/config/_default
Start building sites …
hugo v0.115.4+extended darwin/arm64 BuildDate=unknown

WARN  calling IsSet with unsupported type "invalid" (<nil>) will always return false.
Built in 266 ms
Error: error building site: render: failed to render pages: render of "page" failed: "/Users/Konafets/Sites/wowchemy-hugo-themes/modules/wowchemy/layouts/_default/baseof.html:72:5": execute of template failed: template: project/single.html:72:5: executing "project/single.html" at <partial "site_js" .>: error calling partial: "/Users/Konafets/Sites/wowchemy-hugo-themes/modules/wowchemy/layouts/partials/site_js.html:159:7": execute of template failed: template: partials/site_js.html:159:7: executing "partials/site_js.html" at <isset $.Params.header "on_scroll">: error calling isset: calling IsSet with unsupported type "invalid" (<nil>) will always return false.

by adding this snipped twice (and the 2nd one is incorrect as it uses $.Params.header instead of site.Params.header)

{{/* Check for the global site parameter `header.on_scroll` */}}
{{ if (isset site.Params.header "on_scroll") }}
  {{ $use_headroom = eq site.Params.header.on_scroll "disappear" }}
{{ end }}

{{/* Check for the page parameter `header.on_scroll` */}}
{{ if (isset $.Params.header "on_scroll") }}
  {{ $use_headroom = eq $.Params.header.on_scroll "disappear" }}
{{ end }}

Please sign in to comment.