2 Commits

Author SHA1 Message Date
Tom Boullay 5968f0f67c fix(repair-ebike): gate scanning on scan intro dialogue
🔍 Lint / 🪄 Check lint (push) Has been cancelled
🔍 Lint / 🎨 Check format (push) Has been cancelled
🔍 Lint / 🔎 Typecheck (push) Has been cancelled
📊 Quality / 🔒 Security Audit (push) Has been cancelled
📊 Quality / 📋 Dependency Freshness (push) Has been cancelled
📊 Quality / 📦 Bundle Size (push) Has been cancelled
🔍 Lint / 🏗 Build (push) Has been cancelled
2026-06-03 07:04:44 +02:00
Tom Boullay a0482aa04b fix(repair-ebike): freeze repair transform and case-driven cooling swap 2026-06-03 07:00:16 +02:00
5 changed files with 174 additions and 50 deletions
+6 -6
View File
@@ -1,5 +1,4 @@
import { useEffect, useRef } from "react";
import { EBIKE_SCAN_HINT_DIALOGUE_ID } from "@/data/ebike/ebikeConfig";
import { useGameStore } from "@/managers/stores/useGameStore";
import { useSubtitleStore } from "@/managers/stores/useSubtitleStore";
import type { MissionStep } from "@/types/gameplay/repairMission";
@@ -7,8 +6,11 @@ import { loadDialogueManifest } from "@/utils/dialogues/loadDialogueManifest";
import { playDialogueById } from "@/utils/dialogues/playDialogue";
/**
* Plays narrator cues during the ebike repair game:
* - `fragmented` -> "Alors? Pas magnifique ça?... ces galets vont scanner..."
* Previously played the ebike repair cues directly. `RepairGame` now
* owns the repair-game cue timings that gate gameplay transitions
* (`fragmented` waits for `narrateur_galetscan`, `done` waits for
* `narrateur_ebikerepare`). This component remains as the central
* safety cleanup for legacy/queued ebike narrator audio.
*
* The `narrateur_refroidisseur_diagnostic` line is triggered by the
* scan sequence itself when it lands on the refroidisseur node
@@ -26,9 +28,7 @@ import { playDialogueById } from "@/utils/dialogues/playDialogue";
* mission transition, etc.), the active audio is paused and the
* subtitle is force-cleared so nothing bleeds into pylon/farm/outro.
*/
const STEP_TO_DIALOGUE_ID: Partial<Record<MissionStep, string>> = {
fragmented: EBIKE_SCAN_HINT_DIALOGUE_ID,
};
const STEP_TO_DIALOGUE_ID: Partial<Record<MissionStep, string>> = {};
function stopAudio(audio: HTMLAudioElement | null): void {
if (!audio) return;
@@ -1,43 +1,32 @@
import { useState } from "react";
import { GrabbableObject } from "@/components/three/interaction/GrabbableObject";
import { TriggerObject } from "@/components/three/interaction/TriggerObject";
import { RepairObjectModel } from "@/components/three/gameplay/RepairObjectModel";
import { REPAIR_INTERACTION_RADIUS } from "@/data/gameplay/repairGameConfig";
import type { Vector3Tuple } from "@/types/three/three";
interface RepairEbikeRepairTriggerProps {
anchor: Vector3Tuple;
onRepair: () => void;
installed: boolean;
}
const REPLACEMENT_MODEL_PATH = "/models/refroidisseur/model.gltf";
const TRIGGER_OFFSET: Vector3Tuple = [0, 0.9, 0];
/**
* Ebike-specific fake replacement flow: the broken radiator node is
* hidden in the shared ExplodableModel, a grabbable copy appears at the
* same anchor, then pressing E respawns a fresh part with a halo before
* the reassembly step starts.
* same anchor, then RepairGame/RepairMissionCase controls the install
* interaction and this component swaps the copy for a fresh glowing part.
*/
export function RepairEbikeRepairTrigger({
anchor,
onRepair,
installed,
}: RepairEbikeRepairTriggerProps): React.JSX.Element {
const [isInstalled, setIsInstalled] = useState(false);
function handleRepair(): void {
if (isInstalled) return;
setIsInstalled(true);
window.setTimeout(onRepair, 450);
}
return (
<group>
{!isInstalled ? (
{!installed ? (
<GrabbableObject
position={anchor}
colliders="ball"
handControlled
lockUntilGrab
label="Retirer le refroidisseur"
>
<RepairObjectModel
@@ -63,23 +52,6 @@ export function RepairEbikeRepairTrigger({
</mesh>
</group>
)}
<TriggerObject
position={[
anchor[0] + TRIGGER_OFFSET[0],
anchor[1] + TRIGGER_OFFSET[1],
anchor[2] + TRIGGER_OFFSET[2],
]}
colliders="ball"
label="Changez le refroidisseur"
radius={REPAIR_INTERACTION_RADIUS}
onTrigger={handleRepair}
>
<mesh>
<sphereGeometry args={[0.55, 16, 16]} />
<meshBasicMaterial colorWrite={false} depthWrite={false} />
</mesh>
</TriggerObject>
</group>
);
}
+152 -7
View File
@@ -23,7 +23,10 @@ import {
REPAIR_REASSEMBLY_HOLD_MS,
} from "@/data/gameplay/repairGameConfig";
import { REPAIR_MISSIONS } from "@/data/gameplay/repairMissions";
import { EBIKE_REPAIRED_DIALOGUE_ID } from "@/data/ebike/ebikeConfig";
import {
EBIKE_REPAIRED_DIALOGUE_ID,
EBIKE_SCAN_HINT_DIALOGUE_ID,
} from "@/data/ebike/ebikeConfig";
import { useRepairFragmentationInput } from "@/hooks/gameplay/useRepairFragmentationInput";
import { useRepairMissionStep } from "@/hooks/gameplay/useRepairMissionStep";
import { useTerrainSnappedPosition } from "@/hooks/three/useTerrainHeight";
@@ -58,6 +61,11 @@ interface RepairMissionAssetPreloaderProps {
config: RepairMissionConfig;
}
interface EbikeRepairTransform {
position: Vector3Tuple;
rotationY: number;
}
function RepairMissionAssetPreloader({
config,
}: RepairMissionAssetPreloaderProps): null {
@@ -107,6 +115,11 @@ export function RepairGame({
const [explodedParts, setExplodedParts] = useState<readonly ExplodedPart[]>(
[],
);
const [ebikeRepairTransform, setEbikeRepairTransform] =
useState<EbikeRepairTransform | null>(null);
const [ebikeCoolingInstalled, setEbikeCoolingInstalled] = useState(false);
const fragmentedSplitSettledRef = useRef(false);
const fragmentedDialogueDoneRef = useRef(false);
const reassemblyDoneTimeoutRef = useRef<number | null>(null);
// Ebike-specific: once the repair starts, keep the entire repair flow
// exactly where the bike currently is. `Ebike` owns the live parked
@@ -115,11 +128,13 @@ export function RepairGame({
const livePosition = useMemo<Vector3Tuple>(() => {
if (mission !== "ebike" || step === "waiting") return position;
if (ebikeRepairTransform) return ebikeRepairTransform.position;
const parked = window.ebikeParkedPosition;
if (!parked) return position;
return [parked[0], parked[1], parked[2]];
}, [mission, position, step]);
}, [ebikeRepairTransform, mission, position, step]);
const usesLiveEbikePosition = mission === "ebike" && step !== "waiting";
const parsedScale = toVector3Scale(scale);
const terrainSnappedPosition = useTerrainSnappedPosition(livePosition);
@@ -133,6 +148,10 @@ export function RepairGame({
);
const isSplitPhase = (SPLIT_PHASES as readonly MissionStep[]).includes(step);
const isRepairing = step === "repairing";
const repairModelRotation: Vector3Tuple =
mission === "ebike" && ebikeRepairTransform
? [0, ebikeRepairTransform.rotationY, 0]
: (config.modelRotation ?? [0, 0, 0]);
const ebikeBrokenNodeName = config.brokenParts[0]?.targetNodeName;
const ebikeBrokenWorldAnchor = ebikeBrokenNodeName
? brokenAnchors[ebikeBrokenNodeName]
@@ -159,6 +178,7 @@ export function RepairGame({
setCaseAnchors({});
setBrokenAnchors({});
setScannedBrokenParts([]);
setEbikeCoolingInstalled(false);
}, 0);
return () => {
@@ -166,6 +186,45 @@ export function RepairGame({
};
}, [mainState, mission, step]);
useEffect(() => {
if (mission !== "ebike") return undefined;
if (mainState !== "ebike" || step === "waiting") {
const timeoutId = window.setTimeout(() => {
setEbikeRepairTransform(null);
setEbikeCoolingInstalled(false);
}, 0);
return () => {
window.clearTimeout(timeoutId);
};
}
if (ebikeRepairTransform) return undefined;
const parked = window.ebikeParkedPosition;
const rotationY =
window.ebikeParkedRotation ?? config.modelRotation?.[1] ?? 0;
const snapshot: EbikeRepairTransform = {
position: parked ? [parked[0], parked[1], parked[2]] : position,
rotationY,
};
const timeoutId = window.setTimeout(() => {
setEbikeRepairTransform(snapshot);
}, 0);
return () => {
window.clearTimeout(timeoutId);
};
}, [
config.modelRotation,
ebikeRepairTransform,
mainState,
mission,
position,
step,
]);
useEffect(() => {
if (mission !== "ebike") return;
if (mainState === "ebike") return;
@@ -221,6 +280,7 @@ export function RepairGame({
useEffect(() => {
if (mainState !== mission) return undefined;
if (step !== "fragmented") return undefined;
if (mission === "ebike") return undefined;
const timeoutId = window.setTimeout(
() => {
@@ -234,6 +294,71 @@ export function RepairGame({
};
}, [mainState, mission, setMissionStep, step]);
useEffect(() => {
if (mainState !== mission) return undefined;
if (mission !== "ebike") return undefined;
if (step !== "fragmented") return undefined;
fragmentedSplitSettledRef.current = false;
fragmentedDialogueDoneRef.current = false;
let cancelled = false;
let activeAudio: HTMLAudioElement | null = null;
let fallbackTimeoutId: number | null = null;
const tryAdvance = (): void => {
if (cancelled) return;
if (!fragmentedSplitSettledRef.current) return;
if (!fragmentedDialogueDoneRef.current) return;
setMissionStep(mission, "scanning");
};
const markDialogueDone = (): void => {
if (cancelled) return;
fragmentedDialogueDoneRef.current = true;
tryAdvance();
};
void (async () => {
const manifest = await loadDialogueManifest();
if (cancelled) return;
const audio = manifest
? await playDialogueById(manifest, EBIKE_SCAN_HINT_DIALOGUE_ID)
: null;
if (cancelled) {
if (audio && !audio.paused) {
audio.pause();
audio.currentTime = 0;
}
useSubtitleStore.getState().clearActiveSubtitle();
return;
}
activeAudio = audio;
if (audio) {
audio.addEventListener("ended", markDialogueDone, { once: true });
fallbackTimeoutId = window.setTimeout(markDialogueDone, 15000);
} else {
fallbackTimeoutId = window.setTimeout(markDialogueDone, 1000);
}
})();
return () => {
cancelled = true;
if (activeAudio) {
activeAudio.removeEventListener("ended", markDialogueDone);
if (!activeAudio.paused) {
activeAudio.pause();
activeAudio.currentTime = 0;
}
}
if (fallbackTimeoutId !== null) {
window.clearTimeout(fallbackTimeoutId);
}
useSubtitleStore.getState().clearActiveSubtitle();
};
}, [mainState, mission, setMissionStep, step]);
useEffect(() => {
if (mainState !== mission) return undefined;
if (step !== "reassembling") return undefined;
@@ -327,6 +452,13 @@ export function RepairGame({
() => (settledAt: 0 | 1) => {
const currentStep = stepRef.current;
if (settledAt === 1 && currentStep === "fragmented") {
if (mission === "ebike") {
fragmentedSplitSettledRef.current = true;
if (fragmentedDialogueDoneRef.current) {
setMissionStep(mission, "scanning");
}
return;
}
setMissionStep(mission, "scanning");
}
if (settledAt === 0 && currentStep === "reassembling") {
@@ -350,6 +482,14 @@ export function RepairGame({
};
}, []);
function handleEbikeCoolingInstall(): void {
if (ebikeCoolingInstalled) return;
setEbikeCoolingInstalled(true);
window.setTimeout(() => {
setMissionStep(mission, "reassembling");
}, 450);
}
if (mainState !== mission) return null;
if (step === "locked") return null;
@@ -376,7 +516,7 @@ export function RepairGame({
{isRepairPhase ? (
<ExplodableModel
modelPath={config.modelPath}
rotation={config.modelRotation ?? [0, 0, 0]}
rotation={repairModelRotation}
scale={config.modelScale ?? 1}
split={isSplitPhase}
splitSpeed={REPAIR_FRAGMENT_SPLIT_SPEED}
@@ -405,7 +545,7 @@ export function RepairGame({
{step === "repairing" && mission === "ebike" ? (
<RepairEbikeRepairTrigger
anchor={ebikeBrokenLocalAnchor}
onRepair={() => setMissionStep(mission, "reassembling")}
installed={ebikeCoolingInstalled}
/>
) : null}
{step === "repairing" && mission !== "ebike" ? (
@@ -441,10 +581,15 @@ export function RepairGame({
showFragmentationPrompt={
readyForFragmentation && mission !== "ebike"
}
{...(mission === "ebike" && step === "repairing"
? { interactLabel: "Changez le refroidisseur" }
: {})}
onInteract={
readyForFragmentation && mission !== "ebike"
? () => setMissionStep(mission, "fragmented")
: undefined
mission === "ebike" && step === "repairing"
? handleEbikeCoolingInstall
: readyForFragmentation && mission !== "ebike"
? () => setMissionStep(mission, "fragmented")
: undefined
}
/>
) : null}
@@ -25,6 +25,7 @@ interface RepairMissionCaseProps {
open?: boolean;
zoomed?: boolean;
showFragmentationPrompt?: boolean;
interactLabel?: string;
onInteract?: (() => void) | undefined;
}
@@ -37,6 +38,7 @@ export function RepairMissionCase({
open = false,
zoomed = false,
showFragmentationPrompt = false,
interactLabel,
onInteract,
}: RepairMissionCaseProps): React.JSX.Element {
const casePosition = zoomed
@@ -51,7 +53,7 @@ export function RepairMissionCase({
<TriggerObject
position={casePosition}
colliders="ball"
label={`Ouvrir ${config.label}`}
label={interactLabel ?? `Ouvrir ${config.label}`}
radius={REPAIR_INTERACTION_RADIUS}
onTrigger={onInteract}
>
@@ -1,4 +1,4 @@
import { useEffect, useRef } from "react";
import { useEffect, useRef, useState } from "react";
import { useFrame, useThree } from "@react-three/fiber";
import { RigidBody } from "@react-three/rapier";
import type { RapierRigidBody } from "@react-three/rapier";
@@ -35,6 +35,7 @@ interface GrabbableObjectProps {
label?: string;
handControlled?: boolean;
disabled?: boolean;
lockUntilGrab?: boolean;
onGrabChange?: (held: boolean) => void;
onPositionChange?: (position: THREE.Vector3) => void;
onSnap?: (position: THREE.Vector3) => void;
@@ -134,6 +135,7 @@ export function GrabbableObject({
label = GRAB_DEFAULT_LABEL,
handControlled = false,
disabled = false,
lockUntilGrab = false,
onGrabChange,
onPositionChange,
onSnap,
@@ -148,6 +150,7 @@ export function GrabbableObject({
const rbRef = useRef<RapierRigidBody>(null);
const isHolding = useRef(false);
const isHandHolding = useRef(false);
const [hasBeenGrabbed, setHasBeenGrabbed] = useState(false);
const snapTween = useRef<gsap.core.Tween | null>(null);
useEffect(() => {
@@ -288,6 +291,7 @@ export function GrabbableObject({
const hadHit = Boolean(hit);
if (hadHit) {
setHasBeenGrabbed(true);
isHandHolding.current = true;
InteractionManager.getInstance().setHandHolding(true);
onGrabChange?.(true);
@@ -330,7 +334,7 @@ export function GrabbableObject({
<group ref={spaceRef}>
<RigidBody
ref={rbRef}
type="dynamic"
type={lockUntilGrab && !hasBeenGrabbed ? "fixed" : "dynamic"}
colliders={colliders}
position={position}
>
@@ -344,6 +348,7 @@ export function GrabbableObject({
position={position}
bodyRef={rbRef}
onPress={() => {
setHasBeenGrabbed(true);
isHolding.current = true;
onGrabChange?.(true);
}}