1
0
forked from noxious/client

Minor improvements, more work on dynamic asset loading

This commit is contained in:
2024-10-26 02:41:16 +02:00
parent 70fb732051
commit 7db2ba322c
9 changed files with 105 additions and 68 deletions

View File

@ -6,17 +6,34 @@
import config from '@/config'
import { useScene } from 'phavuer'
import { useZoneStore } from '@/stores/zoneStore'
import { onBeforeMount, onBeforeUnmount } from 'vue'
import { setLayerTiles } from '@/composables/zoneComposable'
import { onBeforeUnmount } from 'vue'
import { setLayerTiles, loadZoneTileTexture } from '@/composables/zoneComposable'
import Controls from '@/components/utilities/Controls.vue'
const emit = defineEmits(['tilemap:create'])
const zoneStore = useZoneStore()
const scene = useScene()
const tilesFromZone = zoneStore.zone?.tiles
const uniqueTiles = new Set(tilesFromZone.flat().filter(Boolean))
/**
* @TODO fix this
*/
for (const tile of uniqueTiles) {
console.log(tile)
await loadZoneTileTexture(scene, tile, new Date())
}
const zoneTilemap = createTilemap()
const tiles = createTileLayer()
/**
* A Tilemap is a container for Tilemap data.
* This isn't a display object, rather, it holds data about the map and allows you to add tilesets and tilemap layers to it.
* A map can have one or more tilemap layers, which are the display objects that actually render the tiles.
*/
function createTilemap() {
const zoneData = new Phaser.Tilemaps.MapData({
width: zoneStore.zone?.width,
@ -31,6 +48,9 @@ function createTilemap() {
return tilemap
}
/**
* 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))
@ -49,12 +69,7 @@ function createTileLayer() {
return layer
}
onBeforeMount(() => {
if (!zoneStore.zone?.tiles) {
return
}
setLayerTiles(zoneTilemap, tiles, zoneStore.zone.tiles)
})
setLayerTiles(zoneTilemap, tiles, zoneStore.zone?.tiles)
onBeforeUnmount(() => {
zoneTilemap.destroyLayer('tiles')