vue-shovel/src/util/usePlayer.ts

import { computed, reactive } from 'vue'
import { RECIPROCAL, STAGE_WIDTH, STAGE_HEIGHT } from '../level/def'

export interface Moveable {
  x: number, // position on x-axis (fixed for the player)
  y: number, // position on y-axis (fixed for the player)
  lastDir: number, // store last face direction
  vx: number, // velocity on the x-axis
  vy: number, // velocity on the y-axis
}

const player = reactive({
  x: (STAGE_WIDTH + 2) / 2,
  y: (STAGE_HEIGHT + 2) / 2,
  lastDir: 0,
  vx: 0,
  vy: 1, // always falling, because of gravity
})

export default function usePlayer() {
  const dx = computed(() => player.vx * RECIPROCAL)
  const dy = computed(() => player.vy * RECIPROCAL)
  const direction = computed(() => (player.lastDir < 0 ? 'left' : 'right'))

  return { player, direction, dx, dy }
}