clickable h2s

ManApart · Dec 13, 2023 · be2677d · be2677d
1 parent 40f99b0
commit be2677d
Show file tree

Hide file tree

Showing 6 changed files with 34 additions and 28 deletions.
diff --git a/src/jsMain/kotlin/StarfieldEye.kt b/src/jsMain/kotlin/StarfieldEye.kt
@@ -90,19 +90,15 @@ fun doRouting() {
 fun doRouting(windowHash: String) {
     pollHook = {}
     keyPressedHook = {}
+    val section = windowHash.split("/").takeIf { it.size == 2 }?.last()
+    section?.let { println("Section: $it") }
     when {
         windowHash.startsWith("#about") -> {
-            val parts = windowHash.split("/")
-            println(parts)
-            if (parts.size == 2) {
-                aboutView(parts.last())
-            } else {
-                aboutView()
-            }
+            aboutView(section)
         }
 
         windowHash.startsWith("#manual") -> {
-            manualView()
+            manualView(section)
         }
 
         windowHash.startsWith("#catalogue") -> {
@@ -118,7 +114,7 @@ fun doRouting(windowHash: String) {
         }
 
         windowHash.startsWith("#dock") -> {
-            dockView()
+            dockView(section)
         }
 
         windowHash.startsWith("#quests") -> {
@@ -144,12 +140,14 @@ fun doRouting(windowHash: String) {
 
         else -> renderGalaxy()
     }
+    section?.let { el<HTMLElement?>(it)?.scrollIntoView() }
 }
 
-fun updateUrl(path: String) {
+fun updateUrl(path: String, section: String? = null) {
     val pathName = path.split("/").first().capitalize()
-    if (!window.location.href.endsWith("#$path")) {
-        window.history.pushState(null, "", "#$path")
+    val newPath = path + (section?.let { "/$it" } ?: "")
+    if (!window.location.href.endsWith("#$newPath")) {
+        window.history.pushState(null, "", "#$newPath")
     }
     document.title = "The Eye: $pathName"
 }

diff --git a/src/jsMain/kotlin/components/Misc.kt b/src/jsMain/kotlin/components/Misc.kt
@@ -1,25 +1,18 @@
 package components
 
-import kotlinx.browser.window
 import kotlinx.html.TagConsumer
 import kotlinx.html.id
 import kotlinx.html.js.a
 import kotlinx.html.js.h2
 import org.w3c.dom.HTMLElement
-import kotlin.math.max
 
 fun TagConsumer<HTMLElement>.wikiLink(page: String) {
     a("https://starfieldwiki.net/wiki/Starfield:$page", target = "_blank", classes = "a-button") {
         +"Wiki"
     }
 }
 
-fun TagConsumer<HTMLElement>.linkableH2(text: String) {
-    val page = window.location.href.let {url ->
-        val start = url.indexOf("#") + 1
-        val end = url.indexOf( "/", start).takeIf { it > 0 } ?: url.length
-        url.substring(start, end)
-    }
+fun TagConsumer<HTMLElement>.linkableH2(page: String, text: String) {
     h2 {
         val idText = text.replace(" ", "_").lowercase()
         id = idText

diff --git a/src/jsMain/kotlin/views/AboutView.kt b/src/jsMain/kotlin/views/AboutView.kt
@@ -1,15 +1,13 @@
 package views
 
 import components.linkableH2
-import el
 import kotlinx.html.*
 import org.w3c.dom.HTMLElement
 import replaceElement
 import updateUrl
 
 fun aboutView(section: String? = null) {
-    val url = "about" + (section?.let { "/$it" } ?: "")
-    updateUrl(url)
+    updateUrl("about", section)
     replaceElement {
         div {
             id = "about-view"
@@ -131,5 +129,8 @@ fun aboutView(section: String? = null) {
             }
         }
     }
-    section?.let { el<HTMLElement?>(it)?.scrollIntoView() }
+}
+
+private fun TagConsumer<HTMLElement>.linkableH2(text: String) {
+    linkableH2("about", text)
 }
diff --git a/src/jsMain/kotlin/views/DockView.kt b/src/jsMain/kotlin/views/DockView.kt
@@ -29,8 +29,8 @@ import pollHook
 import replaceElement
 import updateUrl
 
-fun dockView() {
-    updateUrl("dock")
+fun dockView(section: String? = null) {
+    updateUrl("dock", section)
     replaceElement {
         div {
             id = "dock-view"
@@ -311,4 +311,9 @@ private fun receivePoll(success: Boolean) {
 
 private fun setStatusDiv(message: String) {
     el<HTMLDivElement?>("dock-status")?.textContent = message
+}
+
+
+private fun TagConsumer<HTMLElement>.linkableH2(text: String) {
+    linkableH2("dock", text)
 }
diff --git a/src/jsMain/kotlin/views/ManualView.kt b/src/jsMain/kotlin/views/ManualView.kt
@@ -2,11 +2,12 @@ package views
 
 import components.linkableH2
 import kotlinx.html.*
+import org.w3c.dom.HTMLElement
 import replaceElement
 import updateUrl
 
-fun manualView() {
-    updateUrl("manual")
+fun manualView(section: String? = null) {
+    updateUrl("manual", section)
     replaceElement {
         div {
             id = "manual-view"
@@ -82,4 +83,8 @@ fun manualView() {
             }
         }
     }
+}
+
+private fun TagConsumer<HTMLElement>.linkableH2(text: String) {
+    linkableH2("manual", text)
 }
diff --git a/src/jsMain/resources/css/styles.css b/src/jsMain/resources/css/styles.css
@@ -48,6 +48,10 @@ h2 {
     margin-top: 10px;
 }
 
+h2 a {
+    text-decoration: none;
+}
+
 h4, h5 {
     margin-bottom: 0px;
 }