drawing-board-service/src/core/renderer-three/hook/use-downkeys.ts

import { getDownKeys } from "@/core/hook/use-global-vars";
import { mergeFuns } from "@/utils/shared";
import { Vector3 } from "three";
import { shallowRef, watch } from "vue";


export const getMoveDirectrionByKeys = () => {
  const { var: keys, onDestroy: onDownDestory } = getDownKeys();
  const direction = shallowRef<Vector3>()

  const stopWatch = watch(keys, (keys) => {
    let dire = new Vector3()
    if (keys.has('a')) {
      dire.setX(-1)
    }
    if (keys.has('d')) {
      dire.setX(1)
    }
    if (keys.has('w')) {
      dire.setY(1)
    }
    if (keys.has('s')) {
      dire.setY(-1)
    }
    if (dire.x || dire.y) {
      direction.value = dire.normalize()
    } else {
      direction.value = undefined
    }
  }, { deep: true });

  return {
    direction,
    onDestory: mergeFuns(stopWatch, onDownDestory)
  }
}