gaesup-world 0.9.59 → 0.9.60

package/dist/gaesup/animation/actions.ts

@@ -0,0 +1,121 @@
+import { useFrame } from "@react-three/fiber";
+import { useContext, useEffect } from "react";
+import { animationTagType } from "../controller/type";
+import { useGaesupAnimation } from "../hooks/useGaesupAnimation";
+import {
+  GaesupWorldContext,
+  GaesupWorldDispatchContext,
+} from "../world/context";
+import { playActionsType, subscribeActionsType } from "./type";
+
+export function subscribeActions({ type }: subscribeActionsType) {
+  const { states } = useContext(GaesupWorldContext);
+  const { subscribeAll } = useGaesupAnimation({ type });
+  // 초기 기본 애니메이션 등록
+  useEffect(() => {
+    subscribeAll([
+      {
+        tag: "walk",
+        condition: () => !states.isRunning && states.isMoving,
+        action: () => {},
+        animationName: "walk",
+        key: "walk",
+      },
+      {
+        tag: "run",
+        condition: () => states.isRunning,
+        action: () => {},
+        animationName: "run",
+        key: "run",
+      },
+      {
+        tag: "jump",
+        condition: () => states.isJumping,
+        action: () => {},
+        animationName: "jump",
+        key: "jump",
+      },
+
+      {
+        tag: "ride",
+        condition: () => states.isPush["keyR"],
+        action: () => {},
+        animationName: "ride",
+        key: "ride",
+      },
+      {
+        tag: "land",
+        condition: () => states.isLanding,
+        action: () => {},
+        animationName: "land",
+        key: "land",
+      },
+      {
+        tag: "fall",
+        condition: () => states.isFalling,
+        action: () => {},
+        animationName: "fall",
+        key: "fall",
+      },
+    ]);
+  }, []);
+}
+
+export default function playActions({
+  type,
+  actions,
+  animationRef,
+  currentAnimation,
+  isActive,
+}: playActionsType) {
+  const { mode, animationState, block } = useContext(GaesupWorldContext);
+  const dispatch = useContext(GaesupWorldDispatchContext);
+  const { notify, store } = useGaesupAnimation({ type });
+
+  if (isActive) {
+    currentAnimation = animationState?.[type]?.current;
+  }
+
+  const play = (tag: keyof animationTagType) => {
+    animationState[type].current = tag;
+    const currentAnimation = store[tag];
+    if (currentAnimation?.action) {
+      currentAnimation.action();
+    }
+    dispatch({
+      type: "update",
+      payload: {
+        animationState: {
+          ...animationState,
+        },
+      },
+    });
+  };
+
+  useEffect(() => {
+    let animation = "idle";
+    if (block.animation) {
+      animation = "idle";
+    } else if (currentAnimation) {
+      animation = currentAnimation;
+    } else if (animationState[type].current) {
+      animation = animationState[type].current;
+    }
+    const action = actions[animation]?.reset().fadeIn(0.2).play();
+    return () => {
+      action?.fadeOut(0.2);
+    };
+  }, [currentAnimation, mode.type, block.animation, type]);
+
+  useFrame(() => {
+    if (isActive) {
+      const tag = notify() as keyof animationTagType;
+      play(tag);
+    }
+  });
+
+  return {
+    animationRef,
+    currentAnimation: animationState?.[type]?.current,
+  };
+}

package/dist/gaesup/animation/type.ts

@@ -0,0 +1,43 @@
+import { Ref } from "react";
+import * as THREE from "three";
+import {
+  AnimationAction,
+  AnimationClip,
+  AnimationMixer,
+  Object3D,
+  Object3DEventMap,
+} from "three";
+import { groundRayType } from "../controller/type";
+
+export type Api<T extends AnimationClip> = {
+  ref: React.MutableRefObject<Object3D | undefined | null>;
+  clips: AnimationClip[];
+  mixer: AnimationMixer;
+  names: T["name"][];
+  actions: {
+    [key in T["name"]]: AnimationAction | null;
+  };
+};
+
+export type playActionsType = {
+  type: "character" | "vehicle" | "airplane";
+  currentAnimation?: string;
+  actions: actionsType;
+  animationRef: Ref<Object3D<Object3DEventMap>>;
+  isActive: boolean;
+};
+
+export type subscribeActionsType = {
+  type: "character" | "vehicle" | "airplane";
+  groundRay: groundRayType;
+  animations: AnimationClip[];
+};
+
+export type actionsType = {
+  [x: string]: THREE.AnimationAction | null;
+};
+
+export type playResultType = {
+  actions: actionsType;
+  ref: Ref<Object3D<Object3DEventMap>>;
+};

package/dist/gaesup/camera/control/normal.ts

@@ -0,0 +1,27 @@
+import { cameraPropType } from "../../physics/type";
+import { V3 } from "../../utils/vector";
+import { activeStateType, cameraOptionType } from "../../world/context/type";
+
+export const makeNormalCameraPosition = (
+  activeState: activeStateType,
+  cameraOption: cameraOptionType
+) => {
+  const { XDistance, YDistance, ZDistance } = cameraOption;
+  const cameraPosition = activeState.position
+    .clone()
+    .add(V3(XDistance, YDistance, ZDistance));
+  return cameraPosition;
+};
+export default function normal(prop: cameraPropType) {
+  const {
+    state,
+    worldContext: { cameraOption },
+    controllerOptions: { lerp },
+  } = prop;
+  if (!state || !state.camera) return;
+  state.camera.position.lerp(
+    cameraOption.position.clone(),
+    lerp.cameraPosition
+  );
+  state.camera.lookAt(cameraOption.target);
+}

package/dist/gaesup/camera/control/orbit.ts

@@ -0,0 +1,37 @@
+import { quat } from "@react-three/rapier";
+import { cameraPropType } from "../../physics/type";
+import { V3 } from "../../utils/vector";
+import { activeStateType, cameraOptionType } from "../../world/context/type";
+
+export const makeOrbitCameraPosition = (
+  activeState: activeStateType,
+  cameraOption: cameraOptionType
+) => {
+  const { XDistance, YDistance, ZDistance } = cameraOption;
+  const cameraPosition = activeState.position.clone().add(
+    V3(Math.sin(activeState.euler.y), 1, Math.cos(activeState.euler.y))
+      .normalize()
+      .clone()
+      .multiply(V3(-XDistance, YDistance, -ZDistance))
+  );
+  return cameraPosition;
+};
+
+export default function orbit(prop: cameraPropType) {
+  const {
+    state,
+    worldContext: { activeState, cameraOption },
+    controllerOptions: { lerp },
+  } = prop;
+
+  if (!state || !state.camera) return;
+  const cameraPosition = makeOrbitCameraPosition(activeState, cameraOption);
+  state.camera.position.lerp(cameraPosition.clone(), lerp.cameraTurn);
+  state.camera.quaternion.copy(
+    activeState.quat
+      .clone()
+      .multiply(quat().setFromAxisAngle(V3(0, 1, 0), Math.PI))
+  );
+  state.camera.rotation.copy(activeState.euler);
+  state.camera.lookAt(activeState.position.clone());
+}

package/dist/gaesup/camera/index.tsx

@@ -0,0 +1,29 @@
+import { useFrame } from "@react-three/fiber";
+import { cameraPropType } from "../physics/type";
+import normal, { makeNormalCameraPosition } from "./control/normal";
+import orbit from "./control/orbit";
+
+export default function Camera(prop: cameraPropType) {
+  useFrame((state) => {
+    prop.state = state;
+    if (!prop.worldContext.block.camera) {
+      if (prop.worldContext.mode.control === "orbit") {
+        orbit(prop);
+      } else if (prop.worldContext.mode.control === "normal") {
+        normal(prop);
+      }
+    }
+  });
+
+  // 포커스가 아닐 때 카메라 activeStae 따라가기
+  useFrame(() => {
+    if (!prop.worldContext.cameraOption.focus) {
+      prop.worldContext.cameraOption.target =
+        prop.worldContext.activeState.position;
+      prop.worldContext.cameraOption.position = makeNormalCameraPosition(
+        prop.worldContext.activeState,
+        prop.worldContext.cameraOption
+      );
+    }
+  });
+}

package/dist/gaesup/camera/type.ts

@@ -0,0 +1,14 @@
+import * as THREE from "three";
+import {} from "three-stdlib";
+
+export type cameraRayType = {
+  origin: THREE.Vector3;
+  hit: THREE.Raycaster;
+  rayCast: THREE.Raycaster | null;
+  length: number;
+  dir: THREE.Vector3;
+  position: THREE.Vector3;
+  intersects: THREE.Intersection<THREE.Mesh>[];
+  detected: THREE.Intersection<THREE.Mesh>[];
+  intersectObjectMap: { [uuid: string]: THREE.Mesh };
+};

package/dist/gaesup/component/active/airplane/index.tsx

@@ -0,0 +1,17 @@
+import { AirplaneInnerRef } from "../../inner/airplane";
+import { activeAirplaneInnerType } from "./type";
+
+export function AirplaneRef(props: activeAirplaneInnerType) {
+  return (
+    <AirplaneInnerRef
+      name={"airplane"}
+      isActive={true}
+      currentAnimation={"idle"}
+      componentType={"airplane"}
+      ridingUrl={props.ridingUrl}
+      {...props}
+    >
+      {props.children}
+    </AirplaneInnerRef>
+  );
+}

package/dist/gaesup/component/active/airplane/type.ts

@@ -0,0 +1,4 @@
+import { passiveAirplanePropsType } from "../../passive/airplane/type";
+import { innerRefType } from "../../passive/type";
+
+export type activeAirplaneInnerType = passiveAirplanePropsType & innerRefType;

package/dist/gaesup/component/active/character/index.tsx

@@ -0,0 +1,35 @@
+import { controllerInnerType, refsType } from "../../../controller/type";
+import { urlsType } from "../../../world/context/type";
+import { CharacterInnerRef } from "../../inner/character";
+
+export function CharacterRef({
+  children,
+  props,
+  refs,
+  urls,
+}: {
+  children: React.ReactNode;
+  props: controllerInnerType;
+  refs: refsType;
+  urls: urlsType;
+}) {
+  return (
+    <CharacterInnerRef
+      url={urls.characterUrl}
+      isActive={true}
+      componentType="character"
+      rigidbodyType={"dynamic"}
+      controllerOptions={props.controllerOptions}
+      groundRay={props.groundRay}
+      onAnimate={props.onAnimate}
+      onFrame={props.onFrame}
+      onReady={props.onReady}
+      onDestory={props.onDestory}
+      rigidBodyProps={props.rigidBodyProps}
+      parts={props.parts}
+      {...refs}
+    >
+      {children}
+    </CharacterInnerRef>
+  );
+}

package/dist/gaesup/component/active/character/type.ts

@@ -0,0 +1,13 @@
+import { RigidBodyTypeString } from "@react-three/rapier";
+import * as THREE from "three";
+import { controllerOptionsType } from "../../../controller/type";
+
+export type activeCharacterPropsType = {
+  characterUrl: string;
+  position?: THREE.Vector3;
+  rotation?: THREE.Euler;
+  controllerOptions?: controllerOptionsType;
+  currentAnimation?: string;
+  children?: React.ReactNode;
+  rigidbodyType?: RigidBodyTypeString;
+};

package/dist/gaesup/component/active/vehicle/index.tsx

@@ -0,0 +1,17 @@
+import { VehicleInnerRef } from "../../inner/vehicle";
+import { activeVehicleInnerType } from "./type";
+
+export function VehicleRef(props: activeVehicleInnerType) {
+  return (
+    <VehicleInnerRef
+      name={"vehicle"}
+      isActive={true}
+      currentAnimation={"idle"}
+      componentType={"vehicle"}
+      ridingUrl={props.ridingUrl}
+      {...props}
+    >
+      {props.children}
+    </VehicleInnerRef>
+  );
+}

package/dist/gaesup/component/active/vehicle/type.ts

@@ -0,0 +1,4 @@
+import { innerRefType } from "../../passive/type";
+import { passiveVehiclePropsType } from "../../passive/vehicle/type";
+
+export type activeVehicleInnerType = passiveVehiclePropsType & innerRefType;

package/dist/gaesup/component/index.tsx

@@ -0,0 +1,65 @@
+import { vec3 } from "@react-three/rapier";
+import { useContext } from "react";
+import { controllerInnerType, refsType } from "../controller/type";
+import { GaesupWorldContext } from "../world/context";
+import { AirplaneRef } from "./active/airplane";
+import { CharacterRef } from "./active/character";
+import { VehicleRef } from "./active/vehicle";
+
+export function GaesupComponent({
+  props,
+  refs,
+}: {
+  props: controllerInnerType;
+  refs: refsType;
+}) {
+  const { mode, states, rideable, urls } = useContext(GaesupWorldContext);
+  const { enableRiding, isRiderOn, rideableId } = states;
+
+  return (
+    <>
+      {mode.type === "character" && (
+        <CharacterRef props={props} refs={refs} urls={urls}>
+          {props.children}
+        </CharacterRef>
+      )}
+      {mode.type === "vehicle" && (
+        <VehicleRef
+          controllerOptions={props.controllerOptions}
+          url={urls.vehicleUrl}
+          wheelUrl={urls.wheelUrl}
+          ridingUrl={urls.ridingUrl}
+          enableRiding={enableRiding}
+          isRiderOn={isRiderOn}
+          groundRay={props.groundRay}
+          offset={
+            rideableId && rideable[rideableId]
+              ? rideable[rideableId].offset
+              : vec3()
+          }
+          {...refs}
+        >
+          {props.children}
+        </VehicleRef>
+      )}
+      {mode.type === "airplane" && (
+        <AirplaneRef
+          controllerOptions={props.controllerOptions}
+          url={urls.airplaneUrl}
+          ridingUrl={urls.ridingUrl}
+          enableRiding={enableRiding}
+          isRiderOn={isRiderOn}
+          groundRay={props.groundRay}
+          offset={
+            rideableId && rideable[rideableId]
+              ? rideable[rideableId].offset
+              : vec3()
+          }
+          {...refs}
+        >
+          {props.children}
+        </AirplaneRef>
+      )}
+    </>
+  );
+}

package/dist/gaesup/component/inner/airplane/index.tsx

@@ -0,0 +1,21 @@
+import { OuterGroupRef } from "../common/OuterGroupRef";
+import { RigidBodyRef } from "../common/RigidbodyRef";
+import { airplaneInnerType } from "./type";
+
+export function AirplaneInnerRef(props: airplaneInnerType) {
+  const { rigidBodyRef, outerGroupRef } = props;
+
+  return (
+    <OuterGroupRef ref={outerGroupRef}>
+      <RigidBodyRef
+        ref={rigidBodyRef}
+        name={props.name}
+        componentType={"airplane"}
+        ridingUrl={props.ridingUrl}
+        {...props}
+      >
+        {props.children}
+      </RigidBodyRef>
+    </OuterGroupRef>
+  );
+}

package/dist/gaesup/component/inner/airplane/type.ts

@@ -0,0 +1,8 @@
+import { ridingType, rigidBodyRefType } from "../common/type";
+
+// airplane 타입 정의
+export type airplaneUrlType = {
+  wheelUrl?: string;
+};
+
+export type airplaneInnerType = rigidBodyRefType & ridingType & airplaneUrlType;

package/dist/gaesup/component/inner/character/index.tsx

@@ -0,0 +1,22 @@
+import { OuterGroupRef } from "../common/OuterGroupRef";
+import { RigidBodyRef } from "../common/RigidbodyRef";
+import { characterInnerType } from "./type";
+
+export function CharacterInnerRef(props: characterInnerType) {
+  const { outerGroupRef } = props;
+  return (
+    <OuterGroupRef ref={outerGroupRef}>
+      <RigidBodyRef
+        name={"character"}
+        url={props.url}
+        controllerOptions={props.controllerOptions}
+        ref={props.rigidBodyRef}
+        groundRay={props.groundRay}
+        isNotColliding={props.isNotColliding}
+        {...props}
+      >
+        {props.children}
+      </RigidBodyRef>
+    </OuterGroupRef>
+  );
+}

package/dist/gaesup/component/inner/character/type.ts

@@ -0,0 +1,14 @@
+import { callbackType } from "../../../controller/initialize/callback/type";
+import { groundRayType, partsType } from "../../../controller/type";
+import { passiveCharacterPropsType } from "../../passive/character/type";
+import { componentTypeString, innerRefType } from "../../passive/type";
+
+// 내부 정의
+export type characterInnerType = {
+  componentType: componentTypeString;
+  isActive?: boolean;
+  groundRay: groundRayType;
+  parts?: partsType;
+} & passiveCharacterPropsType &
+  innerRefType &
+  callbackType;

package/dist/gaesup/component/inner/common/InnerGroupRef.tsx

@@ -0,0 +1,56 @@
+import { Ref, forwardRef } from "react";
+import * as THREE from "three";
+import RiderRef from "../rider";
+import { InnerGroupRefType } from "./type";
+
+export const InnerGroupRef = forwardRef(
+  (props: InnerGroupRefType, ref: Ref<THREE.Group>) => {
+    return (
+      <group receiveShadow castShadow ref={ref} userData={{ intangible: true }}>
+        {props.isRiderOn &&
+          props.enableRiding &&
+          props.isActive &&
+          props.ridingUrl && (
+            <RiderRef url={props.ridingUrl} offset={props.offset} />
+          )}
+
+        {props.children}
+        {props.objectNode && props.animationRef && (
+          <primitive
+            object={props.objectNode}
+            visible={false}
+            receiveShadow
+            castShadow
+            ref={props.animationRef}
+          />
+        )}
+
+        {Object.keys(props.nodes).map((name: string, key: number) => {
+          const node = props.nodes[name];
+          if (node instanceof THREE.SkinnedMesh) {
+            return (
+              <skinnedMesh
+                castShadow
+                receiveShadow
+                material={node.material}
+                geometry={node.geometry}
+                skeleton={node.skeleton}
+                key={key}
+              />
+            );
+          } else if (node instanceof THREE.Mesh) {
+            return (
+              <mesh
+                castShadow
+                receiveShadow
+                material={node.material}
+                geometry={node.geometry}
+                key={key}
+              />
+            );
+          }
+        })}
+      </group>
+    );
+  }
+);

package/dist/gaesup/component/inner/common/OuterGroupRef.tsx

@@ -0,0 +1,19 @@
+import { forwardRef, MutableRefObject, ReactNode } from "react";
+import * as THREE from "three";
+
+export const OuterGroupRef = forwardRef(
+  (
+    {
+      children,
+    }: {
+      children: ReactNode;
+    },
+    ref: MutableRefObject<THREE.Group>
+  ) => {
+    return (
+      <group ref={ref} userData={{ intangible: true }}>
+        {children}
+      </group>
+    );
+  }
+);