42 lines
1019 B
Vue

<template>
<Tiles :key="zoneStore.zone?.id ?? 0" />
<Objects />
<!-- <Characters />-->
</template>
<script setup lang="ts">
import { useGameStore } from '@/stores/game'
import { useZoneStore } from '@/stores/zone'
import { onBeforeMount, onBeforeUnmount, watch } from 'vue'
import type { Character as CharacterT, Zone as ZoneT } from '@/types'
import Tiles from '@/components/zone/Tiles.vue'
import Objects from '@/components/zone/Objects.vue'
import Characters from '@/components/zone/Characters.vue'
const gameStore = useGameStore()
const zoneStore = useZoneStore()
type zoneLoadData = {
zone: ZoneT
characters: CharacterT[]
}
gameStore.connection?.emit('zone:characterJoin', { zoneId: gameStore.character?.zoneId }, (response: zoneLoadData) => {
zoneStore.setZone(response.zone)
zoneStore.setCharacters(response.characters)
})
watch(() => zoneStore.zone, (newZone) => {
console.log('Zone changed:', newZone)
}, { deep: true })
onBeforeMount(() => {
});
onBeforeUnmount(() => {
});
</script>