Use .main-content[data-page-type] instead of adding data type to ever…

…y tab
Kotlin · Oct 17, 2023 · 011b09d · 011b09d
1 parent 2a1eec3
commit 011b09d
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 23 deletions.
diff --git a/plugins/base/src/main/kotlin/renderers/html/HtmlRenderer.kt b/plugins/base/src/main/kotlin/renderers/html/HtmlRenderer.kt
@@ -163,7 +163,6 @@ public open class HtmlRenderer(
                     contentTabs.forEachIndexed { index, contentTab ->
                         button(classes = "section-tab") {
                             if (index == 0) attributes["data-active"] = ""
-                            attributes["data-type"] = pageContext.getDocumentableType() ?: ""
                             attributes[TOGGLEABLE_CONTENT_TYPE_ATTR] =
                                 contentTab.tabbedContentTypes.joinToString(",") { it.toHtmlAttribute() }
                             text(contentTab.text)

diff --git a/plugins/base/src/main/resources/dokka/scripts/platform-content-handler.js b/plugins/base/src/main/resources/dokka/scripts/platform-content-handler.js
@@ -175,22 +175,26 @@ function handleAnchor() {
 }
 
 function initTabs() {
-    document.querySelectorAll("div[tabs-section]").forEach(element => {
-        showCorrespondingTabBody(element)
-        element.addEventListener('click', (event) => toggleSectionsEventHandler(event))
+    // we could have only a single type of data - classlike or package
+    const mainContent = document.querySelector('.main-content');
+    const type = mainContent ? mainContent.getAttribute("data-page-type") : null;
+    const localStorageKey = "active-tab-" + type;
+    document.querySelectorAll('div[tabs-section]').forEach(element => {
+        showCorrespondingTabBody(element);
+        element.addEventListener('click', ({target}) => {
+            const togglable = target ? target.getAttribute("data-togglable") : null;
+            if (!togglable) return;
+
+            localStorage.setItem(localStorageKey, JSON.stringify(togglable));
+            toggleSections(target);
+        });
     });
 
-    initTabsForType("classlike");
-    initTabsForType("package");
-}
-
-function initTabsForType(type) {
-    const cached = localStorage.getItem("active-tab-" + type);
+    const cached = localStorage.getItem(localStorageKey);
     if (!cached) return;
 
-    const parsed = JSON.parse(cached);
     const tab = document.querySelector(
-        'div[tabs-section] > button[data-togglable="' + parsed + '"][data-type="' + type + '"]'
+        'div[tabs-section] > button[data-togglable="' + JSON.parse(cached) + '"]'
     );
     if (!tab) return;
 
@@ -298,17 +302,6 @@ function toggleSections(target) {
     activateTabsBody("tabs-section-body")
 }
 
-function toggleSectionsEventHandler(evt) {
-    const togglable = evt.target.getAttribute("data-togglable");
-    if (!togglable) return;
-
-    const type = evt.target.getAttribute("data-type");
-    if (!type) return;
-
-    localStorage.setItem('active-tab-' + type, JSON.stringify(togglable));
-    toggleSections(evt.target);
-}
-
 function togglePlatformDependent(e, container) {
     let target = e.target
     if (target.tagName != 'BUTTON') return;