mirror of
https://github.com/ad044/lainTSX.git
synced 2024-10-22 23:19:06 +00:00
basics for word selection in media scene
This commit is contained in:
parent
1e0a412ede
commit
7a10c7cfe0
10 changed files with 144 additions and 11 deletions
|
@ -23,7 +23,10 @@ import gameLoader from "../core/setters/gameLoader";
|
|||
import gameSaver from "../core/setters/gameSaver";
|
||||
|
||||
const KeyPressHandler = () => {
|
||||
const mediaSceneSetters = useMemo(() => [mediaManager, sceneManager], []);
|
||||
const mediaSceneSetters = useMemo(
|
||||
() => [mediaManager, sceneManager, nodeManager, levelManager, siteManager],
|
||||
[]
|
||||
);
|
||||
const ssknSceneSetters = useMemo(() => [ssknManager, sceneManager], []);
|
||||
const mainSceneSetters = useMemo(
|
||||
() => [
|
||||
|
@ -55,7 +58,6 @@ const KeyPressHandler = () => {
|
|||
|
||||
if (keyPress) {
|
||||
timePassedSinceLastKeyPress.current = Date.now();
|
||||
|
||||
const sceneFns = (() => {
|
||||
switch (scene) {
|
||||
case "main":
|
||||
|
@ -76,14 +78,25 @@ const KeyPressHandler = () => {
|
|||
handler: handleSSknSceneEvent,
|
||||
setters: ssknSceneSetters,
|
||||
};
|
||||
case "gate":
|
||||
case "polytan":
|
||||
return {
|
||||
action: () => useStore.setState({ currentScene: "main" }),
|
||||
};
|
||||
}
|
||||
})();
|
||||
|
||||
if (sceneFns) {
|
||||
const { contextProvider, handler, setters } = { ...sceneFns };
|
||||
const ctx = { ...contextProvider(), keyPress: keyPress };
|
||||
const event = handler(ctx);
|
||||
setters.forEach((fn) => fn(event));
|
||||
// in case of polytan/gate we only need to do one thing, which is reset the scene.
|
||||
// we check for that here
|
||||
if (sceneFns.action) {
|
||||
sceneFns.action();
|
||||
} else {
|
||||
const { contextProvider, handler, setters } = { ...sceneFns };
|
||||
const ctx = { ...contextProvider(), keyPress: keyPress };
|
||||
const event = handler(ctx);
|
||||
setters.forEach((fn) => fn(event));
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
|
|
|
@ -103,28 +103,33 @@ const handleMainSceneEvent = (mainSceneContext: any) => {
|
|||
return {
|
||||
event: `${eventAnimation}_media`,
|
||||
scene: "media",
|
||||
siteRotY: siteRotY,
|
||||
};
|
||||
case 6:
|
||||
if (activeNode.node_name.substr(0, 3) === "TaK") {
|
||||
return {
|
||||
event: `${eventAnimation}_tak`,
|
||||
scene: "tak",
|
||||
siteRotY: siteRotY,
|
||||
};
|
||||
} else {
|
||||
return {
|
||||
event: `${eventAnimation}_media`,
|
||||
scene: "media",
|
||||
siteRotY: siteRotY,
|
||||
};
|
||||
}
|
||||
case 8:
|
||||
return {
|
||||
event: `${eventAnimation}_gate`,
|
||||
scene: "gate",
|
||||
siteRotY: siteRotY,
|
||||
};
|
||||
case 7:
|
||||
return {
|
||||
event: `${eventAnimation}_sskn`,
|
||||
scene: "sskn",
|
||||
siteRotY: siteRotY,
|
||||
};
|
||||
}
|
||||
break;
|
||||
|
|
|
@ -1,9 +1,13 @@
|
|||
import { findNodeFromWord } from "../../utils/media-utils";
|
||||
|
||||
const handleMediaKeyPress = (mediaSceneContext: any) => {
|
||||
const {
|
||||
keyPress,
|
||||
activeMediaComponent,
|
||||
wordPosStateIdx,
|
||||
rightSideComponentIdx,
|
||||
activeNode,
|
||||
activeSite,
|
||||
} = mediaSceneContext;
|
||||
|
||||
const calculateNewRightSide = (
|
||||
|
@ -61,7 +65,25 @@ const handleMediaKeyPress = (mediaSceneContext: any) => {
|
|||
};
|
||||
}
|
||||
case "CIRCLE":
|
||||
return { event: `media_${activeMediaComponent}_select` };
|
||||
switch (activeMediaComponent) {
|
||||
case "fstWord":
|
||||
case "sndWord":
|
||||
case "thirdWord":
|
||||
const data = findNodeFromWord(
|
||||
activeMediaComponent,
|
||||
activeNode,
|
||||
activeSite
|
||||
);
|
||||
|
||||
if (data) {
|
||||
return { event: `media_${activeMediaComponent}_select`, ...data };
|
||||
} else {
|
||||
// todo in case node isnt unlocked yet
|
||||
return;
|
||||
}
|
||||
default:
|
||||
return { event: `media_${activeMediaComponent}_select` };
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
|
|
|
@ -9,6 +9,9 @@ const levelManager = (eventState: any) => {
|
|||
case "site_down":
|
||||
case "select_level_up":
|
||||
case "select_level_down":
|
||||
case "media_fstWord_select":
|
||||
case "media_sndWord_select":
|
||||
case "media_thirdWord_select":
|
||||
return { action: () => setActiveLevel(eventState.level) };
|
||||
}
|
||||
};
|
||||
|
|
|
@ -156,6 +156,9 @@ const nodeManager = (eventState: any) => {
|
|||
case "site_right":
|
||||
case "select_level_up":
|
||||
case "select_level_down":
|
||||
case "media_fstWord_select":
|
||||
case "media_sndWord_select":
|
||||
case "media_thirdWord_select":
|
||||
return {
|
||||
action: () => updateActiveNode(eventState.node, 3900),
|
||||
};
|
||||
|
@ -175,7 +178,7 @@ const nodeManager = (eventState: any) => {
|
|||
case "rip_node_sskn":
|
||||
case "rip_node_tak":
|
||||
return {
|
||||
action: () => animateActiveNodeThrow(eventState.siteRotY),
|
||||
action: () => animateShrinkAndRip(eventState.siteRotY),
|
||||
};
|
||||
}
|
||||
};
|
||||
|
|
|
@ -8,6 +8,9 @@ const siteManager = (eventState: any) => {
|
|||
switch (eventState.event) {
|
||||
case "site_left":
|
||||
case "site_right":
|
||||
case "media_fstWord_select":
|
||||
case "media_sndWord_select":
|
||||
case "media_thirdWord_select":
|
||||
return {
|
||||
action: () => setRotY(eventState.siteRotY),
|
||||
delay: 1100,
|
||||
|
|
|
@ -62,12 +62,16 @@ const mediaManager = (eventState: any) => {
|
|||
case "media_leftside_right":
|
||||
case "media_rightside_left":
|
||||
return {
|
||||
action: () => toggleSide,
|
||||
action: () => toggleSide(),
|
||||
};
|
||||
case "media_play_select":
|
||||
return { action: () => playMedia };
|
||||
return { action: () => playMedia() };
|
||||
case "media_exit_select":
|
||||
return { action: () => exitMedia };
|
||||
return { action: () => exitMedia() };
|
||||
case "media_fstWord_select":
|
||||
case "media_sndWord_select":
|
||||
case "media_thirdWord_select":
|
||||
return { action: () => undefined };
|
||||
}
|
||||
};
|
||||
|
||||
|
|
|
@ -24,6 +24,9 @@ const sceneManager = (eventState: any) => {
|
|||
case "media_exit_select":
|
||||
case "exit_gate":
|
||||
case "sskn_cancel_select":
|
||||
case "media_fstWord_select":
|
||||
case "media_sndWord_select":
|
||||
case "media_thirdWord_select":
|
||||
return {
|
||||
action: () =>
|
||||
useStore.setState({ currentScene: "main", intro: false }),
|
||||
|
|
|
@ -465,5 +465,7 @@ export const getMediaSceneContext = () => {
|
|||
],
|
||||
rightSideComponentIdx: state.mediaComponentMatrixIndices.rightSideIdx,
|
||||
wordPosStateIdx: state.mediaWordPosStateIdx,
|
||||
activeNode: state.activeNode,
|
||||
site: state.activeSite,
|
||||
};
|
||||
};
|
||||
|
|
75
src/utils/media-utils.ts
Normal file
75
src/utils/media-utils.ts
Normal file
|
@ -0,0 +1,75 @@
|
|||
import site_a from "../resources/site_a.json";
|
||||
import site_b from "../resources/site_b.json";
|
||||
import node_matrices from "../resources/node_matrices.json";
|
||||
import {
|
||||
NodeDataType,
|
||||
SiteType,
|
||||
} from "../components/MainScene/SyncedComponents/Site";
|
||||
import { NodeLib } from "three/examples/jsm/nodes/core/NodeLib";
|
||||
import { isNodeVisible } from "./node-utils";
|
||||
|
||||
export const findNodeFromWord = (
|
||||
wordLabel: string,
|
||||
activeNode: NodeDataType,
|
||||
site: string
|
||||
) => {
|
||||
const labelToIdx = (() => {
|
||||
switch (wordLabel) {
|
||||
case "fstWord":
|
||||
return 1;
|
||||
case "sndWord":
|
||||
return 2;
|
||||
case "thirdWord":
|
||||
return 3;
|
||||
}
|
||||
})();
|
||||
|
||||
const wordToFind = activeNode.words[labelToIdx!];
|
||||
|
||||
const siteData: SiteType = site === "a" ? site_a : site_b;
|
||||
|
||||
const nodesWithSameWords = Object.values(siteData)
|
||||
.flatMap((level) =>
|
||||
Object.values(level).filter((node) =>
|
||||
Object.values(node.words).includes(wordToFind)
|
||||
)
|
||||
)
|
||||
.sort((a, b) => (a.node_name > b.node_name ? 1 : -1));
|
||||
|
||||
const chosenNode =
|
||||
nodesWithSameWords[
|
||||
nodesWithSameWords.findIndex(
|
||||
(node) => node.node_name === activeNode.node_name
|
||||
) + 1
|
||||
] ?? nodesWithSameWords[0];
|
||||
|
||||
//todo check if visible
|
||||
const pos = chosenNode.id.substr(2);
|
||||
|
||||
const matIdx = Object.entries(node_matrices).flatMap((matrixData) =>
|
||||
matrixData[1].filter((row) => row[0] === pos).length > 0
|
||||
? matrixData[0]
|
||||
: []
|
||||
)[0];
|
||||
|
||||
const rotValues = {
|
||||
"1": 6 * (-Math.PI / 4),
|
||||
"2": 5 * (-Math.PI / 4),
|
||||
"3": 4 * (-Math.PI / 4),
|
||||
"4": 3 * (-Math.PI / 4),
|
||||
"5": 2 * (-Math.PI / 4),
|
||||
"6": -Math.PI / 4,
|
||||
"7": 0,
|
||||
"8": Math.PI / 4,
|
||||
};
|
||||
|
||||
console.log(chosenNode);
|
||||
return {
|
||||
node: {
|
||||
...chosenNode,
|
||||
matrixIndices: { colIdx: 0, matrixIdx: matIdx, rowIdx: 0 },
|
||||
},
|
||||
siteRotY: rotValues[matIdx as keyof typeof rotValues],
|
||||
level: chosenNode.id.substr(0, 2),
|
||||
};
|
||||
};
|
Loading…
Reference in a new issue