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

ref > store

Browse Source
This commit is contained in:
Dennis Postma 2024-09-20 20:58:50 +02:00
parent 5125695b4f
commit 777be0b4ae
1 changed files with 8 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
src/components/zone/Tiles.vue
View File

@ -6,8 +6,7 @@
import config from '@/config' import config from '@/config'
import { useScene } from 'phavuer' import { useScene } from 'phavuer'
import { useZoneStore } from '@/stores/zone' import { useZoneStore } from '@/stores/zone'
import { onBeforeMount, onBeforeUnmount, ref } from 'vue' import { onBeforeMount, onBeforeUnmount } from 'vue'
import { storeToRefs } from 'pinia'
import { placeTile, setAllTiles } from '@/composables/zoneComposable' import { placeTile, setAllTiles } from '@/composables/zoneComposable'
import Controls from '@/components/utilities/Controls.vue' import Controls from '@/components/utilities/Controls.vue'
@ -16,15 +15,14 @@ const emit = defineEmits(['tilemap:create'])
const zoneStore = useZoneStore() const zoneStore = useZoneStore()
const scene = useScene() const scene = useScene()
const { zone } = storeToRefs(zoneStore)
const zoneTilemap = createTilemap() const zoneTilemap = createTilemap()
const tiles = createTileLayer() const tiles = createTileLayer()
let tileArray = createTileArray() let tileArray = createTileArray()
function createTilemap() { function createTilemap() {
const zoneData = new Phaser.Tilemaps.MapData({ const zoneData = new Phaser.Tilemaps.MapData({
width: zone.value?.width, width: zoneStore.zone?.width,
height: zone.value?.height, height: zoneStore.zone?.height,
tileWidth: config.tile_size.x, tileWidth: config.tile_size.x,
tileHeight: config.tile_size.y, tileHeight: config.tile_size.y,
orientation: Phaser.Tilemaps.Orientation.ISOMETRIC, orientation: Phaser.Tilemaps.Orientation.ISOMETRIC,
@ -36,7 +34,7 @@ function createTilemap() {
} }
function createTileLayer() { function createTileLayer() {
const tilesFromZone = zone.value?.tiles || [] const tilesFromZone = zoneStore.zone?.tiles || []
const uniqueTiles = new Set(tilesFromZone.flat().filter(Boolean)) const uniqueTiles = new Set(tilesFromZone.flat().filter(Boolean))
const tilesetImages = Array.from(uniqueTiles).map((tile, index) => { const tilesetImages = Array.from(uniqueTiles).map((tile, index) => {
@ -53,13 +51,13 @@ function createTileLayer() {
} }
function createTileArray() { function createTileArray() {
return Array.from({ length: zone.value?.width ?? 0 }, () => Array.from({ length: zone.value?.height ?? 0 }, () => 'blank_tile')) return Array.from({ length: zoneStore.zone?.width ?? 0 }, () => Array.from({ length: zoneStore.zone?.height ?? 0 }, () => 'blank_tile'))
} }
onBeforeMount(() => { onBeforeMount(() => {
if (zone.value?.tiles) { if (zoneStore.zone?.tiles) {
setAllTiles(zoneTilemap, tiles, zone.value.tiles) setAllTiles(zoneTilemap, tiles, zoneStore.zone.tiles)
tileArray = zone.value.tiles.map((row) => row.map((tileId) => tileId || 'blank_tile')) tileArray = zoneStore.zone.tiles.map((row) => row.map((tileId) => tileId || 'blank_tile'))
} else { } else {
tileArray.forEach((row, y) => row.forEach((_, x) => placeTile(zoneTilemap, tiles, x, y, 'blank_tile'))) tileArray.forEach((row, y) => row.forEach((_, x) => placeTile(zoneTilemap, tiles, x, y, 'blank_tile')))
} }