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

#159 : Camera control fixes

Browse Source
This commit is contained in:
Dennis Postma 2024-09-28 00:21:24 +02:00
parent 71042881dc
commit 0f231e10fa
4 changed files with 26 additions and 43 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
src/composables/pointerHandlers/useGamePointerHandlers.ts
View File

@ -11,9 +11,7 @@ export function useGamePointerHandlers(scene: Phaser.Scene, layer: Phaser.Tilema
const pointerTile = getTile(px, py, layer)
waypoint.value.visible = !!pointerTile
if (!pointerTile) {
return
}
if (!pointerTile) return
const worldPoint = tileToWorldXY(layer, pointerTile.x, pointerTile.y)
waypoint.value.x = worldPoint.positionX
@ -21,9 +19,7 @@ export function useGamePointerHandlers(scene: Phaser.Scene, layer: Phaser.Tilema
}
function dragZone(pointer: Phaser.Input.Pointer) {
if (!gameStore.isPlayerDraggingCamera) {
return
}
if (!gameStore.isPlayerDraggingCamera) return
const { x, y, prevPosition } = pointer
const { scrollX, scrollY, zoom } = camera
@ -39,9 +35,7 @@ export function useGamePointerHandlers(scene: Phaser.Scene, layer: Phaser.Tilema
const { x: px, y: py } = camera.getWorldPoint(pointer.x, pointer.y)
const pointerTile = getTile(px, py, layer)
if (!pointerTile) {
return
}
if (!pointerTile) return
gameStore.connection?.emit('character:initMove', {
positionX: pointerTile.x,
@ -49,13 +43,11 @@ export function useGamePointerHandlers(scene: Phaser.Scene, layer: Phaser.Tilema
})
}
function handleZoom({ event, deltaY }: Phaser.Input.Pointer) {
if (event instanceof WheelEvent && event.shiftKey) {
return
}
function handleZoom(pointer: Phaser.Input.Pointer) {
if (!(pointer.event instanceof WheelEvent) || !pointer.event.shiftKey) return
scene.scale.setZoom(scene.scale.zoom - deltaY * 0.01)
camera = scene.cameras.main
const deltaY = pointer.event.deltaY
scene.scale.setZoom(scene.scale.zoom - deltaY * 0.005)
}
const setupPointerHandlers = () => {

20
src/composables/pointerHandlers/useZoneEditorPointerHandlers.ts
View File

@ -1,4 +1,4 @@
import { computed, type Ref, ref } from 'vue'
import { computed, type Ref } from 'vue'
import { getTile, tileToWorldXY } from '@/composables/zoneComposable'
import { useZoneEditorStore } from '@/stores/zoneEditorStore'
import config from '@/config'
@ -14,9 +14,7 @@ export function useZoneEditorPointerHandlers(scene: Phaser.Scene, layer: Phaser.
const pointerTile = getTile(px, py, layer)
waypoint.value.visible = !!pointerTile
if (!pointerTile) {
return
}
if (!pointerTile) return
const worldPoint = tileToWorldXY(layer, pointerTile.x, pointerTile.y)
waypoint.value.x = worldPoint.positionX
@ -24,12 +22,12 @@ export function useZoneEditorPointerHandlers(scene: Phaser.Scene, layer: Phaser.
}
function dragZone(pointer: Phaser.Input.Pointer) {
if (gameStore.isPlayerDraggingCamera) {
if (!gameStore.isPlayerDraggingCamera) return
const { x, y, prevPosition } = pointer
const { scrollX, scrollY, zoom } = camera
camera.setScroll(scrollX - (x - prevPosition.x) / zoom, scrollY - (y - prevPosition.y) / zoom)
}
}
function handlePointerMove(pointer: Phaser.Input.Pointer) {
if (isMoveTool.value || pointer.event.shiftKey) {
@ -38,13 +36,11 @@ export function useZoneEditorPointerHandlers(scene: Phaser.Scene, layer: Phaser.
updateWaypoint(pointer)
}
function handleZoom({ event, deltaY }: Phaser.Input.Pointer) {
if (event! instanceof WheelEvent && !event.shiftKey) {
return
}
function handleZoom(pointer: Phaser.Input.Pointer) {
if (!(pointer.event instanceof WheelEvent) || pointer.event.shiftKey) return
scene.scale.setZoom(scene.scale.zoom - deltaY * 0.01)
camera = scene.cameras.main
const deltaY = pointer.event.deltaY
scene.scale.setZoom(scene.scale.zoom - deltaY * 0.005)
}
const setupPointerHandlers = () => {

8
src/composables/useCameraControls.ts
View File

@ -1,5 +1,4 @@
import { useGameStore } from '@/stores/gameStore'
import { useScene } from 'phavuer'
import { watch } from 'vue'
import { useZoneStore } from '@/stores/zoneStore'
@ -9,10 +8,8 @@ export function useCameraControls(scene: Phaser.Scene): any {
const camera = scene.cameras.main
function onPointerDown(pointer: Phaser.Input.Pointer) {
if (pointer.event instanceof MouseEvent || pointer.event.shiftKey) {
gameStore.setPlayerDraggingCamera(true)
}
}
function onPointerUp() {
gameStore.setPlayerDraggingCamera(false)
@ -21,9 +18,8 @@ export function useCameraControls(scene: Phaser.Scene): any {
watch(
() => zoneStore.characterLoaded,
(characterLoaded) => {
if(characterLoaded) {
scene.cameras.main.startFollow(scene.children.getByName(gameStore.character!.name) as Phaser.GameObjects.Container);
}
if(!characterLoaded) return;
// scene.cameras.main.startFollow(scene.children.getByName(gameStore.character!.name) as Phaser.GameObjects.Container);
}
)

7
src/composables/usePointerHandlers.ts
View File

@ -4,12 +4,11 @@ import { useGamePointerHandlers } from '@/composables/pointerHandlers/useGamePoi
import { useZoneEditorPointerHandlers } from '@/composables/pointerHandlers/useZoneEditorPointerHandlers'
import { useGameStore } from '@/stores/gameStore'
export function usePointerHandlers(scene: Phaser.Scene, layer: Phaser.Tilemaps.TilemapLayer, waypoint: Ref<{ visible: boolean; x: number; y: number }>, camera: Ref<Phaser.Cameras.Scene2D.Camera>, isDragging: Ref<boolean>) {
const gameStore = useGameStore()
export function usePointerHandlers(scene: Phaser.Scene, layer: Phaser.Tilemaps.TilemapLayer, waypoint: Ref<{ visible: boolean; x: number; y: number }>, camera: Phaser.Cameras.Scene2D.Camera) {
const zoneEditorStore = useZoneEditorStore()
const gameHandlers = useGamePointerHandlers(scene, layer, waypoint, camera, isDragging)
const zoneEditorHandlers = useZoneEditorPointerHandlers(scene, layer, waypoint, camera, isDragging)
const gameHandlers = useGamePointerHandlers(scene, layer, waypoint, camera)
const zoneEditorHandlers = useZoneEditorPointerHandlers(scene, layer, waypoint, camera)
const currentHandlers = computed(() => (zoneEditorStore.active ? zoneEditorHandlers : gameHandlers))