chore: Rewrite scripts to function with hx-boost and added links!

backend/src/main/kotlin/Application.kt

@@ -35,7 +35,7 @@ public fun main() {
 
     // Creates all the tables
     transaction {
-        SchemaUtils.create(
+        SchemaUtils.createMissingTablesAndColumns(
             Projects,
             DocVersions,
             Pages,

backend/src/main/kotlin/api/ProjectSetup.kt

@@ -61,6 +61,7 @@ public suspend fun setupRepository(meili: Meili, projects: File) {
                 this.name = project.name
                 this.color = project.color
                 this.github = project.projectHome
+                this.discord = project.discord
             }
 
             val projectIcon = ImageIO.read(coreDir.resolve("${project.id}/icon.png"))
@@ -74,6 +75,9 @@ public suspend fun setupRepository(meili: Meili, projects: File) {
                     this.stable = version.stable
                     this.recommended = version.recommended
                     this.defaultPage = version.pages.find { it.default }?.id ?: error("Could not find default page.")
+                    this.github = version.github
+                    this.discord = version.discord
+                    this.javadocs = version.javadocs
                 }
 
                 val versionFolder = DATA_FOLDER.resolve("core/${project.id}/${version.reference}").also {

backend/src/main/kotlin/api/database/Entities.kt

@@ -17,6 +17,7 @@ public object Projects : IdTable<String>("projects") {
     public val name: Column<String> = varchar("name", 255)
     public val color: Column<String> = varchar("color", 10)
     public val github: Column<String> = varchar("github", 1024)
+    public val discord: Column<String?> = varchar("discord", 255).nullable().default(null)
 
     override val primaryKey: PrimaryKey = PrimaryKey(id)
 }
@@ -29,6 +30,9 @@ public object DocVersions : IntIdTable("docs_version") {
     public val stable: Column<Boolean> = bool("stable")
     public val recommended: Column<Boolean> = bool("recommended")
     public val defaultPage: Column<String> = varchar("default_page", 255)
+    public val github: Column<String?> = varchar("github", 1024).nullable().default(null)
+    public val discord: Column<String?> = varchar("discord", 1024).nullable().default(null)
+    public val javadocs: Column<String?> = varchar("javadocs", 1024).nullable().default(null)
 
     init {
         uniqueIndex("ref_project_uq", reference, project)
@@ -58,6 +62,7 @@ public class ProjectEntity(id: EntityID<String>) : Entity<String>(id) {
     public var name: String by Projects.name
     public var color: String by Projects.color
     public var github: String by Projects.github
+    public var discord: String? by Projects.discord
 }
 
 public class DocVersionEntity(id: EntityID<Int>) : IntEntity(id) {
@@ -69,6 +74,9 @@ public class DocVersionEntity(id: EntityID<Int>) : IntEntity(id) {
     public var stable: Boolean by DocVersions.stable
     public var recommended: Boolean by DocVersions.recommended
     public var defaultPage: String by DocVersions.defaultPage
+    public var github: String? by DocVersions.github
+    public var discord: String? by DocVersions.discord
+    public var javadocs: String? by DocVersions.javadocs
 }
 
 public class PageEntity(id: EntityID<Int>) : IntEntity(id) {

backend/src/main/kotlin/meilisearch/MeiliClient.kt

@@ -72,8 +72,6 @@ public class MeiliClient(
         private suspend fun create(): HttpResponse = client.post(Indexes()) {
             contentType(ContentType.Application.Json)
             setBody(Create(uid, primaryKey))
-        }.also {
-            println(it)
         }
 
         /** Deletes the current index. Success even if it doesn't exist. */
@@ -114,9 +112,6 @@ public class MeiliClient(
                 contentType(ContentType.Application.Json)
                 pk?.let { parameter(PRIMARY_KEY_PARAM, it) }
                 setBody<List<T>>(documents)
-            }.also {
-                println(it)
-                println(it.body<String>())
             }
         }
 

backend/src/main/kotlin/website/pages/docs/DocsPage.kt

@@ -48,6 +48,7 @@ import kotlinx.html.classes
 import kotlinx.html.div
 import kotlinx.html.footer
 import kotlinx.html.h1
+import kotlinx.html.i
 import kotlinx.html.id
 import kotlinx.html.img
 import kotlinx.html.li
@@ -62,6 +63,7 @@ import kotlinx.serialization.Serializable
 import org.jetbrains.exposed.sql.and
 import org.jetbrains.exposed.sql.transactions.transaction
 import java.time.LocalDate
+import kotlin.collections.set
 import kotlin.time.Duration.Companion.minutes
 import kotlin.time.toJavaDuration
 
@@ -169,6 +171,10 @@ private fun HTML.renderFullPage(
             src = "https://unpkg.com/[email protected]"
         }
 
+        script {
+            src = "/static/scripts/base.js"
+        }
+
         val title = "TriumphTeam | ${project.name} - ${currentPage.title}"
         // TODO: Replace with final URL, sucks that it can't be relative
         val image = "https://new.triumphteam.dev/assets/${project.id}/${version.reference}/${currentPage.id}/banner.png"
@@ -247,6 +253,10 @@ private fun HTML.renderFullPage(
                             transitionDuration = 0.3.s
                         }
 
+                        rule(".project-color-bg-hover") {
+                            transitionDuration = 0.3.s
+                        }
+
                         rule(".project-color-hover:hover") {
                             color = Color(project.color)
                         }
@@ -255,6 +265,10 @@ private fun HTML.renderFullPage(
                             borderColor = Color(project.color)
                         }
 
+                        rule(".project-color-bg-hover:hover") {
+                            backgroundColor = Color(project.color)
+                        }
+
                         rule(".docs-content a") {
                             color = Color(project.color)
                             transitionDuration = 0.3.s
@@ -284,7 +298,7 @@ private fun HTML.renderFullPage(
         toast()
 
         script {
-            src = "/static/scripts/script.js"
+            src = "/static/scripts/observer.js"
         }
     }
 }
@@ -431,12 +445,10 @@ private fun FlowContent.sideBar(project: ProjectData, version: Version, currentP
 
         div {
             classes = setOf(
-                "w-full",
-                "h-full",
                 "px-4",
                 "overflow-y-auto",
                 "overflow-x-hidden",
-                "sidebar-content",
+                "grow",
             )
 
             div {
@@ -451,23 +463,57 @@ private fun FlowContent.sideBar(project: ProjectData, version: Version, currentP
                 version.navigation.groups.forEach { group ->
                     barHeader(group.header, group.pages, currentPage)
                 }
-
-                // Keeps it from overflowing on the bottom
-                div {
-                    classes = setOf("h-12")
-                }
             }
         }
 
         div {
             classes = setOf(
                 "w-full",
-                "h-8",
+                "h-16",
+                "flex justify-center items-center flex-none",
             )
+
+            div {
+                classes = setOf(
+                    "w-56",
+                    "flex justify-center items-center gap-2",
+                )
+
+                bottomButton("Discord", "fa-brands fa-discord", version.discord ?: project.discord)
+                bottomButton("Github", "fa-brands fa-github", version.github)
+                bottomButton("Javadocs", "fa-solid fa-book", version.javadocs)
+            }
         }
     }
 }
 
+private fun FlowContent.bottomButton(tooltip: String, icon: String, link: String?) {
+    a {
+
+        link?.let { href = it }
+        target = "_bank"
+        if (link != null) {
+            attributes["data-tooltip"] = tooltip
+        }
+
+        val conditional = if (link != null) {
+            setOf("project-color-bg-hover")
+        } else {
+            setOf("text-zinc-500", "cursor-default")
+        }
+
+        classes = setOf(
+            "w-1/3",
+            "flex justify-center items-center",
+            "bg-search-bg",
+            "rounded-md",
+            "p-2",
+        ).plus(conditional)
+
+        i { classes = setOf(icon) }
+    }
+}
+
 private fun FlowContent.barHeader(text: String, pages: List<Navigation.Page>, currentPage: ProjectPage) {
     div {
 
@@ -490,6 +536,7 @@ private fun FlowContent.page(text: String, link: String, isCurrentPage: Boolean)
 
         a {
 
+            id = "navigation-link"
             href = link
 
             classes = setOf(
@@ -517,6 +564,9 @@ private fun getProject(project: String): ProjectData? {
                 navigation = entity.navigation,
                 stable = entity.stable,
                 defaultPage = entity.defaultPage,
+                github = entity.github,
+                discord = entity.discord,
+                javadocs = entity.javadocs,
                 pages = PageEntity.find { (Pages.project eq projectEntity.id) and (Pages.version eq entity.id) }
                     .map { pageEntity ->
                         ProjectPage(
@@ -537,6 +587,7 @@ private fun getProject(project: String): ProjectData? {
             icon = createIconPath(projectEntity.id.value),
             color = projectEntity.color,
             versions = versions,
+            discord = projectEntity.discord,
         ).also {
             projectCache.put(it.id, it)
         }
@@ -548,6 +599,7 @@ public data class ProjectData(
     public val name: String,
     public val icon: String,
     public val color: String,
+    public val discord: String?,
     public val versions: Map<String, Version>,
 )
 
@@ -557,6 +609,9 @@ public data class Version(
     public val stable: Boolean,
     public val pages: Map<String, ProjectPage>,
     public val defaultPage: String,
+    public val github: String?,
+    public val discord: String?,
+    public val javadocs: String?,
 ) {
 
     public data class Data(public val reference: String, public val stable: Boolean)

backend/src/main/kotlin/website/pages/docs/components/Dropdown.kt

@@ -72,6 +72,7 @@ public fun FlowContent.dropDown(options: List<DropdownOption>) {
             if (options.size <= 1) return@dropdown
 
             div {
+                attributes["hx-boost"] = "true"
                 id = "version-select"
 
                 classes = setOf(

backend/src/main/kotlin/website/pages/docs/components/Search.kt

@@ -8,7 +8,7 @@ import kotlinx.html.div
 import kotlinx.html.i
 import kotlinx.html.id
 import kotlinx.html.input
-import kotlinx.html.label
+import kotlinx.html.span
 import kotlinx.html.unsafe
 
 public fun FlowContent.search(
@@ -36,11 +36,10 @@ public fun FlowContent.search(
                     placeholder = "Search"
                     name = "q"
                     autoComplete = false
-                    autoFocus = true
                 }
             } else {
-                label {
-                    classes = textClasses.plus("pointer-events-none text-white/50")
+                span {
+                    classes = textClasses.plus("pointer-events-none text-white/50 select-none")
                     +"Search"
                 }
             }

backend/src/main/resources/static/css/docs_style.css

@@ -21,18 +21,6 @@ body {
     border-radius: 25px;
 }
 
-.sidebar-content::after {
-    position: absolute;
-    z-index: 10;
-    left: 0;
-    width: 100%;
-    height: 10%;
-    content: "";
-    bottom: 0;
-    background: linear-gradient(rgba(20, 20, 23, 0) 0%, rgb(20, 20, 23) 50%);
-    pointer-events: none;
-}
-
 .weird-max-height {
     max-height: calc(100vh - 500px);
 }
@@ -52,6 +40,48 @@ body {
 }
 
 .docs-search {
-    z-index: 1;
+    z-index: 20;
     background: rgba(29, 32, 35, 0.9);
 }
+
+[data-tooltip] {
+    position: relative
+}
+
+[data-tooltip]::before, [data-tooltip]::after {
+    opacity: 0;
+    margin-top: -0.5em;
+    transition: opacity 0.3s;
+}
+
+[data-tooltip]::before {
+    content: attr(data-tooltip);
+    display: block;
+    position: absolute;
+    top: -130%;
+    left: 50%;
+    margin-left: -51px;
+    width: 8em;
+    text-align: center;
+    border-radius: 4px;
+    background: #202023;
+    color: white;
+    font-weight: bold;
+    font-size: 0.8em;
+    line-height: 1.1;
+    padding: 0.75em 0.95em;
+}
+
+[data-tooltip]::after {
+    content: "";
+    border: 10px solid transparent;
+    border-top-color: #202023;
+    position: absolute;
+    top: -10px;
+    left: 50%;
+    margin-left: -10px;
+}
+
+[data-tooltip]:hover::before, [data-tooltip]:hover::after {
+    opacity: 1;
+}

build-logic/src/main/kotlin/backend.script.gradle.kts

@@ -0,0 +1,24 @@
+import org.jetbrains.kotlin.gradle.targets.js.dsl.ExperimentalDistributionDsl
+
+plugins {
+    id("backend.multiplatform")
+}
+
+kotlin {
+    js(IR) {
+        browser {
+            @OptIn(ExperimentalDistributionDsl::class)
+            distribution {
+                // Bit hacky, but we do what we gotta do with what we are given :'))
+                val resourcesDir = project(":backend").projectDir.resolve("src/main/resources/static/scripts")
+                outputDirectory.set(resourcesDir)
+            }
+
+            webpackTask {
+                mainOutputFileName.set("${project.name.split("-").last()}.js")
+            }
+        }
+
+        binaries.executable()
+    }
+}