legonzaur
2c4f9abc8d
release-tag / release-image (push) Successful in 38s
Use Left Alt Key (for now) Closes #13
39 lines
1013 B
Vue
39 lines
1013 B
Vue
<script setup lang="ts">
|
|
|
|
import goStore, { setReady } from "@/netcode";
|
|
|
|
|
|
</script>
|
|
|
|
<template>
|
|
<div class="root_page_div">
|
|
<div id="game_status">
|
|
|
|
<template v-if="goStore.self && !goStore.current_game?.started">
|
|
<input @change="setReady(($event.target as HTMLInputElement).checked)" type="checkbox" id="ready" />
|
|
<label for="ready">Ready</label>
|
|
</template>
|
|
</div>
|
|
<LoginView v-if="goStore.context === 'login'"></LoginView>
|
|
<GameBoard v-if="goStore.context != 'lobby' && goStore.context != 'login'"></GameBoard>
|
|
<LobbyView v-if="goStore.context == 'lobby'"></LobbyView>
|
|
<RulesDisplay v-if="goStore.context == 'rules'"></RulesDisplay>
|
|
<CardOverlay v-if="goStore.zoomKeyPressed" :card_id="goStore.hoveredCard">
|
|
</CardOverlay>
|
|
</div>
|
|
</template>
|
|
|
|
<style>
|
|
.root_page_div {
|
|
height: 100%;
|
|
}
|
|
|
|
#game_status {
|
|
position: fixed;
|
|
z-index: 10;
|
|
top: 0;
|
|
left: 50%;
|
|
transform: translateX(-50%);
|
|
background-color: rgba(255, 255, 255, .75);
|
|
}
|
|
</style> |