mirror of
https://github.com/ad044/lainTSX.git
synced 2024-10-22 23:19:06 +00:00
nah fuck that, reverted most stuff
This commit is contained in:
parent
a6c7f29c93
commit
014137287e
19 changed files with 1100 additions and 1158 deletions
13
package-lock.json
generated
13
package-lock.json
generated
|
@ -2352,8 +2352,7 @@
|
||||||
"arg": {
|
"arg": {
|
||||||
"version": "4.1.3",
|
"version": "4.1.3",
|
||||||
"resolved": "https://registry.npmjs.org/arg/-/arg-4.1.3.tgz",
|
"resolved": "https://registry.npmjs.org/arg/-/arg-4.1.3.tgz",
|
||||||
"integrity": "sha512-58S9QDqG0Xx27YwPSt9fJxivjYl432YCwfDMfZ+71RAqUrZef7LrKQZ3LHLOwCS4FLNBplP533Zx895SeOCHvA==",
|
"integrity": "sha512-58S9QDqG0Xx27YwPSt9fJxivjYl432YCwfDMfZ+71RAqUrZef7LrKQZ3LHLOwCS4FLNBplP533Zx895SeOCHvA=="
|
||||||
"dev": true
|
|
||||||
},
|
},
|
||||||
"argparse": {
|
"argparse": {
|
||||||
"version": "1.0.10",
|
"version": "1.0.10",
|
||||||
|
@ -4538,8 +4537,7 @@
|
||||||
"diff": {
|
"diff": {
|
||||||
"version": "4.0.2",
|
"version": "4.0.2",
|
||||||
"resolved": "https://registry.npmjs.org/diff/-/diff-4.0.2.tgz",
|
"resolved": "https://registry.npmjs.org/diff/-/diff-4.0.2.tgz",
|
||||||
"integrity": "sha512-58lmxKSA4BNyLz+HHMUzlOEpg09FV+ev6ZMe3vJihgdxzgcwZ8VoEEPmALCZG9LmqfVoNMMKpttIYTVG6uDY7A==",
|
"integrity": "sha512-58lmxKSA4BNyLz+HHMUzlOEpg09FV+ev6ZMe3vJihgdxzgcwZ8VoEEPmALCZG9LmqfVoNMMKpttIYTVG6uDY7A=="
|
||||||
"dev": true
|
|
||||||
},
|
},
|
||||||
"diff-sequences": {
|
"diff-sequences": {
|
||||||
"version": "24.9.0",
|
"version": "24.9.0",
|
||||||
|
@ -8118,8 +8116,7 @@
|
||||||
"make-error": {
|
"make-error": {
|
||||||
"version": "1.3.6",
|
"version": "1.3.6",
|
||||||
"resolved": "https://registry.npmjs.org/make-error/-/make-error-1.3.6.tgz",
|
"resolved": "https://registry.npmjs.org/make-error/-/make-error-1.3.6.tgz",
|
||||||
"integrity": "sha512-s8UhlNe7vPKomQhC1qFelMokr/Sc3AgNbso3n74mVPA5LTZwkB9NlXf4XPamLxJE8h0gh73rM94xvwRT2CVInw==",
|
"integrity": "sha512-s8UhlNe7vPKomQhC1qFelMokr/Sc3AgNbso3n74mVPA5LTZwkB9NlXf4XPamLxJE8h0gh73rM94xvwRT2CVInw=="
|
||||||
"dev": true
|
|
||||||
},
|
},
|
||||||
"makeerror": {
|
"makeerror": {
|
||||||
"version": "1.0.11",
|
"version": "1.0.11",
|
||||||
|
@ -12698,7 +12695,6 @@
|
||||||
"version": "9.0.0",
|
"version": "9.0.0",
|
||||||
"resolved": "https://registry.npmjs.org/ts-node/-/ts-node-9.0.0.tgz",
|
"resolved": "https://registry.npmjs.org/ts-node/-/ts-node-9.0.0.tgz",
|
||||||
"integrity": "sha512-/TqB4SnererCDR/vb4S/QvSZvzQMJN8daAslg7MeaiHvD8rDZsSfXmNeNumyZZzMned72Xoq/isQljYSt8Ynfg==",
|
"integrity": "sha512-/TqB4SnererCDR/vb4S/QvSZvzQMJN8daAslg7MeaiHvD8rDZsSfXmNeNumyZZzMned72Xoq/isQljYSt8Ynfg==",
|
||||||
"dev": true,
|
|
||||||
"requires": {
|
"requires": {
|
||||||
"arg": "^4.1.0",
|
"arg": "^4.1.0",
|
||||||
"diff": "^4.0.1",
|
"diff": "^4.0.1",
|
||||||
|
@ -13949,8 +13945,7 @@
|
||||||
"yn": {
|
"yn": {
|
||||||
"version": "3.1.1",
|
"version": "3.1.1",
|
||||||
"resolved": "https://registry.npmjs.org/yn/-/yn-3.1.1.tgz",
|
"resolved": "https://registry.npmjs.org/yn/-/yn-3.1.1.tgz",
|
||||||
"integrity": "sha512-Ux4ygGWsu2c7isFWe8Yu1YluJmqVhxqK2cLXNQA5AcC3QfbGNpM7fu0Y8b/z16pXLnFxZYvWhd3fhBY9DLmC6Q==",
|
"integrity": "sha512-Ux4ygGWsu2c7isFWe8Yu1YluJmqVhxqK2cLXNQA5AcC3QfbGNpM7fu0Y8b/z16pXLnFxZYvWhd3fhBY9DLmC6Q=="
|
||||||
"dev": true
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -46,7 +46,5 @@
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
"homepage": ".",
|
"homepage": ".",
|
||||||
"devDependencies": {
|
"devDependencies": {}
|
||||||
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
|
@ -119,7 +119,7 @@ const BlueOrb = memo((props: BlueOrbContructorProps) => {
|
||||||
<group position={[0, (level_y_values as LevelYValues)[props.level], 0]}>
|
<group position={[0, (level_y_values as LevelYValues)[props.level], 0]}>
|
||||||
<mesh
|
<mesh
|
||||||
position={props.position as [number, number, number]}
|
position={props.position as [number, number, number]}
|
||||||
scale={[(0.046 * 90) / 100, (0.028 * 90) / 100, (0.046 * 90) / 100]}
|
scale={[0.25, 0.15, 0.25]}
|
||||||
rotation={props.rotation as [number, number, number]}
|
rotation={props.rotation as [number, number, number]}
|
||||||
renderOrder={1}
|
renderOrder={1}
|
||||||
>
|
>
|
||||||
|
@ -135,7 +135,7 @@ const BlueOrb = memo((props: BlueOrbContructorProps) => {
|
||||||
transparent={true}
|
transparent={true}
|
||||||
/>
|
/>
|
||||||
) : (
|
) : (
|
||||||
<meshBasicMaterial
|
<meshStandardMaterial
|
||||||
attach="material"
|
attach="material"
|
||||||
map={nonActiveTexture}
|
map={nonActiveTexture}
|
||||||
side={THREE.DoubleSide}
|
side={THREE.DoubleSide}
|
||||||
|
|
|
@ -99,7 +99,7 @@ const GrayRing = memo((props: GrayRingProps) => {
|
||||||
addedLights.rgb += clamp(dot(-lightDirection,
|
addedLights.rgb += clamp(dot(-lightDirection,
|
||||||
vNormal), 0.0, 1.0)
|
vNormal), 0.0, 1.0)
|
||||||
* pointLights[l].color
|
* pointLights[l].color
|
||||||
* 150.0;
|
* 50.0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
@ -156,10 +156,10 @@ const GrayRing = memo((props: GrayRingProps) => {
|
||||||
position={[0, props.grayRingPosY, 0]}
|
position={[0, props.grayRingPosY, 0]}
|
||||||
rotation={[0, 3.95, 0]}
|
rotation={[0, 3.95, 0]}
|
||||||
renderOrder={1}
|
renderOrder={1}
|
||||||
scale={[185, 185, 185]}
|
scale={[33, 33, 33]}
|
||||||
>
|
>
|
||||||
<cylinderBufferGeometry
|
<cylinderBufferGeometry
|
||||||
args={[0.001, 0.001, 0.000075, 64, 64, true]}
|
args={[0.04, 0.04, 0.0025, 64, 64, true]}
|
||||||
attach="geometry"
|
attach="geometry"
|
||||||
/>
|
/>
|
||||||
<shaderMaterial
|
<shaderMaterial
|
||||||
|
|
|
@ -6,7 +6,7 @@ import {
|
||||||
LainMoveUp,
|
LainMoveUp,
|
||||||
LainStanding,
|
LainStanding,
|
||||||
} from "./Lain/Lain";
|
} from "./Lain/Lain";
|
||||||
import { useRecoilState, useRecoilValue, useSetRecoilState } from "recoil";
|
import { useRecoilState, useSetRecoilState } from "recoil";
|
||||||
import { currentHUDAtom, hudActiveAtom } from "./HUD/HUDElementAtom";
|
import { currentHUDAtom, hudActiveAtom } from "./HUD/HUDElementAtom";
|
||||||
import { currentBlueOrbAtom } from "./BlueOrb/CurrentBlueOrbAtom";
|
import { currentBlueOrbAtom } from "./BlueOrb/CurrentBlueOrbAtom";
|
||||||
import lain_animations from "../resources/lain_animations.json";
|
import lain_animations from "../resources/lain_animations.json";
|
||||||
|
@ -16,7 +16,6 @@ import {
|
||||||
lainMoveStateAtom,
|
lainMoveStateAtom,
|
||||||
lainMovingAtom,
|
lainMovingAtom,
|
||||||
lainPosYAtom,
|
lainPosYAtom,
|
||||||
lainRotYAtom,
|
|
||||||
} from "./Lain/LainAtom";
|
} from "./Lain/LainAtom";
|
||||||
import { camPosYAtom, camRotYAtom } from "./MainScene/CameraAtom";
|
import { camPosYAtom, camRotYAtom } from "./MainScene/CameraAtom";
|
||||||
import {
|
import {
|
||||||
|
@ -70,7 +69,6 @@ const InputHandler = () => {
|
||||||
|
|
||||||
const [lainMoving, setLainMoving] = useRecoilState(lainMovingAtom);
|
const [lainMoving, setLainMoving] = useRecoilState(lainMovingAtom);
|
||||||
const setLainMoveState = useSetRecoilState(lainMoveStateAtom);
|
const setLainMoveState = useSetRecoilState(lainMoveStateAtom);
|
||||||
const setLainRotY = useSetRecoilState(lainRotYAtom);
|
|
||||||
|
|
||||||
const [spriteUpdateCooldown, setSpriteUpdateCooldown] = useState(false);
|
const [spriteUpdateCooldown, setSpriteUpdateCooldown] = useState(false);
|
||||||
|
|
||||||
|
@ -140,7 +138,6 @@ const InputHandler = () => {
|
||||||
setOrthoCamRotY((prev: number) => prev - val);
|
setOrthoCamRotY((prev: number) => prev - val);
|
||||||
setGrayPlaneRotY((prev: number) => prev - val);
|
setGrayPlaneRotY((prev: number) => prev - val);
|
||||||
setLightRotY((prev: number) => prev - val);
|
setLightRotY((prev: number) => prev - val);
|
||||||
setLainRotY((prev: number) => prev - val);
|
|
||||||
|
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
setMiddleRingRotY((prev: number) => prev - 0.55);
|
setMiddleRingRotY((prev: number) => prev - 0.55);
|
||||||
|
@ -153,7 +150,6 @@ const InputHandler = () => {
|
||||||
setGrayPlaneRotY,
|
setGrayPlaneRotY,
|
||||||
setLightRotY,
|
setLightRotY,
|
||||||
setMiddleRingRotY,
|
setMiddleRingRotY,
|
||||||
setLainRotY,
|
|
||||||
]
|
]
|
||||||
);
|
);
|
||||||
|
|
||||||
|
@ -177,7 +173,7 @@ const InputHandler = () => {
|
||||||
setLainMoveState(<LainMoveDown />);
|
setLainMoveState(<LainMoveDown />);
|
||||||
|
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
moveCamera(0.25);
|
moveCamera(1.5);
|
||||||
}, 1300);
|
}, 1300);
|
||||||
|
|
||||||
// make noise appear again
|
// make noise appear again
|
||||||
|
@ -190,7 +186,7 @@ const InputHandler = () => {
|
||||||
setMiddleRingRotating(false);
|
setMiddleRingRotating(false);
|
||||||
}, 700);
|
}, 700);
|
||||||
|
|
||||||
// set ring rotation on x axis to create motion effect
|
// set ring rotation on x axis to craete motion effect
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
setMiddleRingRotX(0.3);
|
setMiddleRingRotX(0.3);
|
||||||
}, 1500);
|
}, 1500);
|
||||||
|
@ -241,7 +237,7 @@ const InputHandler = () => {
|
||||||
setLainMoveState(<LainMoveUp />);
|
setLainMoveState(<LainMoveUp />);
|
||||||
|
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
moveCamera(-0.25);
|
moveCamera(-1.5);
|
||||||
}, 1300);
|
}, 1300);
|
||||||
|
|
||||||
// change noise to 0, make the ring bend downwards
|
// change noise to 0, make the ring bend downwards
|
||||||
|
@ -323,7 +319,6 @@ const InputHandler = () => {
|
||||||
setLainMoving,
|
setLainMoving,
|
||||||
setMiddleRingNoise,
|
setMiddleRingNoise,
|
||||||
setMiddleRingRotX,
|
setMiddleRingRotX,
|
||||||
setMiddleRingRotZ,
|
|
||||||
setMiddleRingRotating,
|
setMiddleRingRotating,
|
||||||
setMiddleRingWobbleStrength,
|
setMiddleRingWobbleStrength,
|
||||||
]
|
]
|
||||||
|
@ -400,16 +395,12 @@ const InputHandler = () => {
|
||||||
const key = getKeyCodeAssociation(keyCode);
|
const key = getKeyCodeAssociation(keyCode);
|
||||||
|
|
||||||
if (key && !lainMoving) {
|
if (key && !lainMoving) {
|
||||||
setTimeout(() => {
|
|
||||||
rotateCamera(0.785);
|
|
||||||
}, 1100);
|
|
||||||
//
|
|
||||||
const move = getMove(currentBlueOrb, key);
|
const move = getMove(currentBlueOrb, key);
|
||||||
|
|
||||||
moveDispatcher(move, key);
|
moveDispatcher(move, key);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
[lainMoving, currentBlueOrb, moveDispatcher, rotateCamera]
|
[lainMoving, currentBlueOrb, moveDispatcher]
|
||||||
);
|
);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
|
|
|
@ -10,12 +10,7 @@ import moveRightSpriteSheet from "../../static/sprites/move_right.png";
|
||||||
import standingSpriteSheet from "../../static/sprites/standing.png";
|
import standingSpriteSheet from "../../static/sprites/standing.png";
|
||||||
import introSpriteSheet from "../../static/sprites/intro.png";
|
import introSpriteSheet from "../../static/sprites/intro.png";
|
||||||
import { useRecoilValue } from "recoil";
|
import { useRecoilValue } from "recoil";
|
||||||
import {
|
import { lainMoveStateAtom, lainMovingAtom, lainPosYAtom } from "./LainAtom";
|
||||||
lainMoveStateAtom,
|
|
||||||
lainMovingAtom,
|
|
||||||
lainPosYAtom,
|
|
||||||
lainRotYAtom,
|
|
||||||
} from "./LainAtom";
|
|
||||||
|
|
||||||
type LainConstructorProps = {
|
type LainConstructorProps = {
|
||||||
sprite: string;
|
sprite: string;
|
||||||
|
@ -122,25 +117,21 @@ const Lain = () => {
|
||||||
const lainMoving = useRecoilValue(lainMovingAtom);
|
const lainMoving = useRecoilValue(lainMovingAtom);
|
||||||
const lainMoveState = useRecoilValue(lainMoveStateAtom);
|
const lainMoveState = useRecoilValue(lainMoveStateAtom);
|
||||||
const lainPosY = useRecoilValue(lainPosYAtom);
|
const lainPosY = useRecoilValue(lainPosYAtom);
|
||||||
const lainRotY = useRecoilValue(lainRotYAtom);
|
|
||||||
|
|
||||||
const lainPosYState = useSpring({
|
const lainPosYState = useSpring({
|
||||||
lainPosY: lainPosY,
|
lainPosY: lainPosY,
|
||||||
lainRotY: lainRotY,
|
|
||||||
config: { duration: 1200 },
|
config: { duration: 1200 },
|
||||||
});
|
});
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Suspense fallback={<>loading...</>}>
|
<Suspense fallback={<>loading...</>}>
|
||||||
<a.group rotation-y={lainPosYState.lainRotY}>
|
|
||||||
<a.sprite
|
<a.sprite
|
||||||
|
position-x={0.1}
|
||||||
position-y={lainPosYState.lainPosY}
|
position-y={lainPosYState.lainPosY}
|
||||||
position-z={0.05}
|
scale={[4.9, 4.9, 4.9]}
|
||||||
scale={[0.6, 0.6, 0.6]}
|
|
||||||
>
|
>
|
||||||
{lainMoving ? lainMoveState : <LainStanding />}
|
{lainMoving ? lainMoveState : <LainStanding />}
|
||||||
</a.sprite>
|
</a.sprite>
|
||||||
</a.group>
|
|
||||||
</Suspense>
|
</Suspense>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
|
@ -3,7 +3,7 @@ import React from "react";
|
||||||
|
|
||||||
export const lainPosYAtom = atom({
|
export const lainPosYAtom = atom({
|
||||||
key: "lainPosYAtom",
|
key: "lainPosYAtom",
|
||||||
default: -0.02,
|
default: -0.15,
|
||||||
});
|
});
|
||||||
|
|
||||||
export const lainRotYAtom = atom({
|
export const lainRotYAtom = atom({
|
||||||
|
|
|
@ -11,8 +11,8 @@ type LevelProps = {
|
||||||
const Level = (props: LevelProps) => {
|
const Level = (props: LevelProps) => {
|
||||||
return (
|
return (
|
||||||
<group position={[0, props.levelPosY, 0]}>
|
<group position={[0, props.levelPosY, 0]}>
|
||||||
<PurpleRing purpleRingPosY={0.07} />
|
<PurpleRing purpleRingPosY={0.43} />
|
||||||
<GrayRing grayRingPosY={-0.045} />
|
<GrayRing grayRingPosY={-0.28} />
|
||||||
<CyanCrystal crystalRingPosY={-0.45} />
|
<CyanCrystal crystalRingPosY={-0.45} />
|
||||||
</group>
|
</group>
|
||||||
);
|
);
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
import React, { memo, useRef } from "react";
|
import React, { memo } from "react";
|
||||||
import { useRecoilValue } from "recoil";
|
import { useRecoilValue } from "recoil";
|
||||||
import { a, useSpring } from "@react-spring/three";
|
import { a, useSpring } from "@react-spring/three";
|
||||||
import { lightPosYAtom, lightRotYAtom } from "./LightsAtom";
|
import { lightPosYAtom, lightRotYAtom } from "./LightsAtom";
|
||||||
|
@ -18,25 +18,11 @@ const Lights = memo(() => {
|
||||||
position-y={lightState.lightPosY}
|
position-y={lightState.lightPosY}
|
||||||
rotation-y={lightState.lightRotY}
|
rotation-y={lightState.lightRotY}
|
||||||
>
|
>
|
||||||
|
<ambientLight color={0x808080} intensity={0.6} />
|
||||||
<pointLight color={0xffffff} position={[0, 0, 6]} intensity={1} />
|
<pointLight color={0xffffff} position={[0, 0, 7]} intensity={0.7} />
|
||||||
|
<pointLight color={0x7f7f7f} position={[0, 10, 0]} intensity={1.5} />
|
||||||
<pointLight color={0x7f7f7f} position={[0, 0.5, -0.5]} intensity={2.5} />
|
<pointLight color={0xffffff} position={[-8, 0, 0]} intensity={0.3} />
|
||||||
|
<pointLight color={0xffffff} position={[8, 0, 0]} intensity={0.3} />
|
||||||
{/*<pointLight color={0xffffff} position={[0, 0, 6.2]} intensity={1} />*/}
|
|
||||||
{/*<mesh position={[50.09, -1, 5.2]} scale={[0.1, 0.1, 0.1]}>*/}
|
|
||||||
{/* <sphereBufferGeometry attach="geometry">*/}
|
|
||||||
{/* <meshStandardMaterial color={0xffffff} attach="material" />*/}
|
|
||||||
{/* </sphereBufferGeometry>*/}
|
|
||||||
{/*</mesh>*/}
|
|
||||||
|
|
||||||
{/*<pointLight color={0xffffff} position={[0.08, 0, 0]} intensity={0.3} />*/}
|
|
||||||
{/*<mesh position={[0.08, 0, 0]} scale={[0.01, 0.01, 0.01]}>*/}
|
|
||||||
{/* <sphereBufferGeometry attach="geometry">*/}
|
|
||||||
{/* <meshStandardMaterial color={0xffffff} attach="material" />*/}
|
|
||||||
{/* </sphereBufferGeometry>*/}
|
|
||||||
{/*</mesh>*/}
|
|
||||||
|
|
||||||
</a.group>
|
</a.group>
|
||||||
);
|
);
|
||||||
});
|
});
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
import { a, useSpring } from "@react-spring/three";
|
import { a, useSpring } from "@react-spring/three";
|
||||||
import { OrbitControls } from "drei";
|
import { OrbitControls } from "drei";
|
||||||
import React, { Suspense, useEffect } from "react";
|
import React, { Suspense, useEffect } from "react";
|
||||||
import Site from "../Site/Site";
|
import Site from "../Site";
|
||||||
import Lain, { LainIntro } from "../Lain/Lain";
|
import Lain, { LainIntro } from "../Lain/Lain";
|
||||||
import Lights from "../Lights/Lights";
|
import Lights from "../Lights/Lights";
|
||||||
import OrthoCamera from "../OrthoCamera/OrthoCamera";
|
import OrthoCamera from "../OrthoCamera/OrthoCamera";
|
||||||
|
@ -55,10 +55,9 @@ const MainScene = () => {
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<a.perspectiveCamera
|
<a.perspectiveCamera
|
||||||
position-z={4.69}
|
position-z={3}
|
||||||
position-y={cameraState.camPosY}
|
position-y={cameraState.camPosY}
|
||||||
rotation-y={cameraState.camRotY}
|
rotation-y={cameraState.camRotY}
|
||||||
rotation-x={-0.01}
|
|
||||||
>
|
>
|
||||||
<Suspense fallback={null}>
|
<Suspense fallback={null}>
|
||||||
<MainSceneIntro />
|
<MainSceneIntro />
|
||||||
|
@ -74,7 +73,7 @@ const MainScene = () => {
|
||||||
<Starfield />
|
<Starfield />
|
||||||
<GrayPlanes />
|
<GrayPlanes />
|
||||||
<Lights />
|
<Lights />
|
||||||
{/*<MiddleRing />*/}
|
<MiddleRing />
|
||||||
<OrbitControls />
|
<OrbitControls />
|
||||||
</a.group>
|
</a.group>
|
||||||
<Lain />
|
<Lain />
|
||||||
|
|
|
@ -1,6 +1,7 @@
|
||||||
import React, { memo, useRef } from "react";
|
import React, { memo, useMemo, useRef } from "react";
|
||||||
import { useFrame, useLoader } from "react-three-fiber";
|
import { useFrame, useLoader } from "react-three-fiber";
|
||||||
import * as THREE from "three";
|
import * as THREE from "three";
|
||||||
|
import { GLTF } from "three/examples/jsm/loaders/GLTFLoader";
|
||||||
import siteATex from "../static/sprites/site_a.png";
|
import siteATex from "../static/sprites/site_a.png";
|
||||||
import siteBTex from "../static/sprites/site_b.png";
|
import siteBTex from "../static/sprites/site_b.png";
|
||||||
|
|
||||||
|
@ -14,6 +15,14 @@ const PurpleRing = memo((props: PurpleRingProps) => {
|
||||||
|
|
||||||
const purpleRingRef = useRef<THREE.Object3D>();
|
const purpleRingRef = useRef<THREE.Object3D>();
|
||||||
|
|
||||||
|
// const uniforms = useMemo(
|
||||||
|
// () => ({
|
||||||
|
// siteA: { type: "t", value: siteA },
|
||||||
|
// siteB: { type: "t", value: siteB },
|
||||||
|
// }),
|
||||||
|
// [siteA, siteB]
|
||||||
|
// );
|
||||||
|
|
||||||
const uniforms = THREE.UniformsUtils.merge([THREE.UniformsLib["lights"]]);
|
const uniforms = THREE.UniformsUtils.merge([THREE.UniformsLib["lights"]]);
|
||||||
|
|
||||||
uniforms.siteA = { type: "t", value: siteA };
|
uniforms.siteA = { type: "t", value: siteA };
|
||||||
|
@ -99,7 +108,7 @@ const PurpleRing = memo((props: PurpleRingProps) => {
|
||||||
addedLights.rgb += clamp(dot(-lightDirection,
|
addedLights.rgb += clamp(dot(-lightDirection,
|
||||||
vNormal), 0.0, 1.0)
|
vNormal), 0.0, 1.0)
|
||||||
* pointLights[l].color
|
* pointLights[l].color
|
||||||
* 80.0;
|
* 50.0;
|
||||||
}
|
}
|
||||||
|
|
||||||
// number of segments
|
// number of segments
|
||||||
|
@ -177,11 +186,11 @@ const PurpleRing = memo((props: PurpleRingProps) => {
|
||||||
position={[0, props.purpleRingPosY, 0]}
|
position={[0, props.purpleRingPosY, 0]}
|
||||||
rotation={[0, 0.5, 0]}
|
rotation={[0, 0.5, 0]}
|
||||||
renderOrder={1}
|
renderOrder={1}
|
||||||
scale={[95, 95, 95]}
|
scale={[25, 25, 25]}
|
||||||
ref={purpleRingRef}
|
ref={purpleRingRef}
|
||||||
>
|
>
|
||||||
<cylinderBufferGeometry
|
<cylinderBufferGeometry
|
||||||
args={[0.0019, 0.0019, 0.00015, 64, 64, true]}
|
args={[0.05, 0.05, 0.0035, 64, 64, true]}
|
||||||
attach="geometry"
|
attach="geometry"
|
||||||
/>
|
/>
|
||||||
<shaderMaterial
|
<shaderMaterial
|
||||||
|
|
89
src/components/Site.tsx
Normal file
89
src/components/Site.tsx
Normal file
|
@ -0,0 +1,89 @@
|
||||||
|
import React, { memo, Suspense } from "react";
|
||||||
|
import site_a from "../resources/site_a.json";
|
||||||
|
import blue_orb_positions from "../resources/blue_orb_positions.json";
|
||||||
|
import BlueOrb from "./BlueOrb/BlueOrb";
|
||||||
|
import { useRecoilValue } from "recoil";
|
||||||
|
import { currentBlueOrbAtom } from "./BlueOrb/CurrentBlueOrbAtom";
|
||||||
|
import Level from "./Level";
|
||||||
|
import level_y_values from "../resources/level_y_values.json";
|
||||||
|
|
||||||
|
type ImageTableIndices = {
|
||||||
|
1: string;
|
||||||
|
2: string;
|
||||||
|
3: string;
|
||||||
|
};
|
||||||
|
|
||||||
|
type ProtocolLines = {
|
||||||
|
1: string;
|
||||||
|
2: string;
|
||||||
|
3: string;
|
||||||
|
4: string;
|
||||||
|
};
|
||||||
|
|
||||||
|
type Words = {
|
||||||
|
1: string;
|
||||||
|
2: string;
|
||||||
|
3: string;
|
||||||
|
};
|
||||||
|
|
||||||
|
type BlueOrbData = {
|
||||||
|
"SLPS_016_0x offset": string;
|
||||||
|
image_table_indices: ImageTableIndices;
|
||||||
|
is_hidden: string;
|
||||||
|
media_file: string;
|
||||||
|
node_name: string;
|
||||||
|
protocol_lines: ProtocolLines;
|
||||||
|
site: string;
|
||||||
|
type: string;
|
||||||
|
unlocked_by: string;
|
||||||
|
upgrade_requirement: string;
|
||||||
|
words: Words;
|
||||||
|
};
|
||||||
|
|
||||||
|
type BlueOrbPositionData = {
|
||||||
|
position: number[];
|
||||||
|
rotation: number[];
|
||||||
|
};
|
||||||
|
|
||||||
|
type BlueOrbPositions = {
|
||||||
|
[orbPos: string]: BlueOrbPositionData;
|
||||||
|
};
|
||||||
|
|
||||||
|
const Site = memo(() => {
|
||||||
|
const currentBlueOrb = useRecoilValue(currentBlueOrbAtom);
|
||||||
|
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<Suspense fallback={<>loading...</>}>
|
||||||
|
{/* distance between LEVELS is 1.5 */}
|
||||||
|
{Object.values(level_y_values).map((yVal) => {
|
||||||
|
return <Level levelPosY={yVal} key={yVal} />;
|
||||||
|
})}
|
||||||
|
|
||||||
|
{Object.entries(site_a).map((blueOrb: [string, BlueOrbData]) => {
|
||||||
|
if (blueOrb[1]["unlocked_by"] === "-1")
|
||||||
|
return (
|
||||||
|
<BlueOrb
|
||||||
|
sprite={blueOrb[1]["node_name"]}
|
||||||
|
position={
|
||||||
|
(blue_orb_positions as BlueOrbPositions)[
|
||||||
|
blueOrb[0].substr(2)
|
||||||
|
]["position"]
|
||||||
|
}
|
||||||
|
rotation={
|
||||||
|
(blue_orb_positions as BlueOrbPositions)[
|
||||||
|
blueOrb[0].substr(2)
|
||||||
|
]["rotation"]
|
||||||
|
}
|
||||||
|
key={blueOrb[1]["node_name"]}
|
||||||
|
active={blueOrb[0] === currentBlueOrb}
|
||||||
|
level={blueOrb[0].substr(0, 2)}
|
||||||
|
/>
|
||||||
|
);
|
||||||
|
})}
|
||||||
|
</Suspense>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
});
|
||||||
|
|
||||||
|
export default Site;
|
|
@ -1,106 +0,0 @@
|
||||||
import React, {
|
|
||||||
memo,
|
|
||||||
Suspense,
|
|
||||||
useEffect,
|
|
||||||
useMemo,
|
|
||||||
useRef,
|
|
||||||
useState,
|
|
||||||
} from "react";
|
|
||||||
import site_a from "../../resources/site_a.json";
|
|
||||||
import blue_orb_positions from "../../resources/blue_orb_positions.json";
|
|
||||||
import BlueOrb from "../BlueOrb/BlueOrb";
|
|
||||||
import { useRecoilValue } from "recoil";
|
|
||||||
import { currentBlueOrbAtom } from "../BlueOrb/CurrentBlueOrbAtom";
|
|
||||||
import Level from "../Level";
|
|
||||||
import level_y_values from "../../resources/level_y_values.json";
|
|
||||||
import { useFrame } from "react-three-fiber";
|
|
||||||
import { a, useSpring } from "@react-spring/three";
|
|
||||||
|
|
||||||
import columns from "../../resources/columns.json";
|
|
||||||
|
|
||||||
type ImageTableIndices = {
|
|
||||||
1: string;
|
|
||||||
2: string;
|
|
||||||
3: string;
|
|
||||||
};
|
|
||||||
|
|
||||||
type ProtocolLines = {
|
|
||||||
1: string;
|
|
||||||
2: string;
|
|
||||||
3: string;
|
|
||||||
4: string;
|
|
||||||
};
|
|
||||||
|
|
||||||
type Words = {
|
|
||||||
1: string;
|
|
||||||
2: string;
|
|
||||||
3: string;
|
|
||||||
};
|
|
||||||
|
|
||||||
export type BlueOrbData = {
|
|
||||||
"SLPS_016_0x offset": string;
|
|
||||||
image_table_indices: ImageTableIndices;
|
|
||||||
is_hidden: string;
|
|
||||||
media_file: string;
|
|
||||||
node_name: string;
|
|
||||||
protocol_lines: ProtocolLines;
|
|
||||||
site: string;
|
|
||||||
type: string;
|
|
||||||
unlocked_by: string;
|
|
||||||
upgrade_requirement: string;
|
|
||||||
words: Words;
|
|
||||||
};
|
|
||||||
|
|
||||||
type BlueOrbPositionData = {
|
|
||||||
position: number[];
|
|
||||||
rotation: number[];
|
|
||||||
};
|
|
||||||
|
|
||||||
type BlueOrbPositions = {
|
|
||||||
[orbPos: string]: BlueOrbPositionData;
|
|
||||||
};
|
|
||||||
|
|
||||||
const Site = memo(() => {
|
|
||||||
const currentBlueOrb = useRecoilValue(currentBlueOrbAtom);
|
|
||||||
|
|
||||||
useFrame(() => {
|
|
||||||
// grpRef.current!.rotation.y += 0.01
|
|
||||||
});
|
|
||||||
|
|
||||||
return (
|
|
||||||
<>
|
|
||||||
<Suspense fallback={<>loading...</>}>
|
|
||||||
{/* distance between LEVELS is 1.5 */}
|
|
||||||
{Object.values(level_y_values).map((yVal) => {
|
|
||||||
return <Level levelPosY={yVal} key={yVal} />;
|
|
||||||
})}
|
|
||||||
|
|
||||||
<a.group >
|
|
||||||
{Object.entries(site_a).map((blueOrb: [string, BlueOrbData]) => {
|
|
||||||
if (blueOrb[1]["unlocked_by"] === "-1")
|
|
||||||
return (
|
|
||||||
<BlueOrb
|
|
||||||
sprite={blueOrb[1]["node_name"]}
|
|
||||||
position={
|
|
||||||
(blue_orb_positions as BlueOrbPositions)[
|
|
||||||
blueOrb[0].substr(2)
|
|
||||||
]["position"]
|
|
||||||
}
|
|
||||||
rotation={
|
|
||||||
(blue_orb_positions as BlueOrbPositions)[
|
|
||||||
blueOrb[0].substr(2)
|
|
||||||
]["rotation"]
|
|
||||||
}
|
|
||||||
key={blueOrb[1]["node_name"]}
|
|
||||||
active={blueOrb[0] === currentBlueOrb}
|
|
||||||
level={blueOrb[0].substr(0, 2)}
|
|
||||||
/>
|
|
||||||
);
|
|
||||||
})}
|
|
||||||
</a.group>
|
|
||||||
</Suspense>
|
|
||||||
</>
|
|
||||||
);
|
|
||||||
});
|
|
||||||
|
|
||||||
export default Site;
|
|
|
@ -1,2 +0,0 @@
|
||||||
import { atom } from "recoil";
|
|
||||||
|
|
|
@ -1,85 +1,51 @@
|
||||||
{
|
{
|
||||||
"05": {
|
"05": {
|
||||||
"position": [0.06, -0.045, 0.185],
|
"position": [0.4, -0.25, 1.3],
|
||||||
"rotation": [0, 0.24, 0]
|
"rotation": [0, 0.2, 0]
|
||||||
},
|
},
|
||||||
"13": {
|
|
||||||
"position": [0.06, -0.005, 0.185],
|
|
||||||
"rotation": [0, 0, 0]
|
|
||||||
},
|
|
||||||
"21": {
|
|
||||||
"position": [0.06, 0.045, 0.182],
|
|
||||||
"rotation": [0, 0, 0]
|
|
||||||
},
|
|
||||||
|
|
||||||
"14": {
|
"14": {
|
||||||
"position": [-0.07, 0, 0.186],
|
"position": [-0.35, 0, 1.3],
|
||||||
"rotation": [0, -0.24, 0]
|
"rotation": [0, -0.15, 0]
|
||||||
},
|
},
|
||||||
"22": {
|
"22": {
|
||||||
"position": [-0.07, 0.05, 0.186],
|
"position": [-0.35, 0.3, 1.3],
|
||||||
"rotation": [0, -0.24, 0]
|
"rotation": [0, -0.15, 0]
|
||||||
},
|
},
|
||||||
"06": {
|
"06": {
|
||||||
"position": [-0.07, -0.05, 0.186],
|
"position": [-0.35, -0.25, 1.3],
|
||||||
"rotation": [0, -0.24, 0]
|
"rotation": [0, -0.25, 0]
|
||||||
|
},
|
||||||
|
"13": {
|
||||||
|
"position": [0.4, 0, 1.3],
|
||||||
|
"rotation": [0, 0.27, 0]
|
||||||
},
|
},
|
||||||
|
|
||||||
"15": {
|
"15": {
|
||||||
"position": [-0.17, 0, 0.09],
|
"position": [-1, 0, 0.95],
|
||||||
"rotation": [0, -1, 0]
|
"rotation": [0, -0.9, 0]
|
||||||
},
|
},
|
||||||
"23": {
|
|
||||||
"position": [-0.17, 0.05, 0.09],
|
|
||||||
"rotation": [0, -1, 0]
|
|
||||||
},
|
|
||||||
"07": {
|
|
||||||
"position": [-0.17, -0.05, 0.09],
|
|
||||||
"rotation": [0, -1, 0]
|
|
||||||
},
|
|
||||||
|
|
||||||
"08": {
|
"08": {
|
||||||
"position": [-0.19, 0, -0.03],
|
"position": [-1.3, 0, 0.3],
|
||||||
"rotation": [0, -1.8, 0]
|
"rotation": [0, -1.4, 0]
|
||||||
},
|
|
||||||
"16": {
|
|
||||||
"position": [-0.19, 0.05, -0.03],
|
|
||||||
"rotation": [0, -1.8, 0]
|
|
||||||
},
|
},
|
||||||
"00": {
|
"00": {
|
||||||
"position": [-0.19, -0.05, -0.03],
|
"position": [-1.3, -0.25, 0.3],
|
||||||
"rotation": [0, -1.8, 0]
|
"rotation": [0, -1.4, 0]
|
||||||
},
|
},
|
||||||
|
|
||||||
"10": {
|
"10": {
|
||||||
"position": [-0.85, 0, -1.05],
|
"position": [-0.85, 0, -1.05],
|
||||||
"rotation": [0, -2.45, 0]
|
"rotation": [0, -2.45, 0]
|
||||||
},
|
},
|
||||||
"18": {
|
"16": {
|
||||||
"position": [-0.85, 0.3, -1.05],
|
"position": [-1.3, 0.3, 0.3],
|
||||||
"rotation": [0, -2.45, 0]
|
"rotation": [0, -1.4, 0]
|
||||||
},
|
},
|
||||||
"02": {
|
|
||||||
"position": [-0.85, -0.25, -1.05],
|
|
||||||
"rotation": [0, -2.45, 0]
|
|
||||||
},
|
|
||||||
|
|
||||||
"17": {
|
"17": {
|
||||||
"position": [-1.25, 0.3, -0.5],
|
"position": [-1.25, 0.3, -0.5],
|
||||||
"rotation": [0, -1.85, 0]
|
"rotation": [0, -1.85, 0]
|
||||||
},
|
},
|
||||||
"09": {
|
|
||||||
"position": [-1.25, 0, -0.5],
|
|
||||||
"rotation": [0, -1.85, 0]
|
|
||||||
},
|
|
||||||
"01": {
|
|
||||||
"position": [-1.25, -0.25, -0.5],
|
|
||||||
"rotation": [0, -1.85, 0]
|
|
||||||
},
|
|
||||||
|
|
||||||
"20": {
|
"20": {
|
||||||
"position": [-1.25, 0.05, -0.8],
|
"position": [1, 0.3, 0.9],
|
||||||
"rotation": [0, -1.85, 0]
|
"rotation": [0, 0.69, 0]
|
||||||
},
|
},
|
||||||
"12": {
|
"12": {
|
||||||
"position": [1, 0, 0.9],
|
"position": [1, 0, 0.9],
|
||||||
|
@ -89,7 +55,34 @@
|
||||||
"position": [1, -0.25, 0.9],
|
"position": [1, -0.25, 0.9],
|
||||||
"rotation": [0, 0.69, 0]
|
"rotation": [0, 0.69, 0]
|
||||||
},
|
},
|
||||||
|
"21": {
|
||||||
|
"position": [0.4, 0.3, 1.3],
|
||||||
|
"rotation": [0, 0.27, 0]
|
||||||
|
},
|
||||||
|
"23": {
|
||||||
|
"position": [-1, 0.3, 0.95],
|
||||||
|
"rotation": [0, -0.9, 0]
|
||||||
|
},
|
||||||
|
"07": {
|
||||||
|
"position": [-1, -0.25, 0.95],
|
||||||
|
"rotation": [0, -0.9, 0]
|
||||||
|
},
|
||||||
|
"09": {
|
||||||
|
"position": [-1.25, 0, -0.5],
|
||||||
|
"rotation": [0, -1.85, 0]
|
||||||
|
},
|
||||||
|
"01": {
|
||||||
|
"position": [-1.25, -0.25, -0.5],
|
||||||
|
"rotation": [0, -1.85, 0]
|
||||||
|
},
|
||||||
|
"18": {
|
||||||
|
"position": [-0.85, 0.3, -1.05],
|
||||||
|
"rotation": [0, -2.45, 0]
|
||||||
|
},
|
||||||
|
"02": {
|
||||||
|
"position": [-0.85, -0.25, -1.05],
|
||||||
|
"rotation": [0, -2.45, 0]
|
||||||
|
},
|
||||||
"03": {
|
"03": {
|
||||||
"position": [-0.15, -0.25, -1.3],
|
"position": [-0.15, -0.25, -1.3],
|
||||||
"rotation": [0, -2.45, 0]
|
"rotation": [0, -2.45, 0]
|
||||||
|
@ -102,7 +95,6 @@
|
||||||
"position": [-0.15, 0.3, -1.3],
|
"position": [-0.15, 0.3, -1.3],
|
||||||
"rotation": [0, -2.45, 0]
|
"rotation": [0, -2.45, 0]
|
||||||
},
|
},
|
||||||
|
|
||||||
"?": {
|
"?": {
|
||||||
"position": [-0.15, 0.3, -1.3],
|
"position": [-0.15, 0.3, -1.3],
|
||||||
"rotation": [0, -2.45, 0]
|
"rotation": [0, -2.45, 0]
|
||||||
|
|
|
@ -1,10 +1,10 @@
|
||||||
{
|
{
|
||||||
"01": -0.75,
|
"01": -4.5,
|
||||||
"02": -0.5,
|
"02": -3,
|
||||||
"03": -0.25,
|
"03": -1.5,
|
||||||
"04": 0,
|
"04": 0,
|
||||||
"05": 0.25,
|
"05": 1.5,
|
||||||
"06": 0.5,
|
"06": 3,
|
||||||
"07": 4.5,
|
"07": 4.5,
|
||||||
"08": 6,
|
"08": 6,
|
||||||
"09": 7.5,
|
"09": 7.5,
|
||||||
|
|
Loading…
Reference in a new issue