This commit is contained in:
Cadence Ember 2024-06-05 21:53:03 +12:00
commit 47d92d3a37
3 changed files with 79 additions and 4 deletions

View file

@ -200,10 +200,11 @@
`(script (@ (type "module") (src ,(get-static-url "search-suggestions.js"))))
"")
(script (@ (type "module") (src ,(get-static-url "countdown.js"))))
(script (@ (defer) (src ,(get-static-url "tabs.js"))))
(link (@ (rel "icon") (href ,(u (λ (v) (config-true? 'strict_proxy))
(λ (v) (u-proxy-url v))
(head-data^-icon-url head-data))))))
(body (@ (class ,(head-data^-body-class head-data)))
(body (@ (class ,(head-data^-body-class head-data) " bw-tabs-nojs"))
,(let ([extension-eligible?
(cond/var
[(not req) #f]

View file

@ -202,11 +202,11 @@ figcaption, .lightbox-caption, .thumbcaption {
padding: 0;
}
/* show tabs always */
.wds-tabs__wrapper {
/* show tabs if tabs.js isn't loaded */
.bw-tabs-nojs .wds-tabs__wrapper {
display: none;
}
.wds-tab__content {
.bw-tabs-nojs .wds-tab__content {
display: block;
}

74
static/tabs.js Normal file
View file

@ -0,0 +1,74 @@
"use strict";
let tabToFind = location.hash.length > 1 ? location.hash.substring(1) : null;
for (let tabber of document.body.querySelectorAll(".wds-tabber")) {
let [tabs, contents] = getTabs(tabber);
for (let i in tabs) {
let tab = tabs[i];
let content = contents[i];
tab.addEventListener("click", function(e) {
setCurrentTab(tabber, tab, content);
e.preventDefault();
});
if (tab.dataset.hash === tabToFind) {
setCurrentTab(tabber, tab, content);
}
}
}
document.body.classList.remove("bw-tabs-nojs");
function getTabs(tabber) {
let tabs = [];
let contents = [];
for (let i of tabber.querySelector(".wds-tabs__wrapper").querySelectorAll(".wds-tabs__tab")) {
tabs.push(i);
}
for (let i of tabber.children) {
if (!i.matches(".wds-tab__content")) {
continue;
}
contents.push(i);
}
return [tabs, contents];
}
function getCurrentTab(tabber) {
let tab = null;
let content = null;
tab = tabber.querySelector(".wds-tabs__wrapper").querySelector(".wds-tabs__tab.wds-is-current");
for (let i of tabber.children) {
if (!i.matches(".wds-tab__content.wds-is-current")) {
continue;
}
content = i;
break;
}
return [tab, content];
}
function setCurrentTab(tabber, tab, content) {
let [currentTab, currentContent] = getCurrentTab(tabber);
if (currentTab) {
currentTab.classList.remove("wds-is-current");
}
if (currentContent) {
currentContent.classList.remove("wds-is-current");
}
tab.classList.add("wds-is-current");
content.classList.add("wds-is-current");
if (tab.dataset.hash) {
let fragment = "#" + tab.dataset.hash;
if (location.hash !== fragment) {
history.pushState(null, "", fragment);
}
}
}