diff --git a/glebby-client/src/App.vue b/glebby-client/src/App.vue index fd5a8d4..af311f3 100644 --- a/glebby-client/src/App.vue +++ b/glebby-client/src/App.vue @@ -13,7 +13,7 @@ export default { data() { return { ws: new WebSocket(import.meta.env.VITE_GLEBBY_SERVER_URL), - model: null + model: null as any } }, created() { @@ -24,7 +24,14 @@ export default { if (payload.type === 'init') { console.log('Received initial game state:') console.log(payload.state) - this.model = payload.state + const players = new Map() + for (const player of payload.state.players) { + players.set(player.id, player) + } + this.model = { + yourId: payload.state.yourId, + players + } this.ws.removeEventListener('message', messageListener) } } diff --git a/glebby-client/src/components/Game.vue b/glebby-client/src/components/Game.vue index 4c783e0..8c23835 100644 --- a/glebby-client/src/components/Game.vue +++ b/glebby-client/src/components/Game.vue @@ -8,11 +8,11 @@ interface Player { interface Model { yourId: number, - players: Player[] + players: Map } function getPlayer(model: Model, id: number): Player | undefined { - return model.players.find(player => player.id === id) + return model.players.get(id) } /* @@ -41,13 +41,13 @@ export default defineComponent({ switch (payload.type) { case 'join': - this.model.players.push({ + this.model.players.set(message.from, { id: message.from, name: '' }) break case 'leave': - this.model.players = this.model.players.filter(player => player.id !== message.from) + this.model.players.delete(message.from) break case 'chat': this.chatMessages.push(payload.message) @@ -81,7 +81,7 @@ export default defineComponent({