From 4e708dbd61365ab865f912a844106f1e66f91688 Mon Sep 17 00:00:00 2001 From: Dennis Postma Date: Fri, 14 Jun 2024 21:17:45 +0200 Subject: [PATCH] zone editor stuff --- .../utilities/zoneEditor/Toolbar.vue | 46 +++---- .../utilities/zoneEditor/ZoneEditor.vue | 26 ++-- .../utilities/zoneEditor/ZoneSettings.vue | 8 +- src/types.ts | 112 ++++++++++++------ 4 files changed, 107 insertions(+), 85 deletions(-) diff --git a/src/components/utilities/zoneEditor/Toolbar.vue b/src/components/utilities/zoneEditor/Toolbar.vue index 15565db..2f02fda 100644 --- a/src/components/utilities/zoneEditor/Toolbar.vue +++ b/src/components/utilities/zoneEditor/Toolbar.vue @@ -10,24 +10,17 @@ @@ -36,24 +29,17 @@ @@ -94,14 +80,12 @@ const emit = defineEmits(['move', 'eraser', 'pencil', 'save']) let selectPencilOpen = ref(false); let selectEraserOpen = ref(false); - // drawMode -const drawMode = ref('tile') - -// on change of select -watch(drawMode, (value) => { +function setDrawMode(value: string) { zoneEditorStore.setDrawMode(value) -}) + selectPencilOpen.value = false + selectEraserOpen.value = false +} function drawTile(pointer: Phaser.Input.Pointer) { if (zoneEditorStore.tool !== 'eraser' && zoneEditorStore.tool !== 'pencil') { @@ -139,7 +123,7 @@ onBeforeUnmount(() => { }) function clear() { - zoneEditorStore.setTiles(Array.from({ length: zoneEditorStore.zoneSettings?.width ?? 10 }, () => Array.from({ length: zoneEditorStore.zoneSettings?.height ?? 10 }, () => 0))) + zoneEditorStore.setTiles(Array.from({ length: zoneEditorStore.width ?? 10 }, () => Array.from({ length: zoneEditorStore.height ?? 10 }, () => 0))) } diff --git a/src/components/utilities/zoneEditor/ZoneEditor.vue b/src/components/utilities/zoneEditor/ZoneEditor.vue index 808c257..8f1e6b8 100644 --- a/src/components/utilities/zoneEditor/ZoneEditor.vue +++ b/src/components/utilities/zoneEditor/ZoneEditor.vue @@ -2,8 +2,8 @@ - - + + @@ -28,7 +28,7 @@ let scene = useScene() const socket = useSocketStore() const zoneEditorStore = useZoneEditorStore() -let tileMap = generateTilemap(scene, 10, 10); +let tileMap = generateTilemap(scene, zoneEditorStore.width, zoneEditorStore.height); let tileset: Tileset = tileMap.addTilesetImage('default', 'tiles') as Tileset let layer: TilemapLayer = tileMap.createBlankLayer('layer', tileset, 0, config.tile_size.y) as TilemapLayer @@ -41,25 +41,25 @@ onBeforeMount(() => { socket.connection.emit('gm:zone_editor:zone:request', { zoneId: socket.character.zoneId }) }) -const tiles = Array.from({ length: 10 }, () => Array.from({ length: 10 }, () => 0)) +const tiles = Array.from({ length: zoneEditorStore.width }, () => Array.from({ length: zoneEditorStore.height }, () => 0)) zoneEditorStore.setTiles(tiles) zoneEditorStore.tiles.forEach((row, y) => row.forEach((tile, x) => layer.putTileAt(tile, x, y))) // Watch for changes in the zoneStore and update the layer -watch( - () => zoneEditorStore.tiles, - () => { - // @TODO : change to zone for when loading other maps - zoneEditorStore.tiles.forEach((row, y) => row.forEach((tile, x) => layer.putTileAt(tile, x, y))) - }, - { deep: true } -) +// watch( +// () => zoneEditorStore.tiles, +// () => { +// // @TODO : change to zone for when loading other maps +// zoneEditorStore.tiles.forEach((row, y) => row.forEach((tile, x) => layer.putTileAt(tile, x, y))) +// }, +// { deep: true } +// ) socket.connection.on('gm:zone_editor:zone:load', (data: Zone) => { tileMap = generateTilemap(scene, data.width, data.height); zoneEditorStore.setName(data.name) zoneEditorStore.setWidth(data.width) - zoneEditorStore.setTiles(data.tiles) + zoneEditorStore.setTiles(data.tilesForPublic) }) function eraser(tile: Phaser.Tilemaps.Tile) { diff --git a/src/components/utilities/zoneEditor/ZoneSettings.vue b/src/components/utilities/zoneEditor/ZoneSettings.vue index 2b5ca73..0066a8e 100644 --- a/src/components/utilities/zoneEditor/ZoneSettings.vue +++ b/src/components/utilities/zoneEditor/ZoneSettings.vue @@ -13,11 +13,11 @@
- +
- +
@@ -45,10 +45,10 @@ watch(name, (value) => { }) watch(width, (value) => { - zoneEditorStore.setWidth(value) + zoneEditorStore.setWidth(parseInt(value)) }) watch(height, (value) => { - zoneEditorStore.setHeight(value) + zoneEditorStore.setHeight(parseInt(value)) }) \ No newline at end of file diff --git a/src/types.ts b/src/types.ts index 273e821..b198686 100644 --- a/src/types.ts +++ b/src/types.ts @@ -3,47 +3,85 @@ export type Notification = { message: string } +// User model export type User = { - id: number - username: string - password: string - characters: Character[] -} + id: number; + username: string; + password: string; + characters: Character[]; +}; +// Character model export type Character = { - id: number - userId: number - user: User - name: string - hitpoints: number - mana: number - level: number - experience: number - role: string - position_x: number - position_y: number - rotation: number - zoneId: number - zone: Zone - chats: Chat[] -} + id: number; + userId: number; + user: User; + name: string; + hitpoints: number; + mana: number; + level: number; + experience: number; + role: string; + position_x: number; + position_y: number; + rotation: number; + zoneId: number; + zone: Zone; + chats: Chat[]; +}; +// Zone model export type Zone = { - id: number - name: string - width: number - height: number - tiles: number[][] - characters: Character[] - chats: Chat[] -} + id: number; + name: string; + width: number; + height: number; + tiles: ZoneTile[]; + decorations: ZoneDecoration[]; + walls: ZoneWall[]; + characters: Character[]; + chats: Chat[]; + createdAt: Date; + updatedAt: Date; +}; +// ZoneTile model +export type ZoneTile = { + id: number; + zone: Zone; + zoneId: number; + x: number; + y: number; + type: number; +}; + +// ZoneDecoration model +export type ZoneDecoration = { + id: number; + zone: Zone; + zoneId: number; + x: number; + y: number; + type: number; +}; + +// ZoneWall model +export type ZoneWall = { + id: number; + zone: Zone; + zoneId: number; + x: number; + y: number; + type: number; +}; + +// Chat model export type Chat = { - id: number - characterId: number - character: Character - zoneId: number - zone: Zone - message: string - createdAt: Date -} + id: number; + characterId: number; + character: Character; + zoneId: number; + zone: Zone; + message: string; + createdAt: Date; +};