diff --git a/static/js/main.js b/static/js/main.js index a05a3953c..f116ee11d 100644 --- a/static/js/main.js +++ b/static/js/main.js @@ -142,10 +142,10 @@ this[globalName] = mainExports; } } -})({"4iZu9":[function(require,module,exports) { +})({"40yvg":[function(require,module,exports) { var global = arguments[3]; var HMR_HOST = null; -var HMR_PORT = 62230; +var HMR_PORT = 52109; var HMR_SECURE = false; var HMR_ENV_HASH = "42036d7a98ade5a7"; module.bundle.HMR_BUNDLE_ID = "2a29ff2311f401cb"; @@ -1107,50 +1107,38 @@ const addCopyButtons = (clipboard)=>{ pre.appendChild(button); }); }; -const addAnchorLinks = () => { +const addAnchorLinks = ()=>{ const elementsToProcess = document.querySelectorAll(".content h1, .content h2, .content h3, .content h4, .content tr"); - - elementsToProcess.forEach(element => { + elementsToProcess.forEach((element)=>{ let uniqueId; - if (element.tagName.toLowerCase() === 'tr') { - let closestHeading = element.closest('table').previousElementSibling; - while(closestHeading && !closestHeading.matches('h1, h2, h3, h4')) { - closestHeading = closestHeading.previousElementSibling; - } - const firstColumnName = element.cells[0].textContent.trim().toLowerCase().replace(/[^\w\s-]/g, '').replace(/\s+/g, '-'); - + if (element.tagName.toLowerCase() === "tr") { + let closestHeading = element.closest("table").previousElementSibling; + while(closestHeading && !closestHeading.matches("h1, h2, h3, h4"))closestHeading = closestHeading.previousElementSibling; + const firstColumnName = element.cells[0].textContent.trim().toLowerCase().replace(/[^\w\s-]/g, "").replace(/\s+/g, "-"); if (closestHeading) { - const headingId = closestHeading.getAttribute('id'); + const headingId = closestHeading.getAttribute("id"); uniqueId = `${headingId}-${firstColumnName}`; - } else { - uniqueId = firstColumnName; - } - } else { - uniqueId = element.textContent.trim().toLowerCase().replace(/[^\w\s-]/g, '').replace(/\s+/g, '-'); - } - + } else uniqueId = firstColumnName; + } else uniqueId = element.textContent.trim().toLowerCase().replace(/[^\w\s-]/g, "").replace(/\s+/g, "-"); element.classList.add("heading-anchor"); - element.setAttribute('id', uniqueId); - let anchor = document.createElement('a'); - anchor.className = 'anchor-link'; - anchor.href = '#' + uniqueId; + element.setAttribute("id", uniqueId); + let anchor = document.createElement("a"); + anchor.className = "anchor-link"; + anchor.href = "#" + uniqueId; anchor.innerHTML = ''; element.append(anchor); - anchor.addEventListener("click", (e) => { + anchor.addEventListener("click", (e)=>{ e.preventDefault(); window.location = anchor.href; - let targetId = anchor.getAttribute('href').substring(1); + let targetId = anchor.getAttribute("href").substring(1); let targetElement = document.getElementById(targetId); - if (targetElement) { - targetElement.scrollIntoView({ - behavior: 'smooth', - block: 'start' - }) - } - - }) - }) -} + if (targetElement) targetElement.scrollIntoView({ + behavior: "smooth", + block: "start" + }); + }); + }); +}; function removeExpiredEvents() { let events = document.querySelectorAll(".community-highlight .carousel-cell"); let eventsNumber = events.length; @@ -1249,17 +1237,22 @@ class multiTabBlockHandler { constructor(nodes, tabClass, activeValue, parentCallback){ this.tabClass = tabClass; this.parentCallback = parentCallback; - // this.active = 0 this.nodes = Array.from(nodes); this.langs = this.nodes.map((k)=>{ return k.dataset.title; }); this.active = this.langs.indexOf(activeValue); - this.active = this.active > 0 ? this.active : 0; + if (tabClass != "spin-version") this.active = this.active > 0 ? this.active : 0; + else this.active = this.active > 0 ? this.active : this.nodes.length - 1; this.tabs = list("ul", codeblockLanguageTab, null, this.ChildEventHandler.bind(this)); this.el = el("div.tabs.is-boxed", this.tabs); + // If the tabClass is `spin-version` reverse the order of the list + if (tabClass === "spin-version") setStyle(this.tabs, { + display: "flex", + "flex-direction": "row-reverse" + }); this.tabs.update(this.langs, { - active: 0 + active: this.active }); this.updateTabContent(this.active); } @@ -1496,5 +1489,5 @@ function createFeedbackElement(handle) { mount(handle, feedback); } -},{"@parcel/transformer-js/src/esmodule-helpers.js":"j7FRh"}]},["4iZu9","e9rxa"], "e9rxa", "parcelRequire252c") +},{"@parcel/transformer-js/src/esmodule-helpers.js":"j7FRh"}]},["40yvg","e9rxa"], "e9rxa", "parcelRequire252c") diff --git a/static/js/src/modules/multiTab.js b/static/js/src/modules/multiTab.js index 8b69f1601..b18c280e2 100644 --- a/static/js/src/modules/multiTab.js +++ b/static/js/src/modules/multiTab.js @@ -26,15 +26,23 @@ class multiTabBlockHandler { constructor(nodes, tabClass, activeValue, parentCallback) { this.tabClass = tabClass this.parentCallback = parentCallback - // this.active = 0 this.nodes = Array.from(nodes) this.langs = this.nodes.map(k => { return k.dataset.title }) this.active = this.langs.indexOf(activeValue) - this.active = this.active > 0 ? this.active : 0 + if (tabClass != "spin-version") { + this.active = this.active > 0 ? this.active : 0 + } else { + this.active = this.active > 0 ? this.active : this.nodes.length - 1 + } this.tabs = list("ul", codeblockLanguageTab, null, this.ChildEventHandler.bind(this)) this.el = el("div.tabs.is-boxed", this.tabs) - this.tabs.update(this.langs, { active: 0 }) + // If the tabClass is `spin-version` reverse the order of the list + if (tabClass === "spin-version") { + setStyle(this.tabs, { display: "flex", "flex-direction": "row-reverse" }) + } + + this.tabs.update(this.langs, { active: this.active }) this.updateTabContent(this.active) } ChildEventHandler(data, element) { @@ -67,7 +75,7 @@ class multiTabContentHandler { }) // If no OS preference set, try detect the user OS - if (this.selectedTab.os == null ) { + if (this.selectedTab.os == null) { this.selectedTab.os = detectOS() } this.handler = [] @@ -147,7 +155,7 @@ function filterMultitabQuery() { }).reduce((obj, key) => { obj[key.replace("multitab_", "")] = query[key]; return obj; - }, {}); + }, {}); return multitabQuery }