fix messages

index.html

@@ -198,8 +198,8 @@
               Current topic:
               <span class="underline">{{selectedData.text}}</span>
             </span>
-            <span v-else-if="initialSpin">No current topic</span>
+            <span v-else-if="spinning">Spinning...</span>
-            <span v-else>Spinning...</span>
+            <span v-else>No current topic</span>
           </div>
           <div class="font-light">
             <span v-if="noData">End of meeting?</span>
@@ -210,7 +210,10 @@
             <span v-else-if="showSelected" class="animate-pulse">
               Start <b>timer</b> or click the wheel to <b>spin</b>
             </span>
-            <span v-else>Wheeeeee</span>
+            <span v-else-if="spinning">Wheeeeee</span>
+            <span v-else class="animate-pulse">
+              Click the wheel to <b>spin</b> !
+            </span>
           </div>
         </div>
         <div class="grow rounded-box overflow-hidden justify-center">

main.js

@@ -55,6 +55,7 @@ let app = {
       sound: undefined,
       themes: DAISYUI_THEMES,
       currentTheme: "cmyk",
+      spinning: false,
     };
   },
   watch: {
@@ -153,8 +154,8 @@ let app = {
       const delta = this.timerStarted
         ? Math.floor((this.timerEnd - new Date()) / 1000)
         : this.showSelected
-        ? this.selectedData.time * 60
+          ? this.selectedData.time * 60
-        : 0;
+          : 0;
       if (i == 0) {
         return delta < 0 ? "-" : "";
       }
@@ -177,8 +178,8 @@ let app = {
         return `${Math.floor(minutes / 60)
           .toFixed(0)
           .padStart(padHours, "0")}h${(minutes % 60)
-          .toFixed(0)
+            .toFixed(0)
-          .padStart(2, "0")}`;
+            .padStart(2, "0")}`;
       } else {
         return `${(minutes % 60).toFixed(0).padStart(2, "0")}min`;
       }
@@ -190,11 +191,13 @@ let app = {
         this.meetingStart = new Date();
       }
       this.initialSpin = false;
+      this.spinning = true;
       this.wheelPosition += 360 * 10 + Math.random() * 360;
       clearTimeout(this.timeoutId);
       this.selected = this.getSelected();
       this.timeoutId = setTimeout(() => {
         this.showSelected = true;
+        this.spinning = false;
         confetti({
           particleCount: 400,
           startVelocity: 100,