Make Vue.mounted async so spectrum displays at startup

cdump · Aug 4, 2024 · cc99df8 · cc99df8
1 parent e3e5fc4
commit cc99df8
Showing 1 changed file with 5 additions and 4 deletions.
diff --git a/radiacode_examples/webserver_logger.html b/radiacode_examples/webserver_logger.html
@@ -20,7 +20,7 @@
             padding: 0;
             margin-left: 20px;
         }
-        #debug-output {
+        #status-output {
             margin-top: 20px;
             border: 1px solid #ccc;
             padding: 10px;
@@ -64,8 +64,8 @@
             <button @click="requestNotificationPermission">Enable Notifications</button>
         </div>
 
-        <div id="debug-output">
-            <h3>Debug Output:</h3>
+        <div id="status-output">
+            <h3>Status Output:</h3>
             <p>Notification Permission: {{ notificationPermission }}</p>
             <p>Latest Count Rate: {{ latestCountRate }} CPS</p>
             <p>Threshold: {{ notificationThreshold }} CPS</p>
@@ -286,9 +286,10 @@ <h3>Debug Output:</h3>
                 this.rates_autoupdate = !this.rates_autoupdate;
             }
         },
-        mounted() {
+        async mounted() {
             this.initWebSocket();
             this.checkNotificationPermission();
+            await this.updateSpectrum(); // Call updateSpectrum at startup
         },
         beforeDestroy() {
             if (this.socket) {