diff --git a/src/components/utilities/zoneEditor/ZoneEditor.vue b/src/components/utilities/zoneEditor/ZoneEditor.vue
index 60003ac..d895397 100644
--- a/src/components/utilities/zoneEditor/ZoneEditor.vue
+++ b/src/components/utilities/zoneEditor/ZoneEditor.vue
@@ -3,10 +3,14 @@
-
+
-
+
+
+
+
+
@@ -23,10 +27,10 @@ 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 { placeTile, setAllTiles, tileToWorldXY } from '@/services/zone'
+import { placeTile, setAllTiles, tileToWorldX, tileToWorldXY, tileToWorldY } from '@/services/zone'
import { useAssetStore } from '@/stores/assets'
import Objects from '@/components/utilities/zoneEditor/Objects.vue'
-import type { ZoneObject } from '@/types'
+import type { ZoneEventTile, ZoneObject } from '@/types'
import { storeToRefs } from 'pinia'
import ZoneList from '@/components/utilities/zoneEditor/ZoneList.vue'
import Tileset = Phaser.Tilemaps.Tileset
@@ -47,24 +51,17 @@ const zoneData = new Phaser.Tilemaps.MapData({
})
/**
- * This array is used to store the tileset images
+ * These variables are used to store the tileset images and the tilemap
+ * The tilesetImages are used to store the tileset images
+ * The zoneTilemap is used to store the tilemap
+ * The zoneTiles are used to store the tile data
+ * The zoneObjects are used to store the object data
*/
const tilesetImages: Tileset[] = []
-
-/**
- * Create a new tilemap which will be used to draw the zone
- */
const zoneTilemap = new Phaser.Tilemaps.Tilemap(scene, zoneData)
-
-/**
- * This array is used to store the tileset key for each tile in the zone
- */
let zoneTiles = [] as string[][];
-
-/**
- * This array is used to store the objects in the zone
- */
const zoneObjects = ref([])
+const zoneEventTiles = ref([])
/**
* Walk through object and add them to the zone as tilesetImages
@@ -99,9 +96,11 @@ function eraser(tile: Phaser.Tilemaps.Tile) {
}
if (zoneEditorStore.drawMode === 'object') {
+ /**
+ * @TODO : when reloaded in zone editor, these aren't removed
+ */
zoneObjects.value = zoneObjects.value.filter((object) => {
- const worldXY = tileToWorldXY(tiles, tile.x, tile.y)
- return object.position_x !== worldXY.position_x || object.position_y !== worldXY.position_y
+ return object.position_x !== tile.x || object.position_y !== tile.y
})
}
}
@@ -123,13 +122,27 @@ function pencil(tile: Phaser.Tilemaps.Tile) {
zone: zoneEditorStore.zone,
objectId: zoneEditorStore.selectedObject.id,
object: zoneEditorStore.selectedObject,
- position_x: tileToWorldXY(tiles, tile.x, tile.y).position_x,
- position_y: tileToWorldXY(tiles, tile.x, tile.y).position_y
+ position_x: tile.x,
+ position_y: tile.y
})
+ // console.log(tileToWorldX(zoneTilemap, tile.x), tileToWorldY(zoneTilemap, tile.y))
+ console.log(tile.x, tile.y);
+ console.log(tileToWorldX(tiles, tile.x, tile.y), tileToWorldY(tiles, tile.x, tile.y))
+
// remove duplicates based on object, pos x and y
zoneObjects.value = zoneObjects.value.filter((object, index, self) => index === self.findIndex((t) => t.objectId === object.objectId && t.position_x === object.position_x && t.position_y === object.position_y))
}
+
+ if (zoneEditorStore.drawMode === 'blocking tile') {
+ zoneEventTiles.value.push({
+ id: Math.random(),
+ zoneId: zoneEditorStore.zone.id,
+ zone: zoneEditorStore.zone,
+ position_x: tile.x,
+ position_y: tile.y
+ })
+ }
}
function paint(tile: Phaser.Tilemaps.Tile) {
@@ -153,6 +166,12 @@ function save() {
})
}
+function clear() {
+ exampleTilesArray.forEach((row, y) => row.forEach((tile, x) => placeTile(zoneTilemap, tiles, x, y, 'blank_tile')))
+ zoneTiles = exampleTilesArray
+ zoneObjects.value = []
+}
+
onBeforeMount(() => {
exampleTilesArray.forEach((row, y) => row.forEach((tile, x) => placeTile(zoneTilemap, tiles, x, y, 'blank_tile')))
zoneTiles = exampleTilesArray
@@ -162,6 +181,7 @@ onBeforeMount(() => {
zoneTiles = zoneEditorStore.zone.tiles
}
zoneObjects.value = zoneEditorStore.zone?.zoneObjects ?? []
+ zoneEventTiles.value = zoneEditorStore.zone?.zoneEventTiles ?? []
})
onBeforeUnmount(() => {
diff --git a/src/services/zone.ts b/src/services/zone.ts
index 9f8fc47..d771098 100644
--- a/src/services/zone.ts
+++ b/src/services/zone.ts
@@ -9,15 +9,6 @@ export function getTile(x: number, y: number, layer: Phaser.Tilemaps.TilemapLaye
return tile
}
-export function tileToWorldX(layer: Phaser.Tilemaps.TilemapLayer, pos_x: number) {
- const worldPoint = layer.tileToWorldX(pos_x)
- return worldPoint + config.tile_size.y
-}
-
-export function tileToWorldY(layer: Phaser.Tilemaps.TilemapLayer, pos_y: number) {
- return layer.tileToWorldY(pos_y)
-}
-
export function tileToWorldXY(layer: Phaser.Tilemaps.TilemapLayer, pos_x: number, pos_y: number) {
const worldPoint = layer.tileToWorldXY(pos_x, pos_y)
const position_x = worldPoint.x + config.tile_size.y
@@ -26,6 +17,16 @@ export function tileToWorldXY(layer: Phaser.Tilemaps.TilemapLayer, pos_x: number
return { position_x, position_y }
}
+export function tileToWorldX(layer: Phaser.Tilemaps.TilemapLayer, pos_x: number, pos_y: number): number {
+ const worldPoint = layer.tileToWorldXY(pos_x, pos_y);
+ return worldPoint.x + config.tile_size.y;
+}
+
+export function tileToWorldY(layer: Phaser.Tilemaps.TilemapLayer, pos_x: number, pos_y: number): number {
+ const worldPoint = layer.tileToWorldXY(pos_x, pos_y);
+ return worldPoint.y;
+}
+
export function placeTile(zone: Tilemap, layer: TilemapLayer, x: number, y: number, tileName: string) {
const tileImg = zone.getTileset(tileName) as Tileset
if (!tileImg) return
diff --git a/src/types.ts b/src/types.ts
index 29ceba8..a12bde5 100644
--- a/src/types.ts
+++ b/src/types.ts
@@ -76,6 +76,7 @@ export type Zone = {
width: number
height: number
tiles: any // Using 'any' for Json type, consider using a more specific type if possible
+ zoneEventTiles: ZoneEventTile[]
zoneObjects: ZoneObject[]
characters: Character[]
chats: Chat[]
@@ -93,6 +94,15 @@ export type ZoneObject = {
position_y: number
}
+export type ZoneEventTile = {
+ id: number
+ zoneId: number
+ zone: Zone
+ type: "WARP" | "NPC" | "ITEM"
+ position_x: number
+ position_y: number
+}
+
export type Chat = {
id: number
characterId: number