#155 : Hide HUD elements if Game.vue is unloaded

This commit is contained in:
Dennis Postma 2024-09-28 00:45:19 +02:00
parent ff61f88d62
commit 2223491571

View File

@ -2,17 +2,19 @@
<div class="flex justify-center items-center h-dvh relative"> <div class="flex justify-center items-center h-dvh relative">
<GmTools v-if="isLoaded && gameStore.character?.role === 'gm'" /> <GmTools v-if="isLoaded && gameStore.character?.role === 'gm'" />
<GmPanel v-if="isLoaded && gameStore.character?.role === 'gm'" /> <GmPanel v-if="isLoaded && gameStore.character?.role === 'gm'" />
<Inventory />
<div v-if="!zoneEditorStore.active"> <div v-if="!zoneEditorStore.active">
<Game :config="gameConfig" @create="createGame" class="111mt-[-60px]"> <Game :config="gameConfig" @create="createGame" class="111mt-[-60px]">
<Scene name="main" @preload="preloadScene" @create="createScene"> <Scene name="main" @preload="preloadScene" @create="createScene">
<div class="fixed inset-x-0 top-0 flex justify-start items-end p-10 pointer-events-none"> <div v-if="isLoaded">
<Inventory />
</div>
<div v-if="isLoaded" class="fixed inset-x-0 top-0 flex justify-start items-end p-10 pointer-events-none">
<div class="pointer-events-auto"> <div class="pointer-events-auto">
<Hud /> <Hud />
</div> </div>
</div> </div>
<Zone v-if="isLoaded" /> <Zone />
<div class="fixed inset-x-0 bottom-0 flex justify-between gap-5 items-end py-10 px-5 xxs:p-10 pointer-events-none max-md:flex-wrap max-md:flex-col-reverse"> <div class="fixed inset-x-0 bottom-0 flex justify-between gap-5 items-end py-10 px-5 xxs:p-10 pointer-events-none max-md:flex-wrap max-md:flex-col-reverse">
<div class="pointer-events-auto w-full"> <div class="pointer-events-auto w-full">
<Chat /> <Chat />
@ -147,6 +149,7 @@ const createScene = async (scene: Phaser.Scene) => {
} }
onBeforeUnmount(() => { onBeforeUnmount(() => {
isLoaded.value = false
gameStore.disconnectSocket() gameStore.disconnectSocket()
}) })
</script> </script>