studio
/
shotgun
2
0
Fork 0
Code Issues 3 Pull Requests Packages Projects Releases Wiki Activity

display messages according to game dto action

This commit is contained in:
Branden J Brown 2024-02-03 12:39:32 -06:00
parent 21606cd3cd
commit 016d297f10
1 changed files with 47 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

68
site/src/components/GameStatus.vue
View File

@ -1,6 +1,6 @@
<template> <template>
<v-container> <v-container>
<v-row v-if="gameOn" class="d-flex justify-center"> <v-row class="d-flex justify-center">
<v-sheet class="d-flex justify-center mt-2" :elevation="2"> <v-sheet class="d-flex justify-center mt-2" :elevation="2">
<v-chip v-for="c of roundChips" class="ma-4" :variant="c.variant">{{ c.text }}</v-chip> <v-chip v-for="c of roundChips" class="ma-4" :variant="c.variant">{{ c.text }}</v-chip>
</v-sheet> </v-sheet>
@ -8,6 +8,11 @@
<v-row class="d-flex flex-fill justify-center"> <v-row class="d-flex flex-fill justify-center">
<v-alert :text="msg" class="mt-2 text-button" density="compact"></v-alert> <v-alert :text="msg" class="mt-2 text-button" density="compact"></v-alert>
</v-row> </v-row>
<v-row v-if="shellList.length > 0">
<v-sheet class="d-flex justify-center mt-2" :elevation="2">
{{ shellList }}
</v-sheet>
</v-row>
</v-container> </v-container>
</template> </template>
@ -21,30 +26,51 @@ export interface Props {
const props = defineProps<Props>(); const props = defineProps<Props>();
// TODO(zeph): simplify this condition, this should just come in the game state
const gameOn = computed(() => props.game.round < 3 || props.game.players.every((p) => p.hp > 0))
const roundChips = computed(() => [ const roundChips = computed(() => [
{ text: "I", variant: props.game.round === 1 ? 'elevated' : undefined }, { text: "I", variant: props.game.round === 1 ? 'elevated' : undefined },
{ text: "II", variant: props.game.round === 2 ? 'elevated' : undefined }, { text: "II", variant: props.game.round === 2 ? 'elevated' : undefined },
{ text: "III", variant: props.game.round === 3 ? 'elevated' : undefined }, { text: "III", variant: props.game.round === 3 ? 'elevated' : undefined },
] as const) ] as const);
// TODO(zeph): this probably should just be handled by the server and sent in the dto const actionMessages: Record<Game["action"], (game: Game) => string> = {
const msg = ref<string>(''); Start: () => "THE MATCH BEGINS",
watch(props.game, (now, was) => { Shoot: (game) => game.previous ? "THE PAIN..." : "A BLANK CLATTERS ON THE TABLE",
if (now.live != null && was?.live == null) { GameEnd: () => "THE DEALER RELOADS THE SHOTGUN",
msg.value = `THE SHOTGUN CONTAINS ${now.live} LIVE AND ${now.blank} BLANK SHELLS`; BeerGameEnd: () => "THE LAST SHELL CLATTERS ON THE TABLE",
} else if (was == null) { ChallengerWins: (game) => game.round < 3 ? "THE DEALER FALLS... BRIEFLY" : "THE DEALER FALLS... FOREVER",
msg.value = 'THE GAME BEGINS'; DealerWins: () => "THE CHALLENGER FALLS",
} else if (now.damage === 2 && was.damage !== 2) { Lens: (game) => `THE ${game.dealer ? "DEALER" : "CHALLENGER"} PEERS INTO THE CHAMBER`,
msg.value = 'THE BARREL HAS BEEN SHORTENED'; Cig: (game) => `THE ${game.dealer ? "DEALER" : "CHALLENGER"} TAKES A DRAG`,
} else if (now.shell != null && was.shell == null) { Beer: (game) => `THE ${game.dealer ? "DEALER" : "CHALLENGER"} TAKES A SIP AND A ${game.previous ? "LIVE SHELL" : "BLANK"} CLATTERS ON THE TABLE`,
msg.value = `THE CURRENT SHELL IS ${now.shell ? 'LIVE' : 'BLANK'}`; Cuff: (game) => `THE ${game.dealer ? "DEALER" : "CHALLENGER"} HANDS CUFFS ACROSS THE TABLE`,
} else if (now.previous != null && was.previous == null) { Knife: (game) => `THE ${game.dealer ? "DEALER" : "CHALLENGER"} CUTS THE BARREL SHORT`,
msg.value = `A ${now.previous ? 'LIVE' : 'BLANK'} SHELL CLATTERS ON THE TABLE`; DealerConcedes: () => `THE DEALER SUDDENLY TURNS TO DUST`,
} else { ChallengerConcedes: () => `THE CHALLENGER SUDDENLY TURNS TO DUST`,
msg.value = 'THE GAME CONTINUES'; }
const msg = computed(() => {
const f = actionMessages[props.game.action];
if (f == null) {
return "THE SERVER MISBEHAVES... WHAT?";
} }
}, { immediate: true }) return f(props.game);
});
const shellList = ref<string[]>([]);
watch(props.game, (game) => {
if (game.live == null || game.blank == null) {
shellList.value = [];
return;
}
const l = [...Array(game.live).fill('🟥'), ...Array(game.blank).fill('🟦')];
shuffle(l);
shellList.value = [...l, ...Array(8 - game.live - game.blank).fill('⬛')];
});
function shuffle<Elem>(l: Elem[]) {
for (let i = l.length - 1; i > 0; i--) {
const j = Math.floor(Math.random() * i);
[l[i], l[j]] = [l[j], l[i]];
}
}
</script> </script>