lwd/hugo-theme-relearn
1
0
Fork 0
mirror of https://github.com/McShelby/hugo-theme-relearn synced 2025-04-30 06:22:03 +08:00
Code Issues Packages Projects Releases Wiki Activity

switcher: reset selection after browser back navigation #1065

Browse Source
This commit is contained in:
Sören Weber 2025-03-20 21:29:05 +01:00
parent 3ccc8f777f
commit 7a2667a7d3
No known key found for this signature in database
GPG Key ID: BEC6D55545451B6D
8 changed files with 65 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

40
assets/js/theme.js
View File

@ -1444,6 +1444,42 @@ function scrollToPositions() {
}
}
function handleHistoryClearer() {
document.querySelectorAll('.R-historyclearer button').forEach(function (select) {
select.addEventListener('click', function (event) {
clearHistory();
});
});
}
function handleLanguageSwitcher() {
document.querySelectorAll('.R-languageswitcher select').forEach(function (select) {
select.addEventListener('change', function (event) {
const url = this.options[`R-select-language-${this.value}`].dataset.url;
this.value = this.querySelector('[data-selected]')?.value ?? select.value;
window.location = url;
});
});
}
function handleVariantSwitcher() {
document.querySelectorAll('.R-variantswitcher select').forEach(function (select) {
select.addEventListener('change', function (event) {
window.relearn.changeVariant(this.value);
});
});
}
function handleVersionSwitcher() {
document.querySelectorAll('.R-versionswitcher select').forEach(function (select) {
select.addEventListener('change', function (event) {
const url = (this.options[`R-select-version-${this.value}`].dataset.abs == 'true' ? '' : window.relearn.relBaseUri) + this.options[`R-select-version-${this.value}`].dataset.uri + window.relearn.path;
this.value = this.querySelector('[data-selected]')?.value ?? select.value;
window.location = url;
});
});
}
window.addEventListener('popstate', function (event) {
scrollToPositions();
});
@ -1757,6 +1793,10 @@ function ready(fn) {
ready(function () {
initArrowVerticalNav();
initArrowHorizontalNav();
handleHistoryClearer();
handleLanguageSwitcher();
handleVariantSwitcher();
handleVersionSwitcher();
initMermaid();
initOpenapi();
initMenuScrollbar();

32
docs/assets/js/variant.js
View File

@ -45,29 +45,29 @@ var variants = {
addCustomVariantOption: function () {
var customvariant = window.localStorage.getItem(window.relearn.absBaseUri + '/customvariant');
var select = document.querySelector('#R-select-variant');
if (!customvariant || !select) {
if (!customvariant ) {
return;
}
var option = document.querySelector('#R-select-variant-' + this.customvariantname);
if (!option) {
option = document.createElement('option');
option.id = 'R-select-variant-' + this.customvariantname;
option.value = this.customvariantname;
option.text = this.customvariantname.replace(/-/g, ' ').replace(/\w\S*/g, function (w) {
return w.replace(/^\w/g, function (c) {
return c.toUpperCase();
document.querySelectorAll('.R-variantswitcher select').forEach((select) => {
var option = select.options[`R-select-variant-${this.customvariantname}`];
if (!option) {
option = document.createElement('option');
option.id = `R-select-variant-${this.customvariantname}`;
option.value = this.customvariantname;
option.text = this.customvariantname.replace(/-/g, ' ').replace(/\w\S*/g, function (w) {
return w.replace(/^\w/g, function (c) {
return c.toUpperCase();
});
});
});
select.appendChild(option);
}
select.appendChild(option);
}
});
},
removeCustomVariantOption: function () {
var option = document.querySelector('#R-select-variant-' + this.customvariantname);
if (option) {
document.querySelectorAll(`.R-variantswitcher option[value=${this.customvariantname}]`).forEach((option) => {
option.remove();
}
});
},
addCustomVariantStyles: function () {

2
layouts/partials/sidebar/element/historyclearer.html
View File

@ -7,7 +7,7 @@
<i class="{{ $icon }}"></i>
<span>&nbsp;</span>
<div class="control-style">
<button onclick="clearHistory();">{{ T "Clear-History" }}</button>
<button>{{ T "Clear-History" }}</button>
</div>
<div class="clear"></div>
</div>

4
layouts/partials/sidebar/element/languageswitcher.html
View File

@ -8,10 +8,10 @@
<span>&nbsp;</span>
<div class="control-style">
<label class="a11y-only" for="R-select-language">{{ T "Language" }}</label>
<select id="R-select-language" onchange="location = this.querySelector( `#R-select-language-${this.value}` ).dataset.url;">
<select id="R-select-language">
{{- $pageLang := .page.Language.Lang }}
{{- range .page.AllTranslations }}
<option id="R-select-language-{{ .Language.Lang }}" value="{{ .Language.Lang }}" data-url="{{ partial "permalink.gotmpl" (dict "to" .) }}" lang="{{ .Language.LanguageCode }}"{{ if eq $pageLang .Language.Lang }} selected{{ end }}>{{ .Language.LanguageName }}</option>
<option id="R-select-language-{{ .Language.Lang }}" value="{{ .Language.Lang }}" data-url="{{ partial "permalink.gotmpl" (dict "to" .) }}" lang="{{ .Language.LanguageCode }}"{{ if eq $pageLang .Language.Lang }} selected data-selected{{ end }}>{{ .Language.LanguageName }}</option>
{{- end }}
</select>
</div>

2
layouts/partials/sidebar/element/variantswitcher.html
View File

@ -9,7 +9,7 @@
<span>&nbsp;</span>
<div class="control-style">
<label class="a11y-only" for="R-select-variant">{{ T "Theme" }}</label>
<select id="R-select-variant" onchange="window.relearn.changeVariant( this.value );">
<select id="R-select-variant">
{{- $firstvariant := true }}
{{- range $themevariants }}
{{- $themevariant := . }}

7
layouts/partials/sidebar/element/versionswitcher.html
View File

@ -10,12 +10,9 @@
<span>&nbsp;</span>
<div class="control-style">
<label class="a11y-only" for="R-select-version">{{ T "Version" }}</label>
<select id="R-select-version" onchange="location = this.querySelector( `#R-select-version-${this.value}` ).dataset.abs == 'true' ?
this.querySelector( `#R-select-version-${this.value}` ).dataset.uri + window.relearn.path :
window.relearn.relBaseUri + this.querySelector( `#R-select-version-${this.value}` ).dataset.uri + window.relearn.path;"
>
<select id="R-select-version">
{{- range $versions }}
<option id="R-select-version-{{ .identifier | anchorize }}" value="{{ .identifier | anchorize }}" data-identifier="{{ .identifier }}" data-abs="{{ .isAbs }}" data-uri="{{ .baseURL }}"{{ if eq $pageVersion .identifier }} selected{{ end }}>{{ .title }}</option>
<option id="R-select-version-{{ .identifier | anchorize }}" value="{{ .identifier | anchorize }}" data-identifier="{{ .identifier }}" data-abs="{{ .isAbs }}" data-uri="{{ .baseURL }}"{{ if eq $pageVersion .identifier }} selected data-selected{{ end }}>{{ .title }}</option>
{{- end }}
</select>
</div>

6
layouts/partials/stylesheet.html
View File

@ -153,14 +153,12 @@
document.documentElement.dataset.rThemeVariant = variant;
if (oldVariant != variant) {
document.dispatchEvent( new CustomEvent('themeVariantLoaded', { detail: { variant, oldVariant } }) );
window.relearn.markVariant();
}
}
window.relearn.markVariant = function() {
var variant = window.localStorage.getItem(window.relearn.absBaseUri + "/variant");
var select = document.querySelector("#R-select-variant");
if (select) {
select.value = variant;
}
document.querySelectorAll(".R-variantswitcher select").forEach((select) => {select.value = variant;});
}
window.relearn.initVariant = function() {
var variant = window.localStorage.getItem(window.relearn.absBaseUri + "/variant") ?? "";

2
layouts/partials/version.txt
View File

@ -1 +1 @@
7.5.0+a05b2124652293b1be3742f26aa3913861f956de
7.5.0+3ccc8f777f8dd35f750a00ca986f9db808548306