86 lines
1.6 KiB
Vue
86 lines
1.6 KiB
Vue
<script setup lang="ts">
|
|
import { ref } from "vue";
|
|
|
|
import goStore, { register, setReady, oauth2_register_discord, setup_websocket } from "@/netcode";
|
|
|
|
|
|
|
|
const config = useRuntimeConfig()
|
|
|
|
await setup_websocket()
|
|
|
|
const route = useRoute()
|
|
|
|
let username = ref<string>("legonzaur");
|
|
|
|
onMounted(async () => {
|
|
const code = route.query.code
|
|
if (!code) { return }
|
|
if (Array.isArray(code)) { return }
|
|
await setup_websocket()
|
|
oauth2_register_discord(code)
|
|
history.pushState(
|
|
{},
|
|
'',
|
|
'/'
|
|
)
|
|
})
|
|
|
|
async function discordLogin() {
|
|
await navigateTo(config.public.discordLoginEndpoint, {
|
|
external: true
|
|
})
|
|
}
|
|
|
|
</script>
|
|
<template>
|
|
<div id="game_status">
|
|
<template v-if="!goStore.self">
|
|
|
|
<div v-if="goStore.game?.started">
|
|
<b>SPECTATOR MODE</b>
|
|
</div>
|
|
|
|
<template v-if="!goStore.game?.started">
|
|
<input type="text" v-model="username" />
|
|
<button @click="register(username)">LOGIN</button>
|
|
<button @click="discordLogin()">DISCORD</button>
|
|
</template>
|
|
</template>
|
|
|
|
|
|
<template v-if="goStore.self && !goStore.game?.started">
|
|
<input @change="setReady(($event.target as HTMLInputElement).checked)" type="checkbox" id="ready" />
|
|
<label for="ready">Ready</label>
|
|
</template>
|
|
</div>
|
|
|
|
<GameBoard></GameBoard>
|
|
|
|
</template>
|
|
|
|
<style>
|
|
html {
|
|
text-align: center;
|
|
}
|
|
|
|
body {
|
|
margin: 0;
|
|
height: 100vh;
|
|
}
|
|
|
|
#__nuxt {
|
|
height: 100%;
|
|
user-select: none;
|
|
}
|
|
|
|
#game_status {
|
|
position: fixed;
|
|
z-index: 10;
|
|
top: 0;
|
|
left: 50%;
|
|
transform: translateX(-50%);
|
|
background-color: rgba(255, 255, 255, .75);
|
|
}
|
|
</style>
|