This commit is contained in:
ad044 2020-12-16 20:04:28 +04:00
parent 82436249d1
commit 03ec3d8f89
12 changed files with 70 additions and 45 deletions

View file

@ -139,7 +139,7 @@ const Node = (props: NodeContructorProps) => {
? state.activeNodeState.posX
: props.position[0],
activeNodePosY: useNodeStore.getState().activeNodeState.interactedWith
? level_y_values[props.level as keyof typeof level_y_values]
? 0
: props.position[1],
activeNodePosZ: useNodeStore.getState().activeNodeState.interactedWith
? state.activeNodeState.posZ

View file

@ -43,7 +43,6 @@ const GreenTextRenderer = (props: { visible?: boolean }) => {
>
{textArrRef.current.map((letter, idx) => (
<MediumLetter
color={"yellow"}
letter={letter}
letterIdx={idx}
key={idx}

View file

@ -6,7 +6,6 @@ import { a } from "@react-spring/three";
import React, { useMemo } from "react";
const MediumLetter = (props: {
color: string;
letter: string;
letterIdx: number;
}) => {

View file

@ -46,23 +46,6 @@ const GreenTextManager = (props: StateManagerProps) => {
[setGreenText, setTransformState, toggleActive]
);
const initializeGreenTextForMediaScene = useCallback(
(activeNodeId: string, level: string) => {
setTimeout(() => {
setGreenText((site_a as SiteType)[level][activeNodeId].node_name);
setTransformState(
{
initial: 0,
final: 0.009,
},
"posX"
);
setTransformState(0.675, "posY");
}, 3950);
},
[setGreenText, setTransformState]
);
const dispatchObject = useCallback(
(
event: string,
@ -84,12 +67,8 @@ const GreenTextManager = (props: StateManagerProps) => {
action: toggleAndSetGreenText,
value: [newActiveNodeId, newActiveHudId, newLevel, 500, true],
};
case "throw_node_media":
return {
action: initializeGreenTextForMediaScene,
value: [newActiveNodeId, newLevel],
};
case "toggle_level_selection":
case "level_selection_back":
return {
action: toggleActive,
};
@ -101,7 +80,7 @@ const GreenTextManager = (props: StateManagerProps) => {
};
}
},
[initializeGreenTextForMediaScene, toggleActive, toggleAndSetGreenText]
[toggleActive, toggleAndSetGreenText]
);
useEffect(() => {

View file

@ -57,6 +57,7 @@ const NodeHUDManager = (props: StateManagerProps) => {
value: [targetNodeHudId],
};
case "toggle_level_selection":
case "level_selection_back":
return {
action: toggleActive,
};

View file

@ -14,7 +14,7 @@ const SceneManager = (props: StateManagerProps) => {
return {
action: setScene,
value: newScene,
delay: 3904.704,
delay: 3450,
};
case "exit_select":
case "exit_gate":

View file

@ -206,7 +206,12 @@ const YellowTextManager = (props: StateManagerProps) => {
"posY"
);
setColor("yellow");
setText((site_a as SiteType)[level][activeNodeId].node_name);
const targetText =
activeNodeId === "UNKNOWN"
? "Unknown"
: (site_a as SiteType)[level][activeNodeId].node_name;
setText(targetText);
}, 400);
setTimeout(() => {

View file

@ -59,9 +59,11 @@ const handleMainSceneEvent = (gameContext: any) => {
// in this case we have to check the type of the blue orb
// and dispatch an action depending on that, so we have to precalculate the
// new active blue orb here.
newActiveNodeId = getNodeId(gameContext.activeLevel, nodeMatrixIndices);
newActiveNodeId = getNodeId(level, nodeMatrixIndices);
const nodeType = (site_a as any)[newLevel][newActiveNodeId].type;
const nodeType = (site_a as any)[gameContext.activeLevel][
newActiveNodeId
].type;
const eventAnimation = "throw_node_";
@ -116,9 +118,9 @@ const handleMainSceneEvent = (gameContext: any) => {
case "X":
return {
event: "level_selection_back",
newActiveNodeId: getNodeId(gameContext.level, nodeMatrixIndices),
newActiveNodeId: getNodeId(newLevel, nodeMatrixIndices),
newActiveHudId: getNodeHudId(nodeMatrixIndices),
newLevel: newLevel,
newLevel: newLevel.toString().padStart(2, "0"),
};
case "CIRCLE":
const selectedNodeData = nodeSelector({

View file

@ -93,10 +93,12 @@ const findNodeAfterLevelSelection = (
targetLevel: number,
nodeMatrixIndices: { matrixIdx: number; rowIdx: number; colIdx: number }
) => {
let newMatIndices = nodeMatrixIndices;
let newMatIndices = Object.assign({}, nodeMatrixIndices);
let triedCols: number[] = [];
newMatIndices.rowIdx = 0;
let newNodeId = getNodeId(targetLevel, newMatIndices);
while (!isNodeVisible(newNodeId, unlockedNodes)) {
@ -107,9 +109,15 @@ const findNodeAfterLevelSelection = (
newMatIndices.colIdx = colToTry;
}
} else {
newMatIndices.rowIdx++;
triedCols = [];
newMatIndices.colIdx = 0;
if (newMatIndices.rowIdx === 2) {
newMatIndices.colIdx = nodeMatrixIndices.colIdx;
newNodeId = "UNKNOWN";
break;
} else {
newMatIndices.rowIdx++;
triedCols = [];
newMatIndices.colIdx = 0;
}
}
newNodeId = getNodeId(targetLevel, newMatIndices);
}
@ -254,15 +262,18 @@ const findNodeHorizontal = (
newMatIndices.rowIdx = rowToTry;
}
} else {
if (newMatIndices.colIdx > 3 && didMove) return;
if (newMatIndices.colIdx < 0) {
didMove = true;
if (activeId === "UNKNOWN") {
didMove = true;
newMatIndices.colIdx = nodeMatrixIndices.colIdx;
newMatIndices.matrixIdx =
newMatIndices.matrixIdx + 1 > 8 ? 1 : newMatIndices.matrixIdx + 1;
newNodeId = "UNKNOWN";
break;
} else {
didMove = true;
newMatIndices.colIdx = 0;
newMatIndices.matrixIdx =
newMatIndices.matrixIdx + 1 > 8 ? 1 : newMatIndices.matrixIdx + 1;
@ -281,6 +292,7 @@ const findNodeHorizontal = (
let triedRows: number[] = [];
if (newMatIndices.colIdx > 3) {
didMove = true;
newMatIndices.colIdx = 3;
newMatIndices.matrixIdx =
newMatIndices.matrixIdx - 1 < 1 ? 8 : newMatIndices.matrixIdx - 1;
@ -296,18 +308,26 @@ const findNodeHorizontal = (
newMatIndices.rowIdx = rowToTry;
}
} else {
if (newMatIndices.colIdx < 0 && didMove) return;
if (newMatIndices.colIdx > 3) {
didMove = true;
if (activeId === "UNKNOWN") {
didMove = true;
newMatIndices.colIdx = nodeMatrixIndices.colIdx;
newMatIndices.matrixIdx =
newMatIndices.matrixIdx - 1 < 1 ? 8 : newMatIndices.matrixIdx - 1;
newNodeId = "UNKNOWN";
break;
} else {
newMatIndices.colIdx = 3;
newMatIndices.matrixIdx =
newMatIndices.matrixIdx - 1 < 1 ? 8 : newMatIndices.matrixIdx - 1;
if (didMove) return;
else {
didMove = true;
newMatIndices.colIdx = 3;
newMatIndices.matrixIdx =
newMatIndices.matrixIdx - 1 < 1
? 8
: newMatIndices.matrixIdx - 1;
}
}
} else {
didMove ? newMatIndices.colIdx-- : newMatIndices.colIdx++;

View file

@ -33,7 +33,7 @@ const MainScene = () => {
return (
<perspectiveCamera position-z={3}>
<Suspense fallback={null}>
<MainSceneIntro />
{/*<MainSceneIntro />*/}
<a.group>
<Preloader />
<Site />

View file

@ -1,5 +1,10 @@
import React, { useCallback, useEffect, useMemo } from "react";
import { useMediaStore } from "../store";
import {
useLevelSelectionStore,
useLevelStore,
useMediaStore,
useNodeStore,
} from "../store";
import GreenTextRenderer from "../components/TextRenderer/GreenTextRenderer";
import LeftSide from "../components/MediaScene/Selectables/LeftSide";
import RightSide from "../components/MediaScene/Selectables/RightSide";
@ -10,12 +15,22 @@ import Lof from "../components/MediaScene/Lof";
import { OrbitControls } from "@react-three/drei";
import Images from "../components/MediaScene/Images";
import YellowTextRenderer from "../components/TextRenderer/YellowTextRenderer";
import MediumLetter from "../components/TextRenderer/MediumLetter";
import { a } from "@react-spring/three";
import site_a from "../resources/site_a.json";
import { SiteType } from "../components/MainScene/Site";
const MediaScene = () => {
const mediaComponentMatrixIndices = useMediaStore(
(state) => state.componentMatrixIndices
);
const activeNodeId = useNodeStore((state) => state.activeNodeState.id);
const activeLevel = useLevelStore((state) => state.activeLevel);
const activeNodeName = (site_a as SiteType)[activeLevel][activeNodeId]
.node_name;
const activeMediaComponent = useMediaStore(
useCallback(
(state) =>
@ -45,8 +60,13 @@ const MediaScene = () => {
<MediaLoadingBar />
<NodeNameContainer />
</group>
<group scale={[0.06, 0.12, 0]} position={[0.8, 1.37, 0]}>
{activeNodeName.split("").map((letter, idx) => (
<MediumLetter letter={letter} letterIdx={idx} key={idx} />
))}
</group>
<group position={[0, 0, 0]}>
<GreenTextRenderer />
<YellowTextRenderer />
</group>
<Lof />

View file

@ -390,7 +390,7 @@ export const useSSknStore = create<SSknState>((set) => ({
}));
export const useSceneStore = create<SceneState>((set) => ({
currentScene: "main",
currentScene: "media",
setScene: (to) => set(() => ({ currentScene: to })),
}));