mirror of
https://github.com/ad044/lainTSX.git
synced 2024-10-22 23:19:06 +00:00
got rid of yellow text manager, gota fix some bugs still
This commit is contained in:
parent
4f2298235a
commit
0258738867
10 changed files with 101 additions and 242 deletions
|
@ -41,7 +41,8 @@ const HUD = memo(() => {
|
||||||
);
|
);
|
||||||
const siteRotY = useStore((state) => state.siteRot[1]);
|
const siteRotY = useStore((state) => state.siteRot[1]);
|
||||||
const sitePosY = useStore((state) => state.sitePos[1]);
|
const sitePosY = useStore((state) => state.sitePos[1]);
|
||||||
const prevData = usePrevious({ siteRotY, sitePosY });
|
const subscene = useStore((state) => state.mainSubscene);
|
||||||
|
const prevData = usePrevious({ siteRotY, sitePosY, subscene });
|
||||||
|
|
||||||
// this part is imperative because it performs a lot better than having a toggleable spring.
|
// this part is imperative because it performs a lot better than having a toggleable spring.
|
||||||
useFrame(() => {
|
useFrame(() => {
|
||||||
|
@ -87,7 +88,11 @@ const HUD = memo(() => {
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (activeRef.current !== undefined) {
|
if (activeRef.current !== undefined) {
|
||||||
if (prevData?.siteRotY !== siteRotY || prevData?.sitePosY !== sitePosY) {
|
if (
|
||||||
|
prevData?.siteRotY !== siteRotY ||
|
||||||
|
prevData?.sitePosY !== sitePosY ||
|
||||||
|
subscene === "level_selection"
|
||||||
|
) {
|
||||||
activeRef.current = false;
|
activeRef.current = false;
|
||||||
} else {
|
} else {
|
||||||
const wasHidden = !activeRef.current;
|
const wasHidden = !activeRef.current;
|
||||||
|
@ -145,6 +150,7 @@ const HUD = memo(() => {
|
||||||
prevData?.siteRotY,
|
prevData?.siteRotY,
|
||||||
sitePosY,
|
sitePosY,
|
||||||
siteRotY,
|
siteRotY,
|
||||||
|
subscene,
|
||||||
]);
|
]);
|
||||||
|
|
||||||
const longHudRef = useRef<THREE.Object3D>();
|
const longHudRef = useRef<THREE.Object3D>();
|
||||||
|
|
|
@ -4,22 +4,23 @@ import * as THREE from "three";
|
||||||
import { useLoader } from "react-three-fiber";
|
import { useLoader } from "react-three-fiber";
|
||||||
import orange_font_json from "../../resources/font_data/big_font.json";
|
import orange_font_json from "../../resources/font_data/big_font.json";
|
||||||
import { a, useSpring } from "@react-spring/three";
|
import { a, useSpring } from "@react-spring/three";
|
||||||
import React, { memo, useEffect, useMemo } from "react";
|
import React, { memo, useEffect, useMemo, useState } from "react";
|
||||||
import { useStore } from "../../store";
|
import { useStore } from "../../store";
|
||||||
|
import usePrevious from "../../hooks/usePrevious";
|
||||||
|
|
||||||
const BigLetter = memo(
|
const BigLetter = memo(
|
||||||
(props: {
|
(props: {
|
||||||
color: string;
|
color?: string;
|
||||||
letter: string;
|
letter: string;
|
||||||
letterIdx: number;
|
letterIdx: number;
|
||||||
xOffset?: number;
|
xOffset?: number;
|
||||||
}) => {
|
}) => {
|
||||||
|
const [color, setColor] = useState("yellow");
|
||||||
|
|
||||||
const tex = useMemo(
|
const tex = useMemo(
|
||||||
() =>
|
() =>
|
||||||
props.color === "orange" || props.letterIdx === 0
|
color === "orange" || props.letterIdx === 0 ? orangeFont : yellowFont,
|
||||||
? orangeFont
|
[color, props.letterIdx]
|
||||||
: yellowFont,
|
|
||||||
[props.color, props.letterIdx]
|
|
||||||
);
|
);
|
||||||
|
|
||||||
const colorTexture: THREE.Texture = useLoader(THREE.TextureLoader, tex);
|
const colorTexture: THREE.Texture = useLoader(THREE.TextureLoader, tex);
|
||||||
|
@ -81,6 +82,7 @@ const BigLetter = memo(
|
||||||
}, [letterData, lineYOffset]);
|
}, [letterData, lineYOffset]);
|
||||||
|
|
||||||
const activeNode = useStore((state) => state.activeNode);
|
const activeNode = useStore((state) => state.activeNode);
|
||||||
|
const subscene = useStore((state) => state.mainSubscene);
|
||||||
|
|
||||||
const [shrinkState, set] = useSpring(() => ({
|
const [shrinkState, set] = useSpring(() => ({
|
||||||
x: props.letterIdx + 0.3,
|
x: props.letterIdx + 0.3,
|
||||||
|
@ -89,11 +91,17 @@ const BigLetter = memo(
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
set({ x: 0 });
|
set({ x: 0 });
|
||||||
|
if (subscene === "level_selection") {
|
||||||
|
setColor("orange");
|
||||||
|
} else {
|
||||||
|
if (color === "orange") {
|
||||||
|
setColor("yellow");
|
||||||
|
}
|
||||||
|
}
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
set({ x: props.letterIdx + 0.3 });
|
set({ x: props.letterIdx + 0.3 });
|
||||||
}, 1200);
|
}, 1200);
|
||||||
}, [activeNode, props.letterIdx, set]);
|
}, [activeNode, props.letterIdx, subscene, set, color]);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<a.mesh
|
<a.mesh
|
||||||
|
|
|
@ -3,23 +3,35 @@ import { useStore } from "../../store";
|
||||||
import { a, useTrail } from "@react-spring/three";
|
import { a, useTrail } from "@react-spring/three";
|
||||||
import BigLetter from "./BigLetter";
|
import BigLetter from "./BigLetter";
|
||||||
import { getNodeHud } from "../../core/nodeSelector";
|
import { getNodeHud } from "../../core/nodeSelector";
|
||||||
|
import usePrevious from "../../hooks/usePrevious";
|
||||||
|
|
||||||
const YellowTextRenderer = (props: { visible?: boolean }) => {
|
const YellowTextRenderer = (props: { visible?: boolean }) => {
|
||||||
const visible = useStore((state) => state.bigTextVisible);
|
|
||||||
const color = useStore((state) => state.bigTextColor);
|
|
||||||
|
|
||||||
const activeNode = useStore((state) => state.activeNode);
|
const activeNode = useStore((state) => state.activeNode);
|
||||||
|
const subscene = useStore((state) => state.mainSubscene);
|
||||||
|
const prevData = usePrevious({ subscene });
|
||||||
|
|
||||||
const [text, setText] = useState(useStore.getState().bigText.split(""));
|
const [text, setText] = useState(
|
||||||
|
useStore.getState().activeNode.node_name.split("")
|
||||||
|
);
|
||||||
|
|
||||||
const [trail, set] = useTrail(text.length, () => ({
|
const [trail, set] = useTrail(text.length, () => ({
|
||||||
posX: useStore.getState().bigTextPos[0],
|
posX: getNodeHud(useStore.getState().activeNode.matrixIndices!).big_text[0],
|
||||||
posY: useStore.getState().bigTextPos[1],
|
posY: getNodeHud(useStore.getState().activeNode.matrixIndices!).big_text[1],
|
||||||
config: { duration: 280 },
|
config: { duration: 280 },
|
||||||
}));
|
}));
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
|
if (prevData?.subscene !== "pause") {
|
||||||
const hud = getNodeHud(activeNode.matrixIndices!);
|
const hud = getNodeHud(activeNode.matrixIndices!);
|
||||||
|
if (subscene === "level_selection") {
|
||||||
|
setTimeout(() => {
|
||||||
|
set({ posX: -0.02, posY: 0.005 });
|
||||||
|
}, 400);
|
||||||
|
|
||||||
|
setTimeout(() => {
|
||||||
|
setText("JumpTo".split(""));
|
||||||
|
}, 1000);
|
||||||
|
} else {
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
set({ posX: hud.big_text[0], posY: hud.big_text[1] });
|
set({ posX: hud.big_text[0], posY: hud.big_text[1] });
|
||||||
}, 400);
|
}, 400);
|
||||||
|
@ -27,10 +39,12 @@ const YellowTextRenderer = (props: { visible?: boolean }) => {
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
setText(activeNode.node_name.split(""));
|
setText(activeNode.node_name.split(""));
|
||||||
}, 1000);
|
}, 1000);
|
||||||
}, [activeNode, set]);
|
}
|
||||||
|
}
|
||||||
|
}, [activeNode, prevData?.subscene, set, subscene]);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<group position={[0, 0, 10]} visible={props.visible && visible}>
|
<a.group position-z={10} visible={props.visible}>
|
||||||
{trail.map(({ posX, posY }, idx) => (
|
{trail.map(({ posX, posY }, idx) => (
|
||||||
<a.group
|
<a.group
|
||||||
key={idx}
|
key={idx}
|
||||||
|
@ -39,15 +53,10 @@ const YellowTextRenderer = (props: { visible?: boolean }) => {
|
||||||
position-z={-8.7}
|
position-z={-8.7}
|
||||||
scale={[0.04, 0.06, 0.04]}
|
scale={[0.04, 0.06, 0.04]}
|
||||||
>
|
>
|
||||||
<BigLetter
|
<BigLetter letter={text[idx]} letterIdx={idx} key={idx} />
|
||||||
color={color}
|
|
||||||
letter={text[idx]}
|
|
||||||
letterIdx={idx}
|
|
||||||
key={idx}
|
|
||||||
/>
|
|
||||||
</a.group>
|
</a.group>
|
||||||
))}
|
))}
|
||||||
</group>
|
</a.group>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
|
@ -17,10 +17,6 @@ const GameLoader = (props: StateManagerProps) => {
|
||||||
// level setter
|
// level setter
|
||||||
// const setActiveLevel = useLevelStore((state) => state.setActiveLevel);
|
// const setActiveLevel = useLevelStore((state) => state.setActiveLevel);
|
||||||
|
|
||||||
// big text setter
|
|
||||||
const setBigTexPos = useStore((state) => state.setBigTextPos);
|
|
||||||
const setBigText = useStore((state) => state.setBigText);
|
|
||||||
|
|
||||||
// site setter
|
// site setter
|
||||||
const setSiteRot = useStore((state) => state.setSiteRot);
|
const setSiteRot = useStore((state) => state.setSiteRot);
|
||||||
const setCurrentSite = useStore((state) => state.setActiveSite);
|
const setCurrentSite = useStore((state) => state.setActiveSite);
|
||||||
|
|
|
@ -7,7 +7,6 @@ import SiteManager from "./MainSceneManagers/SiteManager";
|
||||||
import LainManager from "./MainSceneManagers/LainManager";
|
import LainManager from "./MainSceneManagers/LainManager";
|
||||||
import MiddleRingManager from "./MainSceneManagers/MiddleRingManager";
|
import MiddleRingManager from "./MainSceneManagers/MiddleRingManager";
|
||||||
import SceneManager from "./GameManagers/SceneManager";
|
import SceneManager from "./GameManagers/SceneManager";
|
||||||
import BigTextManager from "./MainSceneManagers/BigTextManager";
|
|
||||||
import LevelManager from "./MainSceneManagers/LevelManager";
|
import LevelManager from "./MainSceneManagers/LevelManager";
|
||||||
import LevelSelectionManager from "./MainSceneManagers/LevelSelectionManager";
|
import LevelSelectionManager from "./MainSceneManagers/LevelSelectionManager";
|
||||||
import SubsceneManager from "./GameManagers/SubsceneManager";
|
import SubsceneManager from "./GameManagers/SubsceneManager";
|
||||||
|
@ -142,7 +141,6 @@ const MainSceneEventManager = (props: MainSceneEventManagerProps) => {
|
||||||
<LainManager eventState={eventState!} />
|
<LainManager eventState={eventState!} />
|
||||||
<MiddleRingManager eventState={eventState!} />
|
<MiddleRingManager eventState={eventState!} />
|
||||||
<SceneManager eventState={eventState!} />
|
<SceneManager eventState={eventState!} />
|
||||||
<BigTextManager eventState={eventState!} />
|
|
||||||
<LevelManager eventState={eventState!} />
|
<LevelManager eventState={eventState!} />
|
||||||
<LevelSelectionManager eventState={eventState!} />
|
<LevelSelectionManager eventState={eventState!} />
|
||||||
<SubsceneManager eventState={eventState!} />
|
<SubsceneManager eventState={eventState!} />
|
||||||
|
|
|
@ -1,173 +0,0 @@
|
||||||
import { useCallback, useEffect } from "react";
|
|
||||||
import { useStore } from "../../../store";
|
|
||||||
import { NodeDataType } from "../../../components/MainScene/SyncedComponents/Site";
|
|
||||||
import { StateManagerProps } from "../EventManager";
|
|
||||||
import { HUDType } from "../../../components/MainScene/SyncedComponents/HUD";
|
|
||||||
|
|
||||||
const BigTextManager = (props: StateManagerProps) => {
|
|
||||||
const setText = useStore((state) => state.setBigText);
|
|
||||||
const setColor = useStore((state) => state.setBigTextColor);
|
|
||||||
const setVisible = useStore((state) => state.setBigTextVisible);
|
|
||||||
const setXOffset = useStore((state) => state.setBigTextXOffset);
|
|
||||||
const setPos = useStore((state) => state.setBigTextPos);
|
|
||||||
|
|
||||||
const animateYellowTextWithMove = useCallback(
|
|
||||||
(
|
|
||||||
posXOffset: number,
|
|
||||||
posYOffset: number,
|
|
||||||
hud: HUDType,
|
|
||||||
node: NodeDataType | "UNKNOWN",
|
|
||||||
delay: number
|
|
||||||
) => {
|
|
||||||
// animate the letters to match that of site's
|
|
||||||
// to create an illusion of not moving
|
|
||||||
// setTimeout(() => {
|
|
||||||
// addToTransformState(posXOffset, "posX");
|
|
||||||
// addToTransformState(posYOffset, "posY");
|
|
||||||
// }, delay);
|
|
||||||
|
|
||||||
setTimeout(() => {
|
|
||||||
// make current hud big text shrink
|
|
||||||
setXOffset(-1);
|
|
||||||
}, 2500);
|
|
||||||
|
|
||||||
setTimeout(() => {
|
|
||||||
// animate it to new pos x/y
|
|
||||||
setPos(hud.big_text);
|
|
||||||
// set new text according to the node name
|
|
||||||
const targetText = node === "UNKNOWN" ? "Unknown" : node.node_name;
|
|
||||||
|
|
||||||
setText(targetText);
|
|
||||||
}, 3000);
|
|
||||||
|
|
||||||
// unshrink text
|
|
||||||
setTimeout(() => {
|
|
||||||
setXOffset(0);
|
|
||||||
}, 3900);
|
|
||||||
},
|
|
||||||
[setPos, setText, setXOffset]
|
|
||||||
);
|
|
||||||
|
|
||||||
const initializeLevelSelection = useCallback(() => {
|
|
||||||
setXOffset(-1);
|
|
||||||
|
|
||||||
setTimeout(() => {
|
|
||||||
setPos([-0.02, 0.005, -8.7]);
|
|
||||||
}, 400);
|
|
||||||
|
|
||||||
setTimeout(() => {
|
|
||||||
setText("Jump To");
|
|
||||||
setColor("orange");
|
|
||||||
}, 1000);
|
|
||||||
|
|
||||||
setTimeout(() => {
|
|
||||||
setXOffset(0);
|
|
||||||
}, 1200);
|
|
||||||
}, [setColor, setPos, setText, setXOffset]);
|
|
||||||
|
|
||||||
const levelSelectionBack = useCallback(
|
|
||||||
(node: NodeDataType, hud: HUDType) => {
|
|
||||||
setXOffset(-1);
|
|
||||||
|
|
||||||
setTimeout(() => {
|
|
||||||
setPos(hud.big_text);
|
|
||||||
}, 400);
|
|
||||||
|
|
||||||
setTimeout(() => {
|
|
||||||
setColor("yellow");
|
|
||||||
setText(node.node_name);
|
|
||||||
}, 1000);
|
|
||||||
|
|
||||||
setTimeout(() => {
|
|
||||||
setXOffset(0);
|
|
||||||
}, 1200);
|
|
||||||
},
|
|
||||||
[setColor, setPos, setText, setXOffset]
|
|
||||||
);
|
|
||||||
|
|
||||||
const toggleVisibleAfterLevelSelect = useCallback(
|
|
||||||
(node: NodeDataType | "UNKNOWN", hud: HUDType) => {
|
|
||||||
setVisible(false);
|
|
||||||
|
|
||||||
setTimeout(() => {
|
|
||||||
setPos(hud.big_text);
|
|
||||||
setColor("yellow");
|
|
||||||
const targetText = node === "UNKNOWN" ? "Unknown" : node.node_name;
|
|
||||||
|
|
||||||
setText(targetText);
|
|
||||||
}, 400);
|
|
||||||
|
|
||||||
setTimeout(() => {
|
|
||||||
setVisible(true);
|
|
||||||
}, 3900);
|
|
||||||
},
|
|
||||||
[setColor, setPos, setText, setVisible]
|
|
||||||
);
|
|
||||||
|
|
||||||
const dispatchObject = useCallback(
|
|
||||||
(eventState: {
|
|
||||||
event: string;
|
|
||||||
hud: HUDType;
|
|
||||||
node: NodeDataType;
|
|
||||||
level: string;
|
|
||||||
}) => {
|
|
||||||
switch (eventState.event) {
|
|
||||||
case "site_up":
|
|
||||||
return {
|
|
||||||
action: animateYellowTextWithMove,
|
|
||||||
value: [0, -1.5, eventState.hud, eventState.node, 1300],
|
|
||||||
};
|
|
||||||
case "site_down":
|
|
||||||
return {
|
|
||||||
action: animateYellowTextWithMove,
|
|
||||||
value: [0, 1.5, eventState.hud, eventState.node, 1300],
|
|
||||||
};
|
|
||||||
case "site_left":
|
|
||||||
return {
|
|
||||||
action: animateYellowTextWithMove,
|
|
||||||
value: [Math.PI / 4, 0, eventState.hud, eventState.node, 1100],
|
|
||||||
};
|
|
||||||
case "site_right":
|
|
||||||
return {
|
|
||||||
action: animateYellowTextWithMove,
|
|
||||||
value: [-Math.PI / 4, 0, eventState.hud, eventState.node, 1100],
|
|
||||||
};
|
|
||||||
case "level_selection_back":
|
|
||||||
return {
|
|
||||||
action: levelSelectionBack,
|
|
||||||
value: [eventState.node, eventState.hud],
|
|
||||||
};
|
|
||||||
case "toggle_level_selection":
|
|
||||||
return {
|
|
||||||
action: initializeLevelSelection,
|
|
||||||
};
|
|
||||||
case "select_level_up":
|
|
||||||
case "select_level_down":
|
|
||||||
return {
|
|
||||||
action: toggleVisibleAfterLevelSelect,
|
|
||||||
value: [eventState.node, eventState.hud],
|
|
||||||
};
|
|
||||||
}
|
|
||||||
},
|
|
||||||
[
|
|
||||||
animateYellowTextWithMove,
|
|
||||||
initializeLevelSelection,
|
|
||||||
levelSelectionBack,
|
|
||||||
toggleVisibleAfterLevelSelect,
|
|
||||||
]
|
|
||||||
);
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
if (props.eventState) {
|
|
||||||
const dispatchedObject = dispatchObject(props.eventState);
|
|
||||||
|
|
||||||
if (dispatchedObject) {
|
|
||||||
(dispatchedObject.action as any).apply(null, dispatchedObject.value);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}, [animateYellowTextWithMove, props.eventState, dispatchObject]);
|
|
||||||
|
|
||||||
return null;
|
|
||||||
};
|
|
||||||
|
|
||||||
export default BigTextManager;
|
|
|
@ -46,7 +46,7 @@ const handleMainSceneEvent = (gameContext: any) => {
|
||||||
nodeMatrixIndices = selectedNodeData.newNodeMatrixIndices;
|
nodeMatrixIndices = selectedNodeData.newNodeMatrixIndices;
|
||||||
siteRotY = selectedNodeData.newSiteRotY;
|
siteRotY = selectedNodeData.newSiteRotY;
|
||||||
sitePosY = selectedNodeData.newSitePosY;
|
sitePosY = selectedNodeData.newSitePosY;
|
||||||
level = selectedNodeData.newLevel;
|
level = selectedNodeData.newLevel!;
|
||||||
activeHud = selectedNodeData.newActiveHud;
|
activeHud = selectedNodeData.newActiveHud;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -155,11 +155,11 @@ const handleMainSceneEvent = (gameContext: any) => {
|
||||||
selectedLevel < level ? "select_level_down" : "select_level_up";
|
selectedLevel < level ? "select_level_down" : "select_level_up";
|
||||||
return {
|
return {
|
||||||
event: event,
|
event: event,
|
||||||
|
nodeMatrixIndices: selectedNodeData.nodeMatrixIndices,
|
||||||
|
sitePosY: -selectedNodeData.sitePosY!,
|
||||||
level: selectedLevel.toString().padStart(2, "0"),
|
level: selectedLevel.toString().padStart(2, "0"),
|
||||||
activeNodeId: selectedNodeData.node,
|
node: selectedNodeData.node,
|
||||||
activeHud: selectedNodeData.newActiveHud,
|
hud: selectedNodeData.activeHud,
|
||||||
nodeMatrixIndices: selectedNodeData.newNodeMatrixIndices,
|
|
||||||
sitePosY: -selectedNodeData.newSitePosY,
|
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -442,11 +442,11 @@ const nodeSelector = (context: NodeSelectorContext) => {
|
||||||
if (newNodeData) {
|
if (newNodeData) {
|
||||||
return {
|
return {
|
||||||
node: newNodeData.node,
|
node: newNodeData.node,
|
||||||
newNodeMatrixIndices: newNodeData.newNodeMatrixIndices,
|
nodeMatrixIndices: newNodeData.newNodeMatrixIndices,
|
||||||
newActiveHud: newNodeData.newNodeHud,
|
activeHud: newNodeData.newNodeHud,
|
||||||
newSiteRotY: context.siteRotY,
|
siteRotY: context.siteRotY,
|
||||||
newLevel: newNodeData.newLevel,
|
level: newNodeData.newLevel,
|
||||||
newSitePosY: newNodeData.newSitePosY,
|
sitePosY: newNodeData.newSitePosY,
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
36
src/core/utils/bigTextUtils.ts
Normal file
36
src/core/utils/bigTextUtils.ts
Normal file
|
@ -0,0 +1,36 @@
|
||||||
|
export const calculatePosAfterMove = (
|
||||||
|
currentData: {
|
||||||
|
siteRotY: number;
|
||||||
|
sitePosY: number;
|
||||||
|
matrixIndices: { rowIdx: number; colIdx: number; matrixIdx: number };
|
||||||
|
},
|
||||||
|
prevData: { siteRotY: number; sitePosY: number }
|
||||||
|
) => {
|
||||||
|
if (currentData.sitePosY > prevData.sitePosY) {
|
||||||
|
// todo
|
||||||
|
// instead of 1 i need to calculate the amplifier value
|
||||||
|
return { posX: 0, posY: 1 * 1 };
|
||||||
|
} else if (currentData.sitePosY < prevData.sitePosY) {
|
||||||
|
return { posX: 0, posY: -1 * 1 };
|
||||||
|
} else {
|
||||||
|
if (
|
||||||
|
currentData.matrixIndices.colIdx === 0 ||
|
||||||
|
currentData.matrixIndices.colIdx === 3
|
||||||
|
) {
|
||||||
|
if (currentData.siteRotY > prevData.siteRotY) {
|
||||||
|
return { posX: 1.5, posY: 0 };
|
||||||
|
} else if (currentData.siteRotY < prevData.siteRotY) {
|
||||||
|
return { posX: -1.5, posY: 0 };
|
||||||
|
}
|
||||||
|
} else if (
|
||||||
|
currentData.matrixIndices.colIdx === 1 ||
|
||||||
|
currentData.matrixIndices.colIdx === 2
|
||||||
|
) {
|
||||||
|
if (currentData.siteRotY > prevData.siteRotY) {
|
||||||
|
return { posX: 0.5, posY: 0 };
|
||||||
|
} else if (currentData.siteRotY < prevData.siteRotY) {
|
||||||
|
return { posX: -0.5, posY: 0 };
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
21
src/store.ts
21
src/store.ts
|
@ -34,12 +34,6 @@ type State = {
|
||||||
|
|
||||||
intro: boolean;
|
intro: boolean;
|
||||||
|
|
||||||
bigText: string;
|
|
||||||
bigTextVisible: boolean;
|
|
||||||
bigTextColor: "yellow" | "orange";
|
|
||||||
bigTextPos: number[];
|
|
||||||
bigTextXOffset: 0 | -1;
|
|
||||||
|
|
||||||
hud: HUDType;
|
hud: HUDType;
|
||||||
hudActive: boolean;
|
hudActive: boolean;
|
||||||
|
|
||||||
|
@ -148,13 +142,6 @@ export const useStore = create(
|
||||||
// whether or not to play the intro anim
|
// whether or not to play the intro anim
|
||||||
intro: true,
|
intro: true,
|
||||||
|
|
||||||
// big text (the one that displays node names)
|
|
||||||
bigText: "Tda028",
|
|
||||||
bigTextVisible: true,
|
|
||||||
bigTextColor: "yellow",
|
|
||||||
bigTextPos: [-0.35, 0.23, -8.7],
|
|
||||||
bigTextXOffset: 0,
|
|
||||||
|
|
||||||
// hud
|
// hud
|
||||||
hud: {
|
hud: {
|
||||||
mirrored: 0,
|
mirrored: 0,
|
||||||
|
@ -313,14 +300,6 @@ export const useStore = create(
|
||||||
// intro setters
|
// intro setters
|
||||||
setIntro: (to: boolean) => set(() => ({ intro: to })),
|
setIntro: (to: boolean) => set(() => ({ intro: to })),
|
||||||
|
|
||||||
// big text setters
|
|
||||||
setBigText: (to: string) => set(() => ({ bigText: to })),
|
|
||||||
setBigTextVisible: (to: boolean) => set(() => ({ bigTextVisible: to })),
|
|
||||||
setBigTextColor: (to: "yellow" | "orange") =>
|
|
||||||
set(() => ({ bigTextColor: to })),
|
|
||||||
setBigTextPos: (to: number[]) => set(() => ({ bigTextPos: to })),
|
|
||||||
setBigTextXOffset: (to: 0 | -1) => set(() => ({ bigTextXOffset: to })),
|
|
||||||
|
|
||||||
// hud setters
|
// hud setters
|
||||||
setHud: (to: HUDType) => set(() => ({ hud: to })),
|
setHud: (to: HUDType) => set(() => ({ hud: to })),
|
||||||
toggleHudActive: () => set((state) => ({ hudActive: !state.hudActive })),
|
toggleHudActive: () => set((state) => ({ hudActive: !state.hudActive })),
|
||||||
|
|
Loading…
Reference in a new issue