Feat : more interesting lobby button messages

Closes #4

components/GameBoard.vue

@@ -6,7 +6,7 @@ import { playSound } from '~/helpers/audioHelpers';
 const current_players = computed<Array<Player>>(() => Array.from(goStore.current_game?.players ?? []).filter(p => p.team === goStore.current_game?.current_turn))
 
 watch(
-    () => goStore.current_game?.current_turn.uuid,
+    () => goStore.current_game?.current_turn?.uuid,
     () => {
         if (goStore.current_game?.current_turn?.uuid == goStore.self?.team?.uuid) {
             playSound('/sounds/ding.mp3')

components/LobbyView.vue

@@ -26,16 +26,27 @@ function killErika() {
 
             <div class="games-list-zone">
                 <div v-for="g in goStore.lobby?.games">
-                    <button v-if="g" @click="join_game(g.uuid)">
+                    <button v-if="g" @click="join_game(g.uuid)" :class="goStore.discordId == g.owner ? 'own_game' : ''">
-                        <template v-if="!g.started">
-                            JOIN
-                        </template>
-                        <template v-if="g.started && !g.ended">
-                            SPECTATE
-                        </template>
                         <template v-if="g.started && g.ended">
-                            GAME ENDED
+                            GAME OVER
                         </template>
+                        <template v-if="g.players.every(p => p.discord_id !== goStore.discordId)">
+                            <template v-if="!g.started">
+                                JOIN
+                            </template>
+                            <template v-if="g.started && !g.ended">
+                                SPECTATE
+                            </template>
+                        </template>
+                        <template v-if="g.players.some(p => p.discord_id == goStore.discordId)">
+                            <template v-if="!g.started">
+                                JOIN BACK
+                            </template>
+                            <template v-if="g.started && !g.ended">
+                                CONTINUE
+                            </template>
+                        </template>
+
                         <br>
                         current players:<br><span v-for="p in g.players">{{ p.username }},</span>
                     </button>
@@ -146,6 +157,10 @@ function killErika() {
         box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
 
     }
+
+    button.own_game {
+        border: solid yellow 5px;
+    }
 }
 
 .overlay {

netcode/Game.ts

@@ -13,6 +13,7 @@ export interface GameNetcode extends GameObjectNetcode {
     players: Array<string>
     losers: Array<string>
     ended: boolean
+    owner: string
 }
 
 

netcode/index.ts

@@ -35,6 +35,7 @@ export class GameObjectRegister {
 
   clientMouseX: Ref<number>
   clientMouseY: Ref<number>
+  discordId: Ref<string>
   constructor() {
     this.effects = reactive(new Map());
     this.cards = reactive(new Map());
@@ -51,6 +52,7 @@ export class GameObjectRegister {
     this.hoveredCard = ref()
     this.clientMouseX = ref(0)
     this.clientMouseY = ref(0)
+    this.discordId = ref("")
   }
 
   update_object(obj: GameObjectNetcode) {
@@ -106,11 +108,14 @@ export class GameObjectRegister {
     },
   } as { [id: string]: (data: any) => any };
 
-  set_self = (uuid: string) => {
+  setSelf = (uuid: string) => {
     this.self.value = this.players.get(uuid) ?? null;
   };
 
-  set_current_game = (uuid: string) => {
+  setDiscordId = (username: string) => {
+    this.discordId.value = username
+  }
+  setCurrentGame = (uuid: string) => {
     this.current_game.value = this.games.get(uuid) ?? null;
   };
 }
@@ -167,11 +172,13 @@ export const setup_websocket = () =>
         // console.log(data.data);
       } else if (data.type === "set") {
         if (data.data_type == "self") {
-          goStore.set_self(data.data);
+          goStore.setSelf(data.data);
         } else if (data.data_type == "current_game") {
-          goStore.set_current_game(data.data);
+          goStore.setCurrentGame(data.data);
         } else if (data.data_type == "session_cookie") {
           heron_session.value = data.data;
+        } else if (data.data_type == "self_discord_id") {
+          goStore.setDiscordId(data.data)
         }
       } else {
         // console.log(data.type, data.data_type, data.data);