update remove naming step
This commit is contained in:
@@ -20,7 +20,7 @@ export function GameFlow(): null {
|
||||
|
||||
useEffect(() => {
|
||||
if (step === "sequence_video" && !isCinematicPlaying) {
|
||||
setStep("naming");
|
||||
setStep("start-move");
|
||||
}
|
||||
}, [step, isCinematicPlaying, setStep]);
|
||||
|
||||
|
||||
@@ -1,101 +1,5 @@
|
||||
import { useState } from "react";
|
||||
import { useGameStore } from "@/managers/stores/useGameStore";
|
||||
|
||||
export function IntroUI(): React.JSX.Element | null {
|
||||
const step = useGameStore((state) => state.intro.currentStep);
|
||||
const setPlayerName = useGameStore((state) => state.setPlayerName);
|
||||
const setStep = useGameStore((state) => state.setIntroStep);
|
||||
const [inputValue, setInputValue] = useState("");
|
||||
|
||||
if (step !== "naming") return null;
|
||||
|
||||
const handleSubmit = (): void => {
|
||||
if (inputValue.trim() === "") return;
|
||||
|
||||
setPlayerName(inputValue.trim());
|
||||
setStep("start-move");
|
||||
};
|
||||
|
||||
const handleKeyDown = (e: React.KeyboardEvent): void => {
|
||||
if (e.key === "Enter") {
|
||||
handleSubmit();
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<div
|
||||
style={{
|
||||
position: "fixed",
|
||||
top: 0,
|
||||
left: 0,
|
||||
width: "100%",
|
||||
height: "100%",
|
||||
display: "flex",
|
||||
alignItems: "center",
|
||||
justifyContent: "center",
|
||||
backgroundColor: "rgba(0, 0, 0, 0.7)",
|
||||
zIndex: 1000,
|
||||
}}
|
||||
>
|
||||
<div
|
||||
style={{
|
||||
backgroundColor: "#1a1a1a",
|
||||
padding: "2rem",
|
||||
borderRadius: "12px",
|
||||
display: "flex",
|
||||
flexDirection: "column",
|
||||
gap: "1.5rem",
|
||||
minWidth: "300px",
|
||||
}}
|
||||
>
|
||||
<h2
|
||||
style={{
|
||||
color: "#fff",
|
||||
margin: 0,
|
||||
fontSize: "1.5rem",
|
||||
textAlign: "center",
|
||||
}}
|
||||
>
|
||||
Quel est votre prenom ?
|
||||
</h2>
|
||||
<input
|
||||
type="text"
|
||||
value={inputValue}
|
||||
onChange={(e) => setInputValue(e.target.value)}
|
||||
onKeyDown={handleKeyDown}
|
||||
placeholder="Votre prenom"
|
||||
autoFocus
|
||||
style={{
|
||||
padding: "0.75rem",
|
||||
fontSize: "1rem",
|
||||
borderRadius: "6px",
|
||||
border: "1px solid #444",
|
||||
backgroundColor: "#2a2a2a",
|
||||
color: "#fff",
|
||||
outline: "none",
|
||||
}}
|
||||
/>
|
||||
<button
|
||||
onClick={handleSubmit}
|
||||
disabled={inputValue.trim() === ""}
|
||||
style={{
|
||||
padding: "0.75rem",
|
||||
fontSize: "1rem",
|
||||
borderRadius: "6px",
|
||||
border: "none",
|
||||
backgroundColor: inputValue.trim() ? "#4a9" : "#444",
|
||||
color: "#fff",
|
||||
cursor: inputValue.trim() ? "pointer" : "not-allowed",
|
||||
transition: "background-color 0.2s",
|
||||
}}
|
||||
>
|
||||
Valider
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export function BienvenueDisplay(): React.JSX.Element | null {
|
||||
const step = useGameStore((state) => state.intro.currentStep);
|
||||
const playerName = useGameStore((state) => state.missionFlow.playerName);
|
||||
|
||||
+1
-2
@@ -4,7 +4,7 @@ import * as THREE from "three";
|
||||
import { DebugPerf } from "@/components/debug/DebugPerf";
|
||||
import { DialogMessage } from "@/components/ui/DialogMessage";
|
||||
import { GameUI } from "@/components/ui/GameUI";
|
||||
import { BienvenueDisplay, IntroUI } from "@/components/ui/IntroUI";
|
||||
import { BienvenueDisplay } from "@/components/ui/IntroUI";
|
||||
import { SceneLoadingOverlay } from "@/components/ui/SceneLoadingOverlay";
|
||||
import { useGameStore } from "@/managers/stores/useGameStore";
|
||||
import { HandTrackingProvider } from "@/providers/gameplay/HandTrackingProvider";
|
||||
@@ -68,7 +68,6 @@ export function HomePage(): React.JSX.Element {
|
||||
</Suspense>
|
||||
</Canvas>
|
||||
<GameUI />
|
||||
<IntroUI />
|
||||
<BienvenueDisplay />
|
||||
{dialogMessage ? (
|
||||
<DialogMessage
|
||||
|
||||
+1
-7
@@ -1,16 +1,10 @@
|
||||
import type { Vector3Tuple } from "@/types/three/three";
|
||||
|
||||
export type GameStep =
|
||||
| "intro"
|
||||
| "sequence_video"
|
||||
| "naming"
|
||||
| "start-move"
|
||||
| "bike";
|
||||
export type GameStep = "intro" | "sequence_video" | "start-move" | "bike";
|
||||
|
||||
export const GAME_STEPS: readonly GameStep[] = [
|
||||
"intro",
|
||||
"sequence_video",
|
||||
"naming",
|
||||
"start-move",
|
||||
"bike",
|
||||
] as const;
|
||||
|
||||
Reference in New Issue
Block a user