From b3dac25ba3c7cf12c3a3f38863344326cc4fddab Mon Sep 17 00:00:00 2001
From: Moritz Ruth <dev@moritzruth.de>
Date: Thu, 13 Mar 2025 19:31:41 +0100
Subject: [PATCH] commit 79

---
 .../kotlin/de/moritzruth/theaterdsl/show/Runner.kt |  8 ++++----
 ui/src/App.vue                                     | 14 ++++++++++++--
 2 files changed, 16 insertions(+), 6 deletions(-)

diff --git a/src/main/kotlin/de/moritzruth/theaterdsl/show/Runner.kt b/src/main/kotlin/de/moritzruth/theaterdsl/show/Runner.kt
index b6097a2..536a1d4 100644
--- a/src/main/kotlin/de/moritzruth/theaterdsl/show/Runner.kt
+++ b/src/main/kotlin/de/moritzruth/theaterdsl/show/Runner.kt
@@ -185,7 +185,7 @@ data class StateUpdateMessage(
     val state: ShowState
 )
 
-private fun CoroutineScope.startWebsocketServer(context: ShowContext) = launch(Dispatchers.IO) {
+private fun CoroutineScope.startWebsocketServer(context: ShowContext) = launch {
     val updateMessageJsonFlow = context.stateFlow.map { state ->
         Json.encodeToString(
             StateUpdateMessage(
@@ -195,10 +195,10 @@ private fun CoroutineScope.startWebsocketServer(context: ShowContext) = launch(D
         )
     }
 
-    val showJson = Json.encodeToString(context.show)
-    val indexHtmlContent = this::class.java.getResourceAsStream("/ui/index.html")!!.reader().use { it.readText() }
+    val showJson = withContext(Dispatchers.IO) { Json.encodeToString(context.show) }
+    val indexHtmlContent = withContext(Dispatchers.IO) { this::class.java.getResourceAsStream("/ui/index.html")!!.reader().use { it.readText() } }
 
-    embeddedServer(CIO, port = 8000) {
+    embeddedServer(CIO, port = 80) {
         install(WebSockets) {
             pingPeriod = 10.seconds
             timeout = 15.seconds
diff --git a/ui/src/App.vue b/ui/src/App.vue
index bf683c6..54b145d 100755
--- a/ui/src/App.vue
+++ b/ui/src/App.vue
@@ -1,9 +1,9 @@
 <template>
-  <div v-if="isConnecting" class="flex flex-col justify-center items-center h-100dvh gap-4">
+  <div v-if="isConnecting" class="flex flex-col justify-center items-center gap-4" :class="$style.fillScreen">
     <div class="font-bold text-10">Connecting…</div>
     <div class="text-s1">Janus, created by Moritz Ruth</div>
   </div>
-  <div v-else class="h-100dvh flex flex-col">
+  <div v-else class="flex flex-col" :class="$style.fillScreen">
     <div class="font-black text-2xl md:text-4xl px-4 pt-4 flex-shrink-0 truncate">
       {{ current.act === null ? "" : `${current.act.name} — ` }}{{ current.scene.name }}
     </div>
@@ -37,6 +37,16 @@
   }
 </style>
 
+<style module lang="scss">
+  .fillScreen {
+    height: 100vh;
+
+    @supports (height: 100dvh) {
+      height: 100dvh
+    }
+  }
+</style>
+
 <script>
   import { connect } from "./syncing"
   import { ref } from "vue"