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

Changes to mapeditorcomposable, fix pencil and fill tool for tiles

Browse Source 
Locked in, made mapeditor my bi-
This commit is contained in:
Colin Kallemein
2025-01-26 23:28:15 +01:00
parent cfac1d508b
commit 14aa696197
15 changed files with 206 additions and 101 deletions
Download Patch File Download Diff File Expand all files Collapse all files

41
src/components/gameMaster/mapEditor/mapPartials/MapTiles.vue
View File

@ -8,7 +8,6 @@ import Controls from '@/components/utilities/Controls.vue'
import { createTileArray, getTile, placeTile, setLayerTiles } from '@/composables/mapComposable'
import { useMapEditorComposable } from '@/composables/useMapEditorComposable'
import { TileStorage } from '@/storage/storages'
import { useMapEditorStore } from '@/stores/mapEditorStore'
import { useScene } from 'phavuer'
import { onMounted, onUnmounted, shallowRef, watch } from 'vue'
@ -18,7 +17,6 @@ const emit = defineEmits(['tileMap:create'])
const scene = useScene()
const mapEditor = useMapEditorComposable()
const mapEditorStore = useMapEditorStore()
const tileStorage = new TileStorage()
const tileMap = shallowRef<Phaser.Tilemaps.Tilemap>()
@ -62,15 +60,16 @@ function pencil(pointer: Phaser.Input.Pointer) {
// Check if map is set
if (!mapEditor.currentMap.value) return
console.log(mapEditor.tool.value)
// Check if tool is pencil
if (mapEditorStore.tool !== 'pencil') return
if (mapEditor.tool.value !== 'pencil') return
// Check if draw mode is tile
if (mapEditorStore.drawMode !== 'tile') return
if (mapEditor.drawMode.value !== 'tile') return
// Check if there is a selected tile
if (!mapEditorStore.selectedTile) return
if (!mapEditor.selectedTile.value) return // Changed this line to access .value
// Check if left mouse button is pressed
if (!pointer.isDown) return
@ -83,10 +82,10 @@ function pencil(pointer: Phaser.Input.Pointer) {
if (!tile) return
// Place tile
placeTile(tileMap.value, tileLayer.value, tile.x, tile.y, mapEditorStore.selectedTile)
placeTile(tileMap.value, tileLayer.value, tile.x, tile.y, mapEditor.selectedTile.value)
// Adjust mapEditorStore.map.tiles
mapEditor.currentMap.value.tiles[tile.y][tile.x] = mapEditor.currentMap.value.tiles[tile.y][tile.x]
// Adjust mapEditor tiles
mapEditor.currentMap.value.tiles[tile.y][tile.x] = mapEditor.selectedTile.value
}
function eraser(pointer: Phaser.Input.Pointer) {
@ -96,10 +95,10 @@ function eraser(pointer: Phaser.Input.Pointer) {
if (!mapEditor.currentMap.value) return
// Check if tool is pencil
if (mapEditorStore.tool !== 'eraser') return
if (mapEditor.tool.value !== 'eraser') return
// Check if draw mode is tile
if (mapEditorStore.eraserMode !== 'tile') return
if (mapEditor.eraserMode.value !== 'tile') return
// Check if left mouse button is pressed
if (!pointer.isDown) return
@ -117,7 +116,7 @@ function eraser(pointer: Phaser.Input.Pointer) {
// Place tile
placeTile(tileMap.value, tileLayer.value, tile.x, tile.y, 'blank_tile')
// Adjust mapEditorStore.map.tiles
// Adjust mapEditor.map.tiles
mapEditor.currentMap.value.tiles[tile.y][tile.x] = 'blank_tile'
}
@ -128,10 +127,10 @@ function paint(pointer: Phaser.Input.Pointer) {
if (!mapEditor.currentMap.value) return
// Check if tool is pencil
if (mapEditorStore.tool !== 'paint') return
if (mapEditor.tool.value !== 'paint') return
// Check if there is a selected tile
if (!mapEditorStore.selectedTile) return
if (!mapEditor.selectedTile.value) return
// Check if left mouse button is pressed
if (!pointer.isDown) return
@ -143,10 +142,10 @@ function paint(pointer: Phaser.Input.Pointer) {
if (pointer.event.altKey) return
// Set new tileArray with selected tile
setLayerTiles(tileMap.value, tileLayer.value, createTileArray(tileMap.value.width, tileMap.value.height, mapEditorStore.selectedTile))
setLayerTiles(tileMap.value, tileLayer.value, createTileArray(tileMap.value.width, tileMap.value.height, mapEditor.selectedTile.value))
// Adjust mapEditorStore.map.tiles
mapEditor.currentMap.value.tiles = createTileArray(tileMap.value.width, tileMap.value.height, mapEditor.currentMap.value.tiles)
// Adjust mapEditor.map.tiles
mapEditor.currentMap.value.tiles = createTileArray(tileMap.value.width, tileMap.value.height, mapEditor.selectedTile.value)
}
// When alt is pressed, and the pointer is down, select the tile that the pointer is over
@ -157,10 +156,10 @@ function tilePicker(pointer: Phaser.Input.Pointer) {
if (!mapEditor.currentMap.value) return
// Check if tool is pencil
if (mapEditorStore.tool !== 'pencil') return
if (mapEditor.tool.value !== 'pencil') return
// Check if draw mode is tile
if (mapEditorStore.drawMode !== 'tile') return
if (mapEditor.drawMode.value !== 'tile') return
// Check if left mouse button is pressed
if (!pointer.isDown) return
@ -176,17 +175,17 @@ function tilePicker(pointer: Phaser.Input.Pointer) {
if (!tile) return
// Select the tile
mapEditorStore.setSelectedMapObject(mapEditor.currentMap.value.tiles[tile.y][tile.x])
mapEditor.setSelectedTile(mapEditor.currentMap.value.tiles[tile.y][tile.x])
}
watch(
() => mapEditorStore.shouldClearTiles,
() => mapEditor.shouldClearTiles.value,
(shouldClear) => {
if (shouldClear && mapEditor.currentMap.value && tileMap.value && tileLayer.value) {
const blankTiles = createTileArray(tileMap.value.width, tileMap.value.height, 'blank_tile')
setLayerTiles(tileMap.value, tileLayer.value, blankTiles)
mapEditor.currentMap.value.tiles = blankTiles
mapEditorStore.resetClearTilesFlag()
mapEditor.resetClearTilesFlag()
}
}
)