From 43f0b73309f2401c25e6d3354eac176a48232521 Mon Sep 17 00:00:00 2001
From: Dennis Postma <dennis@directonline.io>
Date: Mon, 22 Jul 2024 00:40:47 +0200
Subject: [PATCH] Refractor character component (WIP)
---
src/components/sprites/Character.vue | 57 ++++------------------------
src/components/sprites/MapEntity.vue | 1 -
src/components/sprites/NPC.vue | 1 -
src/components/sprites/Sprite.vue | 0
4 files changed, 8 insertions(+), 51 deletions(-)
delete mode 100644 src/components/sprites/MapEntity.vue
delete mode 100644 src/components/sprites/NPC.vue
delete mode 100644 src/components/sprites/Sprite.vue
diff --git a/src/components/sprites/Character.vue b/src/components/sprites/Character.vue
index 6754e7b..1b90958 100644
--- a/src/components/sprites/Character.vue
+++ b/src/components/sprites/Character.vue
@@ -21,61 +21,20 @@
</template>
<script lang="ts" setup>
-import { Container, Rectangle, Sprite, Text, useScene } from 'phavuer'
-import { onBeforeMount, onBeforeUnmount, onMounted, ref } from 'vue'
-import { useGameStore } from '@/stores/game'
+import { Container, Rectangle, Sprite, Text } from 'phavuer'
import { type Character as CharacterT } from '@/types'
-import { getTile, tileToWorldX, tileToWorldXY, tileToWorldY } from '@/services/zone'
+import { tileToWorldX, tileToWorldY } from '@/services/zone'
-const gameStore = useGameStore()
+interface Props {
+ layer: Phaser.Tilemaps.TilemapLayer
+ character?: CharacterT
+}
-const props = defineProps({
- layer: Phaser.Tilemaps.TilemapLayer,
- character: Object as () => CharacterT
+const props = withDefaults(defineProps<Props>(), {
+ character: undefined
})
-const scene = useScene()
-const isSelf = props.character?.id === gameStore.character?.id
-
const createText = (text: Phaser.GameObjects.Text) => {
text.setLetterSpacing(1.5)
}
-
-onBeforeMount(() => {
- if (isSelf) setupSelf()
-})
-
-function setupSelf() {
- scene.input.on(Phaser.Input.Events.POINTER_UP, onPointerClick)
-}
-
-function onPointerClick(pointer: Phaser.Input.Pointer) {
- if (!isSelf || gameStore.isMovingCamera) return
-
- const px = scene.cameras.main.worldView.x + pointer.x
- const py = scene.cameras.main.worldView.y + pointer.y
-
- const pointer_tile = getTile(px, py, props.layer) as Phaser.Tilemaps.Tile
- if (!pointer_tile) {
- return
- }
-
- gameStore.connection?.emit('character:move', { position_x: pointer_tile.x, position_y: pointer_tile.y })
-
- // Directions for player sprite + animations
- if (px < 0 && py > 0) {
- console.log('down left')
- } else if (px < 0 && py < 0) {
- console.log('top left')
- } else if (px > 0 && py > 0) {
- console.log('down right')
- } else if (px > 0 && py < 0) {
- console.log('top right')
- }
-}
-
-onBeforeUnmount(() => {
- if (!isSelf) return
- scene.input.off(Phaser.Input.Events.POINTER_UP, onPointerClick)
-})
</script>
diff --git a/src/components/sprites/MapEntity.vue b/src/components/sprites/MapEntity.vue
deleted file mode 100644
index cc340bc..0000000
--- a/src/components/sprites/MapEntity.vue
+++ /dev/null
@@ -1 +0,0 @@
-<template></template>
diff --git a/src/components/sprites/NPC.vue b/src/components/sprites/NPC.vue
deleted file mode 100644
index cc340bc..0000000
--- a/src/components/sprites/NPC.vue
+++ /dev/null
@@ -1 +0,0 @@
-<template></template>
diff --git a/src/components/sprites/Sprite.vue b/src/components/sprites/Sprite.vue
deleted file mode 100644
index e69de29..0000000