From 0e6303e58973cff4d5fbc5d9e0441829a659ffb4 Mon Sep 17 00:00:00 2001 From: Liliana Sanfilippo <liliana.sanfilippo@uni-bielefeld.de> Date: Mon, 23 Sep 2024 20:33:19 +0200 Subject: [PATCH] eng works again --- src/utils/openThem.ts | 90 ++++++++++++++++++++----------------------- 1 file changed, 42 insertions(+), 48 deletions(-) diff --git a/src/utils/openThem.ts b/src/utils/openThem.ts index 02ed3add..e1ebd03b 100644 --- a/src/utils/openThem.ts +++ b/src/utils/openThem.ts @@ -1,50 +1,44 @@ -export function openThem({ it, scrollToId }: { it: string; scrollToId?: string }) { - const gotoandopen = (_event: React.MouseEvent<HTMLElement, MouseEvent>) => { - updateTabs(it, scrollToId); - - // Update der URL - const newUrl = `?tab=${it}`; - window.history.pushState({ tab: it }, '', newUrl); - }; +export function openThem({it, scrollToId}: {it: string, scrollToId?: string}) { + const gotoandopen = (_event: React.MouseEvent<HTMLElement, MouseEvent>) => { + console.log("it classname: " + document.getElementById(it)?.className); + console.log("it: " + it); + + let contenttabid = "tab-" + it; + let parent = "parent-" + it; + console.log("we want to open " + it + " and " + contenttabid); + let sideitems = document.getElementsByClassName("sideitem"); + let subtabs = document.getElementsByClassName("sidesubtab"); + let contenttabs = document.getElementsByClassName("enginneeringtab"); + + // Verstecke alle Subtabs und Content-Tabs + for (let i = 0; i < subtabs.length; i++) { + (subtabs[i] as HTMLElement).style.display = "none"; + console.log("Hiding sidebar subtab..."); + } + for (let i = 0; i < contenttabs.length; i++) { + (contenttabs[i] as HTMLElement).style.display = "none"; + console.log("Hiding content tab..."); + } + for (let i = 0; i < sideitems.length; i++) { + (sideitems[i] as HTMLElement)!.classList.remove("active-sideitem"); + console.log("Hiding sidebar subtab..."); + } + + // Zeige den aktuellen Tab und markiere das entsprechende Sidebar-Item + document.getElementById(it)!.style.display = "block"; + document.getElementById(parent)!.classList.add("active-sideitem"); + document.getElementById(contenttabid)!.style.display = "block"; - return gotoandopen; -} - -function updateTabs(it: string, scrollToId?: string) { - let contenttabid = "tab-" + it; - let parent = "parent-" + it; - - // Verstecke alle Subtabs und Content-Tabs - const subtabs = document.getElementsByClassName("sidesubtab"); - const contenttabs = document.getElementsByClassName("enginneeringtab"); - const sideitems = document.getElementsByClassName("sideitem"); - - for (let i = 0; i < subtabs.length; i++) { - (subtabs[i] as HTMLElement).style.display = "none"; - } - for (let i = 0; i < contenttabs.length; i++) { - (contenttabs[i] as HTMLElement).style.display = "none"; - } - for (let i = 0; i < sideitems.length; i++) { - (sideitems[i] as HTMLElement)!.classList.remove("active-sideitem"); - } - - // Zeige den aktuellen Tab und markiere das entsprechende Sidebar-Item - document.getElementById(it)!.style.display = "block"; - document.getElementById(parent)!.classList.add("active-sideitem"); - document.getElementById(contenttabid)!.style.display = "block"; - - // Scrolle zu der angegebenen ID, falls vorhanden - if (scrollToId && document.getElementById(scrollToId)) { - document.getElementById(scrollToId)!.scrollIntoView({ behavior: "smooth" }); - console.log(`Scroll to ${scrollToId}`) - } -} - -// Füge einen Event Listener für `popstate` hinzu -window.addEventListener('popstate', (event) => { - if (event.state) { - const tab = event.state.tab; - updateTabs(tab); + // Update der URL + const newUrl = `?tab=${it}`; + window.history.pushState({ tab: it }, '', newUrl); + + // Scrolle zu der angegebenen ID, falls vorhanden + if (scrollToId && document.getElementById(scrollToId)) { + console.log("Scrolling to: " + scrollToId); + document.getElementById(scrollToId)!.scrollIntoView({ behavior: "smooth" }); + } + }; + return gotoandopen; } -}); + \ No newline at end of file -- GitLab