display messages according to game dto action
This commit is contained in:
parent
21606cd3cd
commit
016d297f10
@ -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>
|
||||||
|
Loading…
Reference in New Issue
Block a user