forked from noxious/client
WIP zone loading
This commit is contained in:
parent
8c664d7774
commit
e4186a1bf5
@ -5,7 +5,7 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref, onUnmounted } from 'vue'
|
import { ref, onUnmounted, onMounted, onBeforeMount } from 'vue'
|
||||||
import { useScene } from 'phavuer'
|
import { useScene } from 'phavuer'
|
||||||
import { useGameStore } from '@/stores/gameStore'
|
import { useGameStore } from '@/stores/gameStore'
|
||||||
import { useZoneStore } from '@/stores/zoneStore'
|
import { useZoneStore } from '@/stores/zoneStore'
|
||||||
@ -51,12 +51,11 @@ gameStore.connection!.on('character:move', (data: { id: number; positionX: numbe
|
|||||||
zoneStore.updateCharacterPosition(data)
|
zoneStore.updateCharacterPosition(data)
|
||||||
})
|
})
|
||||||
|
|
||||||
// Emit zone:character:join event to server and wait for response, then set zone and characters
|
onBeforeMount(async () => {
|
||||||
gameStore!.connection!.emit('zone:character:join', async (response: zoneLoadData) => {
|
console.log(gameStore.character!.zone!.id)
|
||||||
console.log(response)
|
await loadZoneTilesIntoScene(gameStore.character!.zone!.id, scene)
|
||||||
await loadZoneTilesIntoScene(response.zone, scene)
|
zoneStore.setZone(gameStore.character!.zone!)
|
||||||
zoneStore.setZone(response.zone)
|
// zoneStore.setCharacters(response.characters)
|
||||||
zoneStore.setCharacters(response.characters)
|
|
||||||
})
|
})
|
||||||
|
|
||||||
onUnmounted(() => {
|
onUnmounted(() => {
|
||||||
|
@ -122,19 +122,6 @@
|
|||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
</Modal>
|
</Modal>
|
||||||
|
|
||||||
<!-- DELETE CHARACTER MODAL -->
|
|
||||||
<ConfirmationModal v-if="deletingCharacter != null" :confirm-function="deleteCharacter.bind(this, deletingCharacter.id)" :cancel-function="(() => (deletingCharacter = null)).bind(this)" confirm-button-text="Delete">
|
|
||||||
<template #modalHeader>
|
|
||||||
<h3 class="m-0 font-medium text-white">Delete character?</h3>
|
|
||||||
</template>
|
|
||||||
<template #modalBody>
|
|
||||||
<p class="mt-0 mb-5 text-white text-lg">
|
|
||||||
Do you want to permanently delete <span class="font-extrabold text-white">{{ deletingCharacter.name }}</span
|
|
||||||
>?
|
|
||||||
</p>
|
|
||||||
</template>
|
|
||||||
</ConfirmationModal>
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
@ -142,13 +129,11 @@ import config from '@/application/config'
|
|||||||
import { useGameStore } from '@/stores/gameStore'
|
import { useGameStore } from '@/stores/gameStore'
|
||||||
import { onBeforeUnmount, ref, watch } from 'vue'
|
import { onBeforeUnmount, ref, watch } from 'vue'
|
||||||
import Modal from '@/components/utilities/Modal.vue'
|
import Modal from '@/components/utilities/Modal.vue'
|
||||||
import { type Character as CharacterT, type CharacterHair } from '@/application/types'
|
import { type Character as CharacterT, type CharacterHair, type Zone } from '@/application/types'
|
||||||
import ConfirmationModal from '@/components/utilities/ConfirmationModal.vue'
|
|
||||||
|
|
||||||
const gameStore = useGameStore()
|
const gameStore = useGameStore()
|
||||||
const isLoading = ref<boolean>(true)
|
const isLoading = ref<boolean>(true)
|
||||||
const characters = ref<CharacterT[]>([])
|
const characters = ref<CharacterT[]>([])
|
||||||
const deletingCharacter = ref(null as CharacterT | null)
|
|
||||||
const selectedCharacterId = ref<number | null>(null)
|
const selectedCharacterId = ref<number | null>(null)
|
||||||
const isCreateNewCharacterModalOpen = ref<boolean>(false)
|
const isCreateNewCharacterModalOpen = ref<boolean>(false)
|
||||||
const newCharacterName = ref<string>('')
|
const newCharacterName = ref<string>('')
|
||||||
@ -178,18 +163,11 @@ function loginWithCharacter() {
|
|||||||
gameStore.connection?.emit('character:connect', {
|
gameStore.connection?.emit('character:connect', {
|
||||||
characterId: selectedCharacterId.value,
|
characterId: selectedCharacterId.value,
|
||||||
characterHairId: selectedHairId.value
|
characterHairId: selectedHairId.value
|
||||||
}, (response: { character: CharacterT }) => {
|
}, (response: { character: CharacterT, zone: Zone, characters: CharacterT[] }) => {
|
||||||
gameStore.setCharacter(response.character)
|
gameStore.setCharacter(response.character)
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
// Delete character logics
|
|
||||||
function deleteCharacter(characterId: number) {
|
|
||||||
if (!characterId) return
|
|
||||||
deletingCharacter.value = null
|
|
||||||
gameStore.connection?.emit('character:delete', { characterId: characterId })
|
|
||||||
}
|
|
||||||
|
|
||||||
// Create character logics
|
// Create character logics
|
||||||
function createCharacter() {
|
function createCharacter() {
|
||||||
gameStore.connection?.on('character:create:success', (data: CharacterT) => {
|
gameStore.connection?.on('character:create:success', (data: CharacterT) => {
|
||||||
|
@ -84,9 +84,9 @@ export function FlattenZoneArray(tiles: string[][]) {
|
|||||||
return normalArray
|
return normalArray
|
||||||
}
|
}
|
||||||
|
|
||||||
export async function loadZoneTilesIntoScene(zone: ZoneT, scene: Phaser.Scene) {
|
export async function loadZoneTilesIntoScene(zone_id: number, scene: Phaser.Scene) {
|
||||||
// Fetch the list of tiles from the server
|
// Fetch the list of tiles from the server
|
||||||
const tileArray: HttpResponse<AssetDataT[]> = await fetch(config.server_endpoint + '/assets/list_tiles/' + zone.id).then((response) => response.json())
|
const tileArray: HttpResponse<AssetDataT[]> = await fetch(config.server_endpoint + '/assets/list_tiles/' + zone_id).then((response) => response.json())
|
||||||
|
|
||||||
// Load each tile into the scene
|
// Load each tile into the scene
|
||||||
for (const tile of tileArray.data ?? []) {
|
for (const tile of tileArray.data ?? []) {
|
||||||
|
Loading…
x
Reference in New Issue
Block a user