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

Added container for character for easier X and Y coord handling

Browse Source
This commit is contained in:
Dennis Postma
2025-02-01 15:27:14 +01:00
parent e4b9bb4d61
commit af26ca5e89
5 changed files with 33 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files

38
src/composables/useCharacterSpriteComposable.ts
View File

@ -7,8 +7,9 @@ import { computed, ref } from 'vue'
import { Direction } from '@/application/enums'
export function useCharacterSprite(scene: Phaser.Scene, tilemap: Phaser.Tilemaps.Tilemap, mapCharacter: MapCharacter) {
const charSprite = refObj<Phaser.GameObjects.Sprite>()
const charSpriteId = ref('')
const characterContainer = refObj<Phaser.GameObjects.Container>()
const characterSpriteId = ref('')
const characterSprite = refObj<Phaser.GameObjects.Sprite>()
const currentPositionX = ref(0)
const currentPositionY = ref(0)
const isometricDepth = ref(1)
@ -39,7 +40,7 @@ export function useCharacterSprite(scene: Phaser.Scene, tilemap: Phaser.Tilemaps
const duration = (distance / baseSpeed) * 1000 // Convert to milliseconds
tween.value = tilemap.scene.tweens.add({
targets: charSprite.value,
targets: characterContainer.value,
x: newPositionX,
y: newPositionY,
duration,
@ -50,8 +51,8 @@ export function useCharacterSprite(scene: Phaser.Scene, tilemap: Phaser.Tilemaps
}
},
onUpdate: () => {
currentPositionX.value = charSprite.value?.x ?? currentPositionX.value
currentPositionY.value = charSprite.value?.y ?? currentPositionY.value
currentPositionX.value = characterContainer.value?.x ?? currentPositionX.value
currentPositionY.value = characterContainer.value?.y ?? currentPositionY.value
},
onComplete: () => {
if (direction === Direction.NEGATIVE) {
@ -78,19 +79,19 @@ export function useCharacterSprite(scene: Phaser.Scene, tilemap: Phaser.Tilemaps
})
const charTexture = computed(() => {
const spriteId = charSpriteId.value ?? 'idle_right_down'
const spriteId = characterSpriteId.value ?? 'idle_right_down'
return `${spriteId}-${currentAction.value}_${currentDirection.value}`
})
const updateSprite = () => {
if (!charSprite.value) return
if (!characterSprite.value) return
if (mapCharacter.isMoving) {
charSprite.value.anims.play(charTexture.value, true)
characterSprite.value.anims.play(charTexture.value, true)
} else {
charSprite.value.anims.stop()
charSprite.value.setFrame(0)
charSprite.value.setTexture(charTexture.value)
characterSprite.value.anims.stop()
characterSprite.value.setFrame(0)
characterSprite.value.setTexture(charTexture.value)
}
}
@ -99,13 +100,13 @@ export function useCharacterSprite(scene: Phaser.Scene, tilemap: Phaser.Tilemaps
const spriteId = await characterTypeStorage.getSpriteId(mapCharacter.character.characterType!)
if (!spriteId) return
charSpriteId.value = spriteId
characterSpriteId.value = spriteId
await loadSpriteTextures(scene, spriteId)
if (charSprite.value) {
charSprite.value.setTexture(charTexture.value)
charSprite.value.setFlipX(isFlippedX.value)
charSprite.value.setName(mapCharacter.character.name)
if (characterSprite.value) {
characterSprite.value.setTexture(charTexture.value)
characterSprite.value.setFlipX(isFlippedX.value)
characterSprite.value.setName(mapCharacter.character.name)
}
updatePosition(mapCharacter.character.positionX, mapCharacter.character.positionY, mapCharacter.character.rotation)
@ -116,8 +117,9 @@ export function useCharacterSprite(scene: Phaser.Scene, tilemap: Phaser.Tilemaps
}
return {
charSprite,
charSpriteId,
characterContainer,
characterSpriteId,
characterSprite,
currentPositionX,
currentPositionY,
isometricDepth,