From 3d496c3057239b80483d18aaac812be144ba38af Mon Sep 17 00:00:00 2001
From: root <root@xanax.lol>
Date: Thu, 2 May 2024 22:02:57 +0200
Subject: [PATCH] player movement (WIP)

---
 src/components/World.vue                 |  2 +-
 src/components/sprites/player/Player.vue | 34 ++++++++++++++++++++++++
 2 files changed, 35 insertions(+), 1 deletion(-)

diff --git a/src/components/World.vue b/src/components/World.vue
index 2f2c601..90c2c28 100644
--- a/src/components/World.vue
+++ b/src/components/World.vue
@@ -1,6 +1,6 @@
 <template>
   <TilemapLayer ref="tilemapLayer" :tilemap="map" :layerIndex="0" :cull-padding-x="10" :cull-padding-y="10" :tileset="data" />
-  <Player />
+  <Player :layer="layer" />
   <Controls :layer="layer" />
 </template>
 
diff --git a/src/components/sprites/player/Player.vue b/src/components/sprites/player/Player.vue
index b5ce2ca..58ffc7b 100644
--- a/src/components/sprites/player/Player.vue
+++ b/src/components/sprites/player/Player.vue
@@ -5,8 +5,42 @@
 <script lang="ts" setup>
 import { Sprite, useScene } from 'phavuer'
 import { ref } from 'vue'
+import config from '@/config'
+
+const props = defineProps({
+  layer: Phaser.Tilemaps.TilemapLayer
+})
 
 const scene = useScene()
+const pointer_tile = ref(undefined);
 const x = ref(0);
 const y = ref(0);
+
+function onPointerClick(pointer: Phaser.Input.Pointer) {
+  const px = scene.cameras.main.worldView.x + pointer.x;
+  const py = scene.cameras.main.worldView.y + pointer.y;
+
+  pointer_tile.value = getTile(px, py, props.layer);
+  if (pointer_tile.value) {
+
+    // Convert tile coordinates to world coordinates
+    const worldPoint = props.layer.tileToWorldXY(pointer_tile.value.x, pointer_tile.value.y);
+    x.value = worldPoint.x + config.tile_size.y;
+    y.value = worldPoint.y;
+  }
+}
+scene.input.on(Phaser.Input.Events.POINTER_DOWN, onPointerClick);
+
+function getTile (x: number, y: number, layer: Phaser.Tilemaps.TilemapLayer): Phaser.Tilemaps.Tile | undefined {
+  const tile: Phaser.Tilemaps.Tile = layer.getTileAtWorldXY(x, y);
+
+  console.log(x,y);
+  console.log('tile', tile);
+
+  if (!tile) {
+    return undefined;
+  }
+
+  return tile;
+}
 </script>
\ No newline at end of file