From 4dabf69c90aa18e6f3fa605fad2d1dcb79d6e82a Mon Sep 17 00:00:00 2001
From: Dennis Postma <dennis@directonline.io>
Date: Sun, 7 Jul 2024 22:23:27 +0200
Subject: [PATCH] Saving tile now really works
---
.../utilities/zoneEditor/ZoneEditor.vue | 17 +++++++++++------
src/services/zone.ts | 17 +++++------------
2 files changed, 16 insertions(+), 18 deletions(-)
diff --git a/src/components/utilities/zoneEditor/ZoneEditor.vue b/src/components/utilities/zoneEditor/ZoneEditor.vue
index 1c534f6..921fb46 100644
--- a/src/components/utilities/zoneEditor/ZoneEditor.vue
+++ b/src/components/utilities/zoneEditor/ZoneEditor.vue
@@ -23,7 +23,7 @@ import Toolbar from '@/components/utilities/zoneEditor/Toolbar.vue'
import Tiles from '@/components/utilities/zoneEditor/Tiles.vue'
import { useZoneEditorStore } from '@/stores/zoneEditor'
import ZoneSettings from '@/components/utilities/zoneEditor/ZoneSettings.vue'
-import { getTiles, placeTile, setAllTiles, tileToWorldXY } from '@/services/zone'
+import { placeTile, setAllTiles, tileToWorldXY } from '@/services/zone'
import { useAssetStore } from '@/stores/assets'
import Objects from '@/components/utilities/zoneEditor/Objects.vue'
import type { ZoneObject } from '@/types'
@@ -48,6 +48,7 @@ const zoneData = new Phaser.Tilemaps.MapData({
const tilesetImages: Tileset[] = []
const zoneTilemap = new Phaser.Tilemaps.Tilemap(scene, zoneData)
+let zoneTiles = [] as string[][];
const zoneObjects = ref<ZoneObject[]>([])
/**
@@ -61,7 +62,7 @@ toRaw(assetStore.assets).forEach((asset) => {
tilesetImages.push(zoneTilemap.addTilesetImage('blank_tile', 'blank_tile', config.tile_size.x, config.tile_size.y, 0, 0, 0) as Tileset)
const tiles = zoneTilemap.createBlankLayer('tiles', tilesetImages, 0, config.tile_size.y) as TilemapLayer
-const exampleTilesArray = Array.from({ length: zoneEditorStore.zone?.width ?? 10 }, () => Array.from({ length: zoneEditorStore.zone?.height ?? 10 }, () => 'blank_tile'))
+const exampleTilesArray = Array.from({ length: zoneEditorStore.zone?.width ?? 0 }, () => Array.from({ length: zoneEditorStore.zone?.height ?? 0 }, () => 'blank_tile'))
const { objectList } = storeToRefs(zoneEditorStore)
@@ -79,6 +80,7 @@ watch(objectList, (newObjects) => {
function eraser(tile: Phaser.Tilemaps.Tile) {
if (zoneEditorStore.drawMode === 'tile') {
placeTile(zoneTilemap, tiles, tile.x, tile.y, 'blank_tile')
+ zoneTiles[tile.y][tile.x] = 'blank_tile'
}
if (zoneEditorStore.drawMode === 'object') {
@@ -93,6 +95,7 @@ function pencil(tile: Phaser.Tilemaps.Tile) {
if (zoneEditorStore.drawMode === 'tile') {
if (!zoneEditorStore.selectedTile) return
placeTile(zoneTilemap, tiles, tile.x, tile.y, zoneEditorStore.selectedTile)
+ zoneTiles[tile.y][tile.x] = zoneEditorStore.selectedTile
}
if (zoneEditorStore.drawMode === 'object') {
@@ -117,26 +120,28 @@ function pencil(tile: Phaser.Tilemaps.Tile) {
function paint(tile: Phaser.Tilemaps.Tile) {
if (!zoneEditorStore.selectedTile) return
exampleTilesArray.forEach((row, y) => row.forEach((tile, x) => placeTile(zoneTilemap, tiles, x, y, zoneEditorStore.selectedTile)))
+ zoneTiles.forEach((row, y) => row.forEach((tile, x) => zoneTiles[y][x] = zoneEditorStore.selectedTile))
}
function save() {
-
if (!zoneEditorStore.zone) return
-console.log(getTiles);
- const tilesArray = []
+
+ console.log(zoneTiles);
socket.connection.emit('gm:zone_editor:zone:update', {
zoneId: zoneEditorStore.zone.id,
name: zoneEditorStore.zone.name,
width: zoneTilemap.width,
height: zoneTilemap.height,
- tiles: tilesArray,
+ tiles: zoneTiles,
objects: zoneObjects.value
})
}
onBeforeMount(() => {
exampleTilesArray.forEach((row, y) => row.forEach((tile, x) => placeTile(zoneTilemap, tiles, x, y, 'blank_tile')))
+ zoneTiles = exampleTilesArray
+
if (zoneEditorStore.zone) {
if (zoneEditorStore.zone.tiles) setAllTiles(zoneTilemap, tiles, zoneEditorStore.zone.tiles)
zoneObjects.value = zoneEditorStore.zone?.zoneObjects ?? []
diff --git a/src/services/zone.ts b/src/services/zone.ts
index 9f419e7..9f8fc47 100644
--- a/src/services/zone.ts
+++ b/src/services/zone.ts
@@ -9,10 +9,6 @@ export function getTile(x: number, y: number, layer: Phaser.Tilemaps.TilemapLaye
return tile
}
-export function getTiles(layer: Phaser.Tilemaps.TilemapLayer): Phaser.Tilemaps.Tile[] {
- return layer.getTilesWithin()
-}
-
export function tileToWorldX(layer: Phaser.Tilemaps.TilemapLayer, pos_x: number) {
const worldPoint = layer.tileToWorldX(pos_x)
return worldPoint + config.tile_size.y
@@ -37,12 +33,9 @@ export function placeTile(zone: Tilemap, layer: TilemapLayer, x: number, y: numb
}
export function setAllTiles(zone: Tilemap, layer: TilemapLayer, tiles: string[][]) {
- for (let y = 0; y < zone.height; y++) {
- for (let x = 0; x < zone.width; x++) {
- let tileName = tiles[y][x]
- const tileImg = zone.getTileset(tileName ?? 'blank_tile') as Tileset
- if (!tileImg) continue
- placeTile(zone, layer, x, y, tileName)
- }
- }
+ tiles.forEach((row, y) => {
+ row.forEach((tile, x) => {
+ placeTile(zone, layer, x, y, tile)
+ })
+ })
}
\ No newline at end of file