From 15b212160dbd060b82480364b598736d5cf915f2 Mon Sep 17 00:00:00 2001
From: Dennis Postma <dennis@directonline.io>
Date: Thu, 6 Feb 2025 13:46:21 +0100
Subject: [PATCH] Walk improvement
---
.../partials/SelectedPlacedMapObject.vue | 13 +++++++------
.../useCharacterSpriteComposable.ts | 19 ++++++++++++-------
2 files changed, 19 insertions(+), 13 deletions(-)
diff --git a/src/components/gameMaster/mapEditor/partials/SelectedPlacedMapObject.vue b/src/components/gameMaster/mapEditor/partials/SelectedPlacedMapObject.vue
index b4840e2..40add9d 100644
--- a/src/components/gameMaster/mapEditor/partials/SelectedPlacedMapObject.vue
+++ b/src/components/gameMaster/mapEditor/partials/SelectedPlacedMapObject.vue
@@ -41,12 +41,12 @@
</template>
<script setup lang="ts">
-import type { Map as MapT, MapObject, PlacedMapObject } from '@/application/types'
+import type { MapObject, Map as MapT, PlacedMapObject } from '@/application/types'
import Modal from '@/components/utilities/Modal.vue'
-import { onMounted, ref } from 'vue'
+import { useMapEditorComposable } from '@/composables/useMapEditorComposable'
import { MapObjectStorage } from '@/storage/storages'
import { useGameStore } from '@/stores/gameStore'
-import { useMapEditorComposable } from '@/composables/useMapEditorComposable'
+import { onMounted, ref } from 'vue'
const props = defineProps<{
placedMapObject: PlacedMapObject
@@ -77,7 +77,7 @@ const handleDelete = () => {
emit('delete', props.placedMapObject.id, props.map)
}
-async function handleUpdate () {
+async function handleUpdate() {
if (!mapObject.value) return
gameStore.connection?.emit(
@@ -86,8 +86,9 @@ async function handleUpdate () {
id: props.placedMapObject.mapObject as string,
name: mapObjectName.value,
originX: mapObjectOriginX.value,
- originY: mapObjectOriginY.value,
- }, async (response: boolean) => {
+ originY: mapObjectOriginY.value
+ },
+ async (response: boolean) => {
if (!response) return
// Update mapObject in storage
await mapObjectStorage.update(mapObject.value!.id, {
diff --git a/src/composables/useCharacterSpriteComposable.ts b/src/composables/useCharacterSpriteComposable.ts
index 5e9ab4a..e353724 100644
--- a/src/composables/useCharacterSpriteComposable.ts
+++ b/src/composables/useCharacterSpriteComposable.ts
@@ -1,3 +1,4 @@
+import config from '@/application/config'
import { Direction } from '@/application/enums'
import { type MapCharacter } from '@/application/types'
import { calculateIsometricDepth, tileToWorldX, tileToWorldY } from '@/services/mapService'
@@ -35,9 +36,10 @@ export function useCharacterSpriteComposable(scene: Phaser.Scene, tilemap: Phase
tween.value.stop()
}
- const distance = Math.sqrt(Math.pow(newPositionX - currentPositionX.value, 2) + Math.pow(newPositionY - currentPositionY.value, 2))
- const baseSpeed = 150 // pixels per second
- const duration = (distance / baseSpeed) * 1000 // Convert to milliseconds
+ const tileDistance = Math.sqrt(Math.pow((newPositionX - currentPositionX.value) / config.tile_size.width, 2) + Math.pow((newPositionY - currentPositionY.value) / config.tile_size.height, 2))
+
+ const baseDuration = 300 // milliseconds per tile
+ const duration = Math.min(baseDuration * tileDistance, baseDuration)
tween.value = tilemap.scene.tweens.add({
targets: characterContainer.value,
@@ -73,10 +75,13 @@ export function useCharacterSpriteComposable(scene: Phaser.Scene, tilemap: Phase
characterSprite.value!.setTexture(charTexture.value)
})
- characterSprite.value.anims.play({
- key: fullAnimationName,
- repeat: loop ? -1 : 0
- }, ignoreIfPlaying)
+ characterSprite.value.anims.play(
+ {
+ key: fullAnimationName,
+ repeat: loop ? -1 : 0
+ },
+ ignoreIfPlaying
+ )
}
const calcDirection = (oldPositionX: number, oldPositionY: number, newPositionX: number, newPositionY: number): Direction => {