mirror of
https://github.com/ad044/lainTSX.git
synced 2024-10-22 23:19:06 +00:00
more bugfixing
This commit is contained in:
parent
cb5cf6a1c1
commit
e19ad4548b
12 changed files with 211 additions and 103 deletions
|
@ -1,9 +1,19 @@
|
||||||
import React, { memo, Suspense, useEffect, useState } from "react";
|
import React, {
|
||||||
|
memo,
|
||||||
|
Suspense,
|
||||||
|
useCallback,
|
||||||
|
useEffect,
|
||||||
|
useMemo,
|
||||||
|
useState,
|
||||||
|
} from "react";
|
||||||
import { a, useSpring } from "@react-spring/three";
|
import { a, useSpring } from "@react-spring/three";
|
||||||
import { useSiteStore } from "../../store";
|
import { useLevelStore, useNodeStore, useSiteStore } from "../../store";
|
||||||
import ActiveLevelNodes from "./Site/ActiveLevelNodes";
|
import ActiveLevelNodes from "./Site/ActiveLevelNodes";
|
||||||
import InactiveLevelNodes from "./Site/InactiveLevelNodes";
|
import InactiveLevelNodes from "./Site/InactiveLevelNodes";
|
||||||
import Rings from "./Site/Rings";
|
import Rings from "./Site/Rings";
|
||||||
|
import site_a from "../../resources/site_a.json";
|
||||||
|
import site_b from "../../resources/site_b.json";
|
||||||
|
import game_progress from "../../resources/initial_progress.json";
|
||||||
|
|
||||||
export type NodeDataType = {
|
export type NodeDataType = {
|
||||||
image_table_indices: { 1: string; 2: string; 3: string };
|
image_table_indices: { 1: string; 2: string; 3: string };
|
||||||
|
@ -28,6 +38,13 @@ export type SiteType = {
|
||||||
[key: string]: LevelType;
|
[key: string]: LevelType;
|
||||||
};
|
};
|
||||||
|
|
||||||
|
export type NodesProps = {
|
||||||
|
currentSite: "a" | "b";
|
||||||
|
activeLevel: string;
|
||||||
|
siteData: typeof site_a | typeof site_b;
|
||||||
|
gameProgress: typeof game_progress;
|
||||||
|
};
|
||||||
|
|
||||||
const Site = () => {
|
const Site = () => {
|
||||||
const siteTransformState = useSiteStore((state) => state.transformState);
|
const siteTransformState = useSiteStore((state) => state.transformState);
|
||||||
const introAnim = useSiteStore((state) => state.introAnim);
|
const introAnim = useSiteStore((state) => state.introAnim);
|
||||||
|
@ -46,6 +63,16 @@ const Site = () => {
|
||||||
config: { duration: 3900 },
|
config: { duration: 3900 },
|
||||||
});
|
});
|
||||||
|
|
||||||
|
const gameProgress = useNodeStore((state) => state.gameProgress);
|
||||||
|
|
||||||
|
const currentSite = useSiteStore((state) => state.currentSite);
|
||||||
|
|
||||||
|
const siteData = useMemo(() => (currentSite === "a" ? site_a : site_b), [
|
||||||
|
currentSite,
|
||||||
|
]);
|
||||||
|
|
||||||
|
const activeLevel = useLevelStore((state) => state.activeLevel);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Suspense fallback={null}>
|
<Suspense fallback={null}>
|
||||||
<a.group
|
<a.group
|
||||||
|
@ -57,8 +84,18 @@ const Site = () => {
|
||||||
rotation-y={siteState.siteRotY}
|
rotation-y={siteState.siteRotY}
|
||||||
position-y={siteState.sitePosY}
|
position-y={siteState.sitePosY}
|
||||||
>
|
>
|
||||||
<ActiveLevelNodes />
|
<ActiveLevelNodes
|
||||||
<InactiveLevelNodes />
|
currentSite={currentSite}
|
||||||
|
activeLevel={activeLevel}
|
||||||
|
siteData={siteData}
|
||||||
|
gameProgress={gameProgress}
|
||||||
|
/>
|
||||||
|
<InactiveLevelNodes
|
||||||
|
currentSite={currentSite}
|
||||||
|
activeLevel={activeLevel}
|
||||||
|
siteData={siteData}
|
||||||
|
gameProgress={gameProgress}
|
||||||
|
/>
|
||||||
<Rings />
|
<Rings />
|
||||||
</a.group>
|
</a.group>
|
||||||
</a.group>
|
</a.group>
|
||||||
|
|
|
@ -1,30 +1,25 @@
|
||||||
import React, { useMemo } from "react";
|
import React, {useEffect, useMemo} from "react";
|
||||||
import Node from "../Node";
|
import Node from "../Node";
|
||||||
import node_positions from "../../../resources/node_positions.json";
|
import node_positions from "../../../resources/node_positions.json";
|
||||||
import site_a from "../../../resources/site_a.json";
|
import { useNodeStore } from "../../../store";
|
||||||
import { useLevelStore, useNodeStore, useSiteStore } from "../../../store";
|
|
||||||
import { isNodeVisible } from "../../../core/nodeSelector";
|
import { isNodeVisible } from "../../../core/nodeSelector";
|
||||||
import site_b from "../../../resources/site_b.json";
|
import { NodesProps } from "../Site";
|
||||||
|
|
||||||
const ActiveLevelNodes = () => {
|
|
||||||
const gameProgress = useNodeStore((state) => state.gameProgress);
|
|
||||||
|
|
||||||
const currentSite = useSiteStore((state) => state.currentSite);
|
|
||||||
|
|
||||||
const siteData = currentSite === "a" ? site_a : site_b;
|
|
||||||
|
|
||||||
|
const ActiveLevelNodes = (props: NodesProps) => {
|
||||||
const activeNodeState = useNodeStore((state) => state.activeNodeState);
|
const activeNodeState = useNodeStore((state) => state.activeNodeState);
|
||||||
const activeLevel = useLevelStore((state) => state.activeLevel);
|
|
||||||
|
|
||||||
const activeLevelNodes = useMemo(
|
const activeLevelNodes = useMemo(
|
||||||
() => siteData[activeLevel as keyof typeof siteData],
|
() => props.siteData[props.activeLevel as keyof typeof props.siteData],
|
||||||
[activeLevel, siteData]
|
[props]
|
||||||
);
|
);
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
console.log("sex")
|
||||||
|
})
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
{Object.entries(activeLevelNodes).map((node: [string, any]) => {
|
{Object.entries(activeLevelNodes).map((node: [string, any]) => {
|
||||||
if (isNodeVisible(node[0], gameProgress, currentSite)) {
|
if (isNodeVisible(node[0], props.gameProgress, props.currentSite)) {
|
||||||
return (
|
return (
|
||||||
<Node
|
<Node
|
||||||
sprite={node[1].node_name}
|
sprite={node[1].node_name}
|
||||||
|
|
|
@ -1,21 +1,13 @@
|
||||||
import React, { useMemo } from "react";
|
import React, { useMemo } from "react";
|
||||||
import site_a from "../../../resources/site_a.json";
|
|
||||||
import site_b from "../../../resources/site_b.json";
|
|
||||||
import node_positions from "../../../resources/node_positions.json";
|
import node_positions from "../../../resources/node_positions.json";
|
||||||
import Node from "../Node";
|
import Node from "../Node";
|
||||||
import { useLevelStore, useNodeStore, useSiteStore } from "../../../store";
|
|
||||||
import { isNodeVisible } from "../../../core/nodeSelector";
|
import { isNodeVisible } from "../../../core/nodeSelector";
|
||||||
|
import { NodesProps } from "../Site";
|
||||||
|
|
||||||
const InactiveLevelNodes = () => {
|
const InactiveLevelNodes = (props: NodesProps) => {
|
||||||
const gameProgress = useNodeStore((state) => state.gameProgress);
|
|
||||||
const currentSite = useSiteStore((state) => state.currentSite);
|
|
||||||
|
|
||||||
const siteData = currentSite === "a" ? site_a : site_b;
|
|
||||||
|
|
||||||
const activeLevel = useLevelStore((state) => state.activeLevel);
|
|
||||||
const visibleNodes = useMemo(() => {
|
const visibleNodes = useMemo(() => {
|
||||||
const obj = {};
|
const obj = {};
|
||||||
const activeLevelNr = parseInt(activeLevel);
|
const activeLevelNr = parseInt(props.activeLevel);
|
||||||
const visibleLevels = [
|
const visibleLevels = [
|
||||||
(activeLevelNr - 2).toString().padStart(2, "0"),
|
(activeLevelNr - 2).toString().padStart(2, "0"),
|
||||||
(activeLevelNr - 1).toString().padStart(2, "0"),
|
(activeLevelNr - 1).toString().padStart(2, "0"),
|
||||||
|
@ -24,16 +16,16 @@ const InactiveLevelNodes = () => {
|
||||||
];
|
];
|
||||||
|
|
||||||
visibleLevels.forEach((level) => {
|
visibleLevels.forEach((level) => {
|
||||||
Object.assign(obj, siteData[level as keyof typeof siteData]);
|
Object.assign(obj, props.siteData[level as keyof typeof props.siteData]);
|
||||||
});
|
});
|
||||||
|
|
||||||
return obj;
|
return obj;
|
||||||
}, [activeLevel, siteData]);
|
}, [props]);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
{Object.entries(visibleNodes).map((node: [string, any]) => {
|
{Object.entries(visibleNodes).map((node: [string, any]) => {
|
||||||
if (isNodeVisible(node[0], gameProgress, currentSite)) {
|
if (isNodeVisible(node[0], props.gameProgress, props.currentSite)) {
|
||||||
return (
|
return (
|
||||||
<Node
|
<Node
|
||||||
sprite={node[1].node_name}
|
sprite={node[1].node_name}
|
||||||
|
|
|
@ -34,6 +34,7 @@ import LevelSelectionManager from "./LevelSelectionManager";
|
||||||
import SubsceneManager from "./SubsceneManager";
|
import SubsceneManager from "./SubsceneManager";
|
||||||
import PauseComponentManager from "./PauseComponentManager";
|
import PauseComponentManager from "./PauseComponentManager";
|
||||||
import MediaYellowTextManager from "./MediaYellowTextManager";
|
import MediaYellowTextManager from "./MediaYellowTextManager";
|
||||||
|
import SiteSaveManager from "./SiteSaveManager";
|
||||||
|
|
||||||
const getKeyCodeAssociation = (keyCode: number): string => {
|
const getKeyCodeAssociation = (keyCode: number): string => {
|
||||||
const keyCodeAssocs = {
|
const keyCodeAssocs = {
|
||||||
|
@ -241,6 +242,7 @@ const EventManager = () => {
|
||||||
<SubsceneManager eventState={eventState!} />
|
<SubsceneManager eventState={eventState!} />
|
||||||
<PauseComponentManager eventState={eventState!} />
|
<PauseComponentManager eventState={eventState!} />
|
||||||
<MediaYellowTextManager eventState={eventState!} />
|
<MediaYellowTextManager eventState={eventState!} />
|
||||||
|
<SiteSaveManager eventState={eventState!} />
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
|
@ -1,12 +1,15 @@
|
||||||
import { useCallback, useEffect } from "react";
|
import { useCallback, useEffect } from "react";
|
||||||
import { StateManagerProps } from "./EventManager";
|
import { StateManagerProps } from "./EventManager";
|
||||||
import { useLevelStore } from "../../store";
|
import { useLevelStore, useSiteSaveStore } from "../../store";
|
||||||
|
|
||||||
|
|
||||||
const LevelManager = (props: StateManagerProps) => {
|
const LevelManager = (props: StateManagerProps) => {
|
||||||
const setActiveLevel = useLevelStore((state) => state.setActiveLevel);
|
const setActiveLevel = useLevelStore((state) => state.setActiveLevel);
|
||||||
|
const siteASaveState = useSiteSaveStore((state) => state.a);
|
||||||
|
const siteBSaveState = useSiteSaveStore((state) => state.b);
|
||||||
|
|
||||||
const dispatchObject = useCallback(
|
const dispatchObject = useCallback(
|
||||||
(event: string, newLevel: string) => {
|
(event: string, newLevel: string, newSite: string) => {
|
||||||
switch (event) {
|
switch (event) {
|
||||||
case "site_up":
|
case "site_up":
|
||||||
case "site_down":
|
case "site_down":
|
||||||
|
@ -22,21 +25,29 @@ const LevelManager = (props: StateManagerProps) => {
|
||||||
value: newLevel,
|
value: newLevel,
|
||||||
delay: 1500,
|
delay: 1500,
|
||||||
};
|
};
|
||||||
|
case "pause_change_select":
|
||||||
|
return {
|
||||||
|
action: setActiveLevel,
|
||||||
|
value: [
|
||||||
|
newSite === "a" ? siteASaveState.level : siteBSaveState.level,
|
||||||
|
],
|
||||||
|
};
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
[setActiveLevel]
|
[setActiveLevel, siteASaveState.level, siteBSaveState.level]
|
||||||
);
|
);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (props.eventState) {
|
if (props.eventState) {
|
||||||
const eventAction = props.eventState.event;
|
const eventAction = props.eventState.event;
|
||||||
const newLevel = props.eventState.newLevel;
|
const newLevel = props.eventState.newLevel;
|
||||||
|
const newSite = props.eventState.newSite;
|
||||||
|
|
||||||
const dispatchedObject = dispatchObject(eventAction, newLevel);
|
const dispatchedObject = dispatchObject(eventAction, newLevel, newSite);
|
||||||
|
|
||||||
if (dispatchedObject) {
|
if (dispatchedObject) {
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
dispatchedObject.action(dispatchedObject.value);
|
dispatchedObject.action(dispatchedObject.value as any);
|
||||||
}, dispatchedObject.delay);
|
}, dispatchedObject.delay);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -124,7 +124,7 @@ const NodeManager = (props: StateManagerProps) => {
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
[animateActiveNodeThrow, updateActiveNode]
|
[animateActiveNodeThrow, setAfterChangeSite, updateActiveNode]
|
||||||
);
|
);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
|
|
|
@ -1,9 +1,10 @@
|
||||||
import { useCallback, useEffect } from "react";
|
import { useCallback, useEffect } from "react";
|
||||||
import { StateManagerProps } from "./EventManager";
|
import { StateManagerProps } from "./EventManager";
|
||||||
import { useSceneStore } from "../../store";
|
import { useMainSceneStore, useSceneStore } from "../../store";
|
||||||
|
|
||||||
const SceneManager = (props: StateManagerProps) => {
|
const SceneManager = (props: StateManagerProps) => {
|
||||||
const setScene = useSceneStore((state) => state.setScene);
|
const setScene = useSceneStore((state) => state.setScene);
|
||||||
|
const setMainSceneIntro = useMainSceneStore((state) => state.setIntro);
|
||||||
|
|
||||||
const dispatchObject = useCallback(
|
const dispatchObject = useCallback(
|
||||||
(event: string, newScene: string) => {
|
(event: string, newScene: string) => {
|
||||||
|
@ -16,6 +17,7 @@ const SceneManager = (props: StateManagerProps) => {
|
||||||
action: setScene,
|
action: setScene,
|
||||||
value: newScene,
|
value: newScene,
|
||||||
delay: 3450,
|
delay: 3450,
|
||||||
|
setMainSceneIntro: false,
|
||||||
};
|
};
|
||||||
case "media_exit_select":
|
case "media_exit_select":
|
||||||
case "exit_gate":
|
case "exit_gate":
|
||||||
|
@ -36,6 +38,7 @@ const SceneManager = (props: StateManagerProps) => {
|
||||||
action: setScene,
|
action: setScene,
|
||||||
value: "change_disc",
|
value: "change_disc",
|
||||||
delay: 0,
|
delay: 0,
|
||||||
|
setMainSceneIntro: true,
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -53,9 +56,16 @@ const SceneManager = (props: StateManagerProps) => {
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
dispatchedObject.action(dispatchedObject.value);
|
dispatchedObject.action(dispatchedObject.value);
|
||||||
}, dispatchedObject.delay);
|
}, dispatchedObject.delay);
|
||||||
|
if (dispatchedObject.setMainSceneIntro !== undefined) {
|
||||||
|
if (dispatchedObject.setMainSceneIntro) {
|
||||||
|
setMainSceneIntro(true);
|
||||||
|
} else {
|
||||||
|
setMainSceneIntro(false);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}, [props.eventState, dispatchObject]);
|
}
|
||||||
|
}
|
||||||
|
}, [props.eventState, dispatchObject, setMainSceneIntro]);
|
||||||
|
|
||||||
return null;
|
return null;
|
||||||
};
|
};
|
||||||
|
|
|
@ -5,34 +5,13 @@ import { StateManagerProps } from "./EventManager";
|
||||||
const SiteManager = (props: StateManagerProps) => {
|
const SiteManager = (props: StateManagerProps) => {
|
||||||
const setTransformState = useSiteStore((state) => state.setTransformState);
|
const setTransformState = useSiteStore((state) => state.setTransformState);
|
||||||
const setCurrentSite = useSiteStore((state) => state.setCurrentSite);
|
const setCurrentSite = useSiteStore((state) => state.setCurrentSite);
|
||||||
const setIntroAnim = useSiteStore((state) => state.setIntroAnim);
|
|
||||||
|
|
||||||
const setSiteSaveState = useSiteSaveStore((state) => state.setSiteSaveState);
|
|
||||||
const siteASaveState = useSiteSaveStore((state) => state.a);
|
const siteASaveState = useSiteSaveStore((state) => state.a);
|
||||||
const siteBSaveState = useSiteSaveStore((state) => state.b);
|
const siteBSaveState = useSiteSaveStore((state) => state.b);
|
||||||
|
|
||||||
const changeSite = useCallback(
|
const changeSite = useCallback(
|
||||||
(
|
(newSite: string) => {
|
||||||
currentSite: string,
|
|
||||||
activeNodeId: string,
|
|
||||||
activeNodeMatrixIndices: {
|
|
||||||
matrixIdx: number;
|
|
||||||
rowIdx: number;
|
|
||||||
colIdx: number;
|
|
||||||
},
|
|
||||||
siteRotY: number,
|
|
||||||
sitePosY: number,
|
|
||||||
newSite: string
|
|
||||||
) => {
|
|
||||||
setTransformState(0, "rotX");
|
setTransformState(0, "rotX");
|
||||||
setIntroAnim(true);
|
|
||||||
|
|
||||||
setSiteSaveState(currentSite, {
|
|
||||||
activeNodeId: activeNodeId,
|
|
||||||
nodeMatrixIndices: activeNodeMatrixIndices,
|
|
||||||
siteRotY: siteRotY,
|
|
||||||
sitePosY: sitePosY,
|
|
||||||
});
|
|
||||||
|
|
||||||
const siteToLoad = newSite === "a" ? siteASaveState : siteBSaveState;
|
const siteToLoad = newSite === "a" ? siteASaveState : siteBSaveState;
|
||||||
|
|
||||||
|
@ -40,14 +19,7 @@ const SiteManager = (props: StateManagerProps) => {
|
||||||
setTransformState(siteToLoad.siteRotY, "rotY");
|
setTransformState(siteToLoad.siteRotY, "rotY");
|
||||||
setTransformState(siteToLoad.sitePosY, "posY");
|
setTransformState(siteToLoad.sitePosY, "posY");
|
||||||
},
|
},
|
||||||
[
|
[setCurrentSite, setTransformState, siteASaveState, siteBSaveState]
|
||||||
setCurrentSite,
|
|
||||||
setIntroAnim,
|
|
||||||
setSiteSaveState,
|
|
||||||
setTransformState,
|
|
||||||
siteASaveState,
|
|
||||||
siteBSaveState,
|
|
||||||
]
|
|
||||||
);
|
);
|
||||||
|
|
||||||
const dispatchObject = useCallback(
|
const dispatchObject = useCallback(
|
||||||
|
@ -56,13 +28,7 @@ const SiteManager = (props: StateManagerProps) => {
|
||||||
newSitePosY: number,
|
newSitePosY: number,
|
||||||
newSiteRotY: number,
|
newSiteRotY: number,
|
||||||
currentSite: string,
|
currentSite: string,
|
||||||
newSite: string,
|
newSite: string
|
||||||
activeNodeId: string,
|
|
||||||
activeNodeMatrixIndices: {
|
|
||||||
matrixIdx: number;
|
|
||||||
rowIdx: number;
|
|
||||||
colIdx: number;
|
|
||||||
}
|
|
||||||
) => {
|
) => {
|
||||||
switch (event) {
|
switch (event) {
|
||||||
case "site_up":
|
case "site_up":
|
||||||
|
@ -96,14 +62,7 @@ const SiteManager = (props: StateManagerProps) => {
|
||||||
case "pause_change_select":
|
case "pause_change_select":
|
||||||
return {
|
return {
|
||||||
action: changeSite,
|
action: changeSite,
|
||||||
value: [
|
value: [newSite],
|
||||||
currentSite,
|
|
||||||
activeNodeId,
|
|
||||||
activeNodeMatrixIndices,
|
|
||||||
newSiteRotY,
|
|
||||||
newSitePosY,
|
|
||||||
newSite,
|
|
||||||
],
|
|
||||||
actionDelay: 0,
|
actionDelay: 0,
|
||||||
};
|
};
|
||||||
case "throw_node_media":
|
case "throw_node_media":
|
||||||
|
@ -121,8 +80,6 @@ const SiteManager = (props: StateManagerProps) => {
|
||||||
const eventAction = props.eventState.event;
|
const eventAction = props.eventState.event;
|
||||||
const newSiteRotY = props.eventState.newSiteRotY;
|
const newSiteRotY = props.eventState.newSiteRotY;
|
||||||
const newSitePosY = props.eventState.newSitePosY;
|
const newSitePosY = props.eventState.newSitePosY;
|
||||||
const activeNodeId = props.eventState.activeNodeId;
|
|
||||||
const activeNodeMatrixIndices = props.eventState.activeNodeMatrixIndices;
|
|
||||||
|
|
||||||
const currentSite = props.eventState.currentSite;
|
const currentSite = props.eventState.currentSite;
|
||||||
const newSite = props.eventState.newSite;
|
const newSite = props.eventState.newSite;
|
||||||
|
@ -132,9 +89,7 @@ const SiteManager = (props: StateManagerProps) => {
|
||||||
newSitePosY,
|
newSitePosY,
|
||||||
newSiteRotY,
|
newSiteRotY,
|
||||||
currentSite,
|
currentSite,
|
||||||
newSite,
|
newSite
|
||||||
activeNodeId,
|
|
||||||
activeNodeMatrixIndices
|
|
||||||
);
|
);
|
||||||
|
|
||||||
if (dispatchedObject) {
|
if (dispatchedObject) {
|
||||||
|
|
78
src/core/StateManagers/SiteSaveManager.tsx
Normal file
78
src/core/StateManagers/SiteSaveManager.tsx
Normal file
|
@ -0,0 +1,78 @@
|
||||||
|
import { useCallback, useEffect } from "react";
|
||||||
|
import { useSiteSaveStore } from "../../store";
|
||||||
|
import { StateManagerProps } from "./EventManager";
|
||||||
|
|
||||||
|
const SiteSaveManager = (props: StateManagerProps) => {
|
||||||
|
const setSiteSaveState = useSiteSaveStore((state) => state.setSiteSaveState);
|
||||||
|
|
||||||
|
const dispatchObject = useCallback(
|
||||||
|
(
|
||||||
|
event: string,
|
||||||
|
sitePosY: number,
|
||||||
|
siteRotY: number,
|
||||||
|
currentSite: string,
|
||||||
|
newSite: string,
|
||||||
|
activeNodeId: string,
|
||||||
|
activeNodeMatrixIndices: {
|
||||||
|
matrixIdx: number;
|
||||||
|
rowIdx: number;
|
||||||
|
colIdx: number;
|
||||||
|
},
|
||||||
|
level: string
|
||||||
|
) => {
|
||||||
|
switch (event) {
|
||||||
|
case "pause_change_select":
|
||||||
|
return {
|
||||||
|
action: setSiteSaveState,
|
||||||
|
value: [
|
||||||
|
currentSite,
|
||||||
|
{
|
||||||
|
activeNodeId: activeNodeId,
|
||||||
|
nodeMatrixIndices: activeNodeMatrixIndices,
|
||||||
|
siteRotY: siteRotY,
|
||||||
|
sitePosY: sitePosY,
|
||||||
|
level: level.toString().padStart(2, "0"),
|
||||||
|
},
|
||||||
|
],
|
||||||
|
actionDelay: 0,
|
||||||
|
};
|
||||||
|
}
|
||||||
|
},
|
||||||
|
[setSiteSaveState]
|
||||||
|
);
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
if (props.eventState) {
|
||||||
|
const eventAction = props.eventState.event;
|
||||||
|
const siteRotY = props.eventState.currentSiteRotY;
|
||||||
|
const sitePosY = props.eventState.currentSitePosY;
|
||||||
|
const activeNodeId = props.eventState.currentActiveNodeId;
|
||||||
|
const activeNodeMatrixIndices =
|
||||||
|
props.eventState.currentActiveNodeMatrixIndices;
|
||||||
|
const newLevel = props.eventState.currentLevel;
|
||||||
|
|
||||||
|
const currentSite = props.eventState.currentSite;
|
||||||
|
const newSite = props.eventState.newSite;
|
||||||
|
|
||||||
|
const dispatchedObject = dispatchObject(
|
||||||
|
eventAction,
|
||||||
|
sitePosY,
|
||||||
|
siteRotY,
|
||||||
|
currentSite,
|
||||||
|
newSite,
|
||||||
|
activeNodeId,
|
||||||
|
activeNodeMatrixIndices,
|
||||||
|
newLevel
|
||||||
|
);
|
||||||
|
|
||||||
|
if (dispatchedObject) {
|
||||||
|
setTimeout(() => {
|
||||||
|
dispatchedObject.action.apply(null, dispatchedObject.value as any);
|
||||||
|
}, dispatchedObject.actionDelay);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}, [dispatchObject, props.eventState]);
|
||||||
|
return null;
|
||||||
|
};
|
||||||
|
|
||||||
|
export default SiteSaveManager;
|
|
@ -191,10 +191,11 @@ const handleMainSceneEvent = (gameContext: any) => {
|
||||||
return {
|
return {
|
||||||
event: `pause_${activePauseComponent}_select`,
|
event: `pause_${activePauseComponent}_select`,
|
||||||
currentSite: currentSite,
|
currentSite: currentSite,
|
||||||
newSitePosY: newSitePosY,
|
currentSitePosY: newSitePosY,
|
||||||
newSiteRotY: newSiteRotY,
|
currentSiteRotY: newSiteRotY,
|
||||||
activeNodeId: newActiveNodeId,
|
currentActiveNodeId: newActiveNodeId,
|
||||||
activeNodeMatrixIndices: nodeMatrixIndices,
|
currentActiveNodeMatrixIndices: nodeMatrixIndices,
|
||||||
|
currentLevel: newLevel,
|
||||||
newSite: currentSite === "a" ? "b" : "a",
|
newSite: currentSite === "a" ? "b" : "a",
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
import { a } from "@react-spring/three";
|
import { a } from "@react-spring/three";
|
||||||
import { OrbitControls } from "@react-three/drei";
|
import { OrbitControls } from "@react-three/drei";
|
||||||
import React, { Suspense } from "react";
|
import React, { Suspense, useMemo } from "react";
|
||||||
import Site from "../components/MainScene/Site";
|
import Site from "../components/MainScene/Site";
|
||||||
import Lain from "../components/MainScene/Lain";
|
import Lain from "../components/MainScene/Lain";
|
||||||
import Preloader from "../components/Preloader";
|
import Preloader from "../components/Preloader";
|
||||||
|
@ -18,7 +18,9 @@ import Starfield from "../components/MainScene/Starfield/Starfield";
|
||||||
const MainScene = () => {
|
const MainScene = () => {
|
||||||
const currentSubscene = useMainSceneStore((state) => state.subscene);
|
const currentSubscene = useMainSceneStore((state) => state.subscene);
|
||||||
|
|
||||||
const isPaused = currentSubscene === "pause";
|
const isPaused = useMemo(() => currentSubscene === "pause", [
|
||||||
|
currentSubscene,
|
||||||
|
]);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<perspectiveCamera position-z={3}>
|
<perspectiveCamera position-z={3}>
|
||||||
|
|
37
src/store.ts
37
src/store.ts
|
@ -4,6 +4,23 @@ import * as THREE from "three";
|
||||||
import authorize_user_letters from "./resources/authorize_user_letters.json";
|
import authorize_user_letters from "./resources/authorize_user_letters.json";
|
||||||
import game_progress from "./resources/initial_progress.json";
|
import game_progress from "./resources/initial_progress.json";
|
||||||
|
|
||||||
|
type SiteSaveState = {
|
||||||
|
a: {
|
||||||
|
activeNodeId: string;
|
||||||
|
nodeMatrixIndices: { matrixIdx: number; rowIdx: number; colIdx: number };
|
||||||
|
siteRotY: number;
|
||||||
|
sitePosY: number;
|
||||||
|
level: string;
|
||||||
|
};
|
||||||
|
b: {
|
||||||
|
activeNodeId: string;
|
||||||
|
nodeMatrixIndices: { matrixIdx: number; rowIdx: number; colIdx: number };
|
||||||
|
siteRotY: number;
|
||||||
|
sitePosY: number;
|
||||||
|
level: string;
|
||||||
|
};
|
||||||
|
};
|
||||||
|
|
||||||
type PauseState = {
|
type PauseState = {
|
||||||
exitAnimation: boolean;
|
exitAnimation: boolean;
|
||||||
componentMatrix: string[];
|
componentMatrix: string[];
|
||||||
|
@ -58,7 +75,6 @@ type StarfieldState = {
|
||||||
};
|
};
|
||||||
|
|
||||||
type SiteState = {
|
type SiteState = {
|
||||||
introAnim: boolean;
|
|
||||||
currentSite: "a" | "b";
|
currentSite: "a" | "b";
|
||||||
transformState: {
|
transformState: {
|
||||||
posY: number;
|
posY: number;
|
||||||
|
@ -156,8 +172,10 @@ type SSknState = {
|
||||||
};
|
};
|
||||||
|
|
||||||
type MainSceneState = {
|
type MainSceneState = {
|
||||||
|
intro: boolean;
|
||||||
subscene: string;
|
subscene: string;
|
||||||
setSubscene: (to: string) => void;
|
setSubscene: (to: string) => void;
|
||||||
|
setIntro: (to: boolean) => void;
|
||||||
};
|
};
|
||||||
|
|
||||||
export type MediaBigTextState = {
|
export type MediaBigTextState = {
|
||||||
|
@ -304,7 +322,6 @@ export const useStarfieldStore = create<StarfieldState>((set) => ({
|
||||||
export const useSiteStore = create(
|
export const useSiteStore = create(
|
||||||
combine(
|
combine(
|
||||||
{
|
{
|
||||||
introAnim: true,
|
|
||||||
currentSite: "a",
|
currentSite: "a",
|
||||||
transformState: {
|
transformState: {
|
||||||
posY: 0,
|
posY: 0,
|
||||||
|
@ -319,7 +336,6 @@ export const useSiteStore = create(
|
||||||
})),
|
})),
|
||||||
setCurrentSite: (to: string) =>
|
setCurrentSite: (to: string) =>
|
||||||
set(() => ({ currentSite: to as "a" | "b" })),
|
set(() => ({ currentSite: to as "a" | "b" })),
|
||||||
setIntroAnim: (to: boolean) => set(() => ({ introAnim: to })),
|
|
||||||
})
|
})
|
||||||
)
|
)
|
||||||
);
|
);
|
||||||
|
@ -446,8 +462,10 @@ export const useAuthorizeUserStore = create<AuthorizeUserState>((set) => ({
|
||||||
}));
|
}));
|
||||||
|
|
||||||
export const useMainSceneStore = create<MainSceneState>((set) => ({
|
export const useMainSceneStore = create<MainSceneState>((set) => ({
|
||||||
|
intro: true,
|
||||||
subscene: "site",
|
subscene: "site",
|
||||||
setSubscene: (to) => set(() => ({ subscene: to })),
|
setSubscene: (to) => set(() => ({ subscene: to })),
|
||||||
|
setIntro: (to) => set(() => ({ intro: to })),
|
||||||
}));
|
}));
|
||||||
|
|
||||||
export const useBootStore = create(
|
export const useBootStore = create(
|
||||||
|
@ -534,24 +552,31 @@ export const useSiteSaveStore = create(
|
||||||
nodeMatrixIndices: { matrixIdx: 7, rowIdx: 0, colIdx: 0 },
|
nodeMatrixIndices: { matrixIdx: 7, rowIdx: 0, colIdx: 0 },
|
||||||
siteRotY: 0,
|
siteRotY: 0,
|
||||||
sitePosY: 0,
|
sitePosY: 0,
|
||||||
|
level: "04",
|
||||||
},
|
},
|
||||||
b: {
|
b: {
|
||||||
activeNodeId: "0414",
|
activeNodeId: "0414",
|
||||||
nodeMatrixIndices: { matrixIdx: 7, rowIdx: 1, colIdx: 0 },
|
nodeMatrixIndices: { matrixIdx: 7, rowIdx: 1, colIdx: 0 },
|
||||||
siteRotY: 0,
|
siteRotY: 0,
|
||||||
sitePosY: 0,
|
sitePosY: 0,
|
||||||
|
level: "04",
|
||||||
},
|
},
|
||||||
} as any,
|
} as SiteSaveState,
|
||||||
(set) => ({
|
(set) => ({
|
||||||
setSiteSaveState: (
|
setSiteSaveState: (
|
||||||
site: string,
|
site: string,
|
||||||
to: {
|
to: {
|
||||||
activeNodeId: string;
|
activeNodeId: string;
|
||||||
nodeMatrixIndices: { matrixIdx: 7; rowIdx: 0; colIdx: 0 };
|
nodeMatrixIndices: {
|
||||||
|
matrixIdx: number;
|
||||||
|
rowIdx: number;
|
||||||
|
colIdx: number;
|
||||||
|
};
|
||||||
siteRotY: number;
|
siteRotY: number;
|
||||||
sitePosY: number;
|
sitePosY: number;
|
||||||
|
level: string;
|
||||||
}
|
}
|
||||||
) => set(() => ({ site: to })),
|
) => set(() => ({ [site]: to })),
|
||||||
})
|
})
|
||||||
)
|
)
|
||||||
);
|
);
|
||||||
|
|
Loading…
Reference in a new issue