noxious/client
6
0
Fork 1
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

WIP: updated zone manager to match with zone logic (dynamic asset/texture loading)

Browse Source
This commit is contained in:
Dennis Postma
2024-10-27 21:04:08 +01:00
parent d091aabeb3
commit dc2b6b9851
9 changed files with 124 additions and 96 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
src/components/zone/Zone.vue
View File

@ -5,15 +5,15 @@
</template>
<script setup lang="ts">
import { ref, onUnmounted } from 'vue'
import { useScene } from 'phavuer'
import { useGameStore } from '@/stores/gameStore'
import { useZoneStore } from '@/stores/zoneStore'
import { ref, onUnmounted, onMounted } from 'vue'
import { loadZoneTilesIntoScene } from '@/composables/zoneComposable'
import type { Character as CharacterT, Zone as ZoneT, ExtendedCharacter as ExtendedCharacterT } from '@/types'
import ZoneTiles from '@/components/zone/ZoneTiles.vue'
import ZoneObjects from '@/components/zone/ZoneObjects.vue'
import Characters from '@/components/zone/Characters.vue'
import { loadZoneTiles } from '@/composables/zoneComposable'
const scene = useScene()
const gameStore = useGameStore()
@ -36,7 +36,7 @@ gameStore.connection!.on('zone:character:teleport', async (data: zoneLoadData) =
zoneId: data.zone.id
})
await loadZoneTiles(data.zone, scene)
await loadZoneTilesIntoScene(data.zone, scene)
zoneStore.setZone(data.zone)
zoneStore.setCharacters(data.characters)
})
@ -57,7 +57,7 @@ gameStore.connection!.on('character:move', (data: ExtendedCharacterT) => {
// Emit zone:character:join event to server and wait for response, then set zone and characters
gameStore!.connection!.emit('zone:character:join', async (response: zoneLoadData) => {
await loadZoneTiles(response.zone, scene)
await loadZoneTilesIntoScene(response.zone, scene)
zoneStore.setZone(response.zone)
zoneStore.setCharacters(response.characters)
})

10
src/components/zone/ZoneTiles.vue
View File

@ -7,13 +7,14 @@ import config from '@/config'
import { useScene } from 'phavuer'
import { useZoneStore } from '@/stores/zoneStore'
import { onBeforeUnmount } from 'vue'
import { setLayerTiles } from '@/composables/zoneComposable'
import { FlattenZoneArray, setLayerTiles } from '@/composables/zoneComposable'
import Controls from '@/components/utilities/Controls.vue'
import { unduplicateArray } from '@/utilities'
const emit = defineEmits(['tilemap:create'])
const zoneStore = useZoneStore()
const scene = useScene()
const zoneStore = useZoneStore()
const zoneTilemap = createTilemap()
const tiles = createTileLayer()
@ -40,10 +41,9 @@ function createTilemap() {
* A Tileset is a combination of a single image containing the tiles and a container for data about each tile.
*/
function createTileLayer() {
const tilesFromZone = zoneStore.zone?.tiles || []
const uniqueTiles = new Set(tilesFromZone.flat().filter(Boolean))
const tilesArray = unduplicateArray(FlattenZoneArray(zoneStore.zone?.tiles ?? []))
const tilesetImages = Array.from(uniqueTiles).map((tile: any, index: number) => {
const tilesetImages = Array.from(tilesArray).map((tile: any, index: number) => {
return zoneTilemap.addTilesetImage(tile, tile, config.tile_size.x, config.tile_size.y, 1, 2, index + 1, { x: 0, y: -config.tile_size.y })
}) as any