Initial commit

pages/index.vue

@@ -0,0 +1,42 @@
+<script setup lang="ts">
+import { useLobbyStore } from "~/store/lobby.store";
+import { useUserStore } from "~/store/user.store";
+
+const loading = ref(false);
+const lobbyStore = useLobbyStore();
+const userStore = useUserStore();
+
+async function createGame() {
+  if (loading.value) {
+    return;
+  }
+  loading.value = true;
+  await lobbyStore
+    .createGame()
+    .then((data) => {
+      loading.value = false;
+      navigateTo("/game/" + data.id);
+    })
+    .catch((e) => {
+      if (e.data.statusCode == 400) {
+        console.error("Owned game limit reached");
+      } else {
+        console.log(e);
+      }
+    });
+}
+</script>
+
+<template>
+  <main>
+    <LobbyGame v-for="game in lobbyStore.games" :key="game.id" :id="game.id" />
+    <input type="button" value="Create Game" @click="createGame" :disabled="!userStore.self || loading" />
+  </main>
+
+</template>
+
+<style lang="css" scoped>
+input:disabled {
+  cursor: wait;
+}
+</style>