From 5cae5d15831bfdfa5f9613c754b726880111f564 Mon Sep 17 00:00:00 2001 From: tresabhi <43380238+tresabhi@users.noreply.github.com> Date: Wed, 30 Sep 2026 17:56:31 -0500 Subject: [PATCH] models shit --- .../src/components/InitialCameraAligner.tsx | 8 +-- .../src/components/PrimaryArmorScene.tsx | 15 +++-- .../PrimaryArmorSceneComponent/index.tsx | 22 +++---- .../website/src/components/StaticArmor.tsx | 59 ++++++++++--------- .../components/StaticArmorSceneComponent.tsx | 8 +-- packages/website/src/components/TankModel.tsx | 48 +++++++-------- 6 files changed, 84 insertions(+), 76 deletions(-) diff --git a/packages/website/src/components/InitialCameraAligner.tsx b/packages/website/src/components/InitialCameraAligner.tsx index ca7da1b59..80f2c1970 100644 --- a/packages/website/src/components/InitialCameraAligner.tsx +++ b/packages/website/src/components/InitialCameraAligner.tsx @@ -1,16 +1,16 @@ import { useEffect } from "react"; import { degToRad } from "three/src/math/MathUtils.js"; -import { Duel } from "../../../../../../stores/duel"; import { api } from "../api/dynamic"; import { applyPitchYawLimits } from "../core/blitz/applyPitchYawLimits"; import { modelTransformEvent } from "../core/blitzkit/modelTransform"; +import { DuelModule, useDuel } from "../hooks/useDuel"; const modelDefinitions = await api.models(); export function InitialCameraAligner() { - const tank = Duel.use((state) => state.protagonist.tank); - const turret = Duel.use((state) => state.protagonist.turret); - const gun = Duel.use((state) => state.protagonist.gun); + const tank = useDuel("protagonist", DuelModule.Tank); + const turret = useDuel("protagonist", DuelModule.Turret); + const gun = useDuel("protagonist", DuelModule.Gun); const tankModel = modelDefinitions.models[tank.id]; const turretModel = tankModel.turrets[turret.id]; diff --git a/packages/website/src/components/PrimaryArmorScene.tsx b/packages/website/src/components/PrimaryArmorScene.tsx index be637907d..693ac7659 100644 --- a/packages/website/src/components/PrimaryArmorScene.tsx +++ b/packages/website/src/components/PrimaryArmorScene.tsx @@ -4,12 +4,13 @@ import { correctZYTuple } from "../core/blitz/correctZYTuple"; import { nameToArmorId } from "../core/blitzkit/nameToArmorId"; import { resolveArmor } from "../core/blitzkit/resolveThickness"; import { useArmor } from "../hooks/useArmor"; +import { useConsumable } from "../hooks/useConsumable"; import { DuelModule, useDuel } from "../hooks/useDuel"; -import { ModelTankWrapper } from "./ModelTankWrapper"; +import { useDuelModel } from "../hooks/useDuelModel"; +import { useTankTransform } from "../hooks/useTankTransform"; import { PrimaryArmorSceneComponent } from "./PrimaryArmorSceneComponent"; export const PrimaryArmorScene = memo(() => { - const wrapper = useRef(null); const turretContainer = useRef(null!); const gunContainer = useRef(null!); const tank = useDuel("protagonist", DuelModule.Tank); @@ -18,21 +19,19 @@ export const PrimaryArmorScene = memo(() => { const gun = useDuel("protagonist", DuelModule.Gun); const armorGltf = useArmor(tank.id).gltf; const armorNodes = Object.values(armorGltf.nodes); - const tankModelDefinition = useTankModelDefinition(); + const tankModelDefinition = useDuelModel("protagonist"); const trackModelDefinition = tankModelDefinition.tracks[track.id]; const turretModelDefinition = tankModelDefinition.turrets[turret.id]; const gunModelDefinition = turretModelDefinition.guns[gun.id]; const hullOrigin = correctZYTuple(trackModelDefinition.origin!); const turretOrigin = correctZYTuple(tankModelDefinition.turret_origin!); const gunOrigin = correctZYTuple(turretModelDefinition.gun_origin!); - const isDynamicArmorActive = Duel.use((state) => - state.protagonist.consumables.includes(73), - ); + const isDynamicArmorActive = useConsumable("protagonist", 73); useTankTransform(track, turret, turretContainer, gunContainer); return ( - + <> {armorNodes.map((node) => { const isHull = node.name.startsWith("hull_"); @@ -132,6 +131,6 @@ export const PrimaryArmorScene = memo(() => { })} - + ); }); diff --git a/packages/website/src/components/PrimaryArmorSceneComponent/index.tsx b/packages/website/src/components/PrimaryArmorSceneComponent/index.tsx index 4e851cb32..ba04066c8 100644 --- a/packages/website/src/components/PrimaryArmorSceneComponent/index.tsx +++ b/packages/website/src/components/PrimaryArmorSceneComponent/index.tsx @@ -23,7 +23,7 @@ import { hasEquipment } from "../../hooks/useEquipment"; import { Tankopedia } from "../../stores/tankopedia"; import { TankopediaPersistent } from "../../stores/tankopediaPersistent"; import { transitionEvent } from "../Lighting"; -import { spacedArmorRenderTarget } from "./PrimaryArmorRenderTarget"; +import { spacedArmorRenderTarget } from "../PrimaryArmorRenderTarget"; import fragmentShader from "./shaders/fragment.glsl?raw"; import vertexShader from "./shaders/vertex.glsl?raw"; @@ -134,6 +134,8 @@ export function PrimaryArmorSceneComponent({ if (!noInvalidate) invalidate(); } function handleAntagonistEquipmentChange(noInvalidate = false) { + const antagonist = getDuel("antagonist", DuelModule.Tank); + const equipment = Tankopedia.state.antagonist.equipment; const tankopediaEphemeral = Tankopedia.state; const shell = @@ -142,7 +144,7 @@ export function PrimaryArmorSceneComponent({ const penetration = shell.penetration!.near; const hasCalibratedShells = hasEquipment( 103, - Duel.state.antagonist.tank.equipment_preset, + antagonist.equipment_preset, equipment, ); @@ -150,9 +152,9 @@ export function PrimaryArmorSceneComponent({ penetration * resolvePenetrationCoefficient( hasCalibratedShells, - Duel.state.equalize, + Tankopedia.state.equalize, shell.type, - Duel.state.antagonist.tank.equalizer, + antagonist.equalizer, ); if (!noInvalidate) invalidate(); @@ -175,7 +177,7 @@ export function PrimaryArmorSceneComponent({ transitionEvent.on(handleTransitionEvent); const unsubscribes = [ - Duel.on((state) => state.antagonist.shell, handleShellChange), + Tankopedia.on((state) => state.antagonist.shell, handleShellChange), Tankopedia.on((state) => state.customShell, handleShellChange), TankopediaPersistent.on( (state) => state.greenPenetration, @@ -186,15 +188,15 @@ export function PrimaryArmorSceneComponent({ handleAdvancedHighlightingChange, ), TankopediaPersistent.on((state) => state.opaque, handleOpaqueChange), - Duel.on( - (state) => state.protagonist.equipmentMatrix, + Tankopedia.on( + (state) => state.protagonist.equipment, () => handleProtagonistEquipmentChange(), ), - Duel.on( - (state) => state.antagonist.equipmentMatrix, + Tankopedia.on( + (state) => state.antagonist.equipment, () => handleAntagonistEquipmentChange(), ), - Duel.on( + Tankopedia.on( (state) => state.equalize, () => { handleProtagonistEquipmentChange(); diff --git a/packages/website/src/components/StaticArmor.tsx b/packages/website/src/components/StaticArmor.tsx index f858de071..5984dd3ae 100644 --- a/packages/website/src/components/StaticArmor.tsx +++ b/packages/website/src/components/StaticArmor.tsx @@ -3,19 +3,19 @@ import { memo, useRef } from "react"; import { Group, Plane, Vector2, Vector3 } from "three"; import { applyPitchYawLimits } from "../core/blitz/applyPitchYawLimits"; import { correctZYTuple } from "../core/blitz/correctZYTuple"; -import { hasEquipment } from "../core/blitzkit/hasEquipment"; import { modelTransformEvent } from "../core/blitzkit/modelTransform"; import { nameToArmorId } from "../core/blitzkit/nameToArmorId"; import { resolveArmor } from "../core/blitzkit/resolveThickness"; import { controlsEnabledEvent } from "../core/controlsEnabled"; import { useArmor } from "../hooks/useArmor"; +import { useConsumable } from "../hooks/useConsumable"; +import { DuelModule, getDuel, useDuel } from "../hooks/useDuel"; +import { useDuelModel } from "../hooks/useDuelModel"; +import { hasEquipment } from "../hooks/useEquipment"; import { useModel } from "../hooks/useModel"; -import { useTankModelDefinition } from "../hooks/useTankModelDefinition"; import { useTankTransform } from "../hooks/useTankTransform"; -import { Duel } from "../stores/duel"; import { Tankopedia } from "../stores/tankopedia"; import { TankopediaPersistent } from "../stores/tankopediaPersistent"; -import { ModelTankWrapper } from "./ModelTankWrapper"; import { ArmorType } from "./SpacedArmorScene"; import { StaticArmorSceneComponent } from "./StaticArmorSceneComponent"; @@ -28,18 +28,19 @@ export interface ThicknessRange { } export const StaticArmor = memo(({ thicknessRange }) => { - const wrapper = useRef(null); const turretContainer = useRef(null!); const gunContainer = useRef(null!); - const tank = Duel.use((state) => state.protagonist.tank); - const track = Duel.use((state) => state.protagonist.track); - const turret = Duel.use((state) => state.protagonist.turret); - const gun = Duel.use((state) => state.protagonist.gun); + + const tank = useDuel("protagonist", DuelModule.Tank); + const track = useDuel("protagonist", DuelModule.Track); + const turret = useDuel("protagonist", DuelModule.Turret); + const gun = useDuel("protagonist", DuelModule.Gun); + const { gltf: armorGltf } = useArmor(tank.id); const { gltf: modelGltf } = useModel(tank.id); const armorNodes = Object.values(armorGltf.nodes); const modelNodes = Object.values(modelGltf.nodes); - const tankModelDefinition = useTankModelDefinition(); + const tankModelDefinition = useDuelModel("protagonist"); const trackModelDefinition = tankModelDefinition.tracks[track.id]; const turretModelDefinition = tankModelDefinition.turrets[turret.id]; const gunModelDefinition = turretModelDefinition.guns[gun.id]; @@ -61,14 +62,12 @@ export const StaticArmor = memo(({ thicknessRange }) => { const showExternalModules = TankopediaPersistent.use( (state) => state.showExternalModules, ); - const isDynamicArmorActive = Duel.use((state) => - state.protagonist.consumables.includes(73), - ); + const isDynamicArmorActive = useConsumable("protagonist", 73); useTankTransform(track, turret, turretContainer, gunContainer); return ( - + <> {armorNodes.map((node) => { const isHull = node.name.startsWith("hull_"); @@ -165,15 +164,17 @@ export const StaticArmor = memo(({ thicknessRange }) => { window.addEventListener("pointerup", handlePointerUp); } function handlePointerMove(event: PointerEvent) { + const protagonist = getDuel("protagonist", DuelModule.Tank); + const hasImprovedVerticalStabilizer = hasEquipment( 122, - Duel.state.protagonist.tank.equipment_preset, - Duel.state.protagonist.equipmentMatrix, + protagonist.equipment_preset, + Tankopedia.state.protagonist.equipment, ); const hasDownImprovedVerticalStabilizer = hasEquipment( 124, - Duel.state.protagonist.tank.equipment_preset, - Duel.state.protagonist.equipmentMatrix, + protagonist.equipment_preset, + Tankopedia.state.protagonist.equipment, ); const boundingRect = canvas.getBoundingClientRect(); @@ -253,15 +254,17 @@ export const StaticArmor = memo(({ thicknessRange }) => { window.addEventListener("pointerup", handlePointerUp); } function handlePointerMove(event: PointerEvent) { + const protagonist = getDuel("protagonist", DuelModule.Tank); + const hasImprovedVerticalStabilizer = hasEquipment( 122, - Duel.state.protagonist.tank.equipment_preset, - Duel.state.protagonist.equipmentMatrix, + protagonist.equipment_preset, + Tankopedia.state.protagonist.equipment, ); const hasDownImprovedVerticalStabilizer = hasEquipment( 124, - Duel.state.protagonist.tank.equipment_preset, - Duel.state.protagonist.equipmentMatrix, + protagonist.equipment_preset, + Tankopedia.state.protagonist.equipment, ); const boundingRect = canvas.getBoundingClientRect(); delta.set(event.clientX, event.clientY).sub(position); @@ -329,15 +332,17 @@ export const StaticArmor = memo(({ thicknessRange }) => { window.addEventListener("pointerup", handlePointerUp); } function handlePointerMove(event: PointerEvent) { + const protagonist = getDuel("protagonist", DuelModule.Tank); + const hasImprovedVerticalStabilizer = hasEquipment( 122, - Duel.state.protagonist.tank.equipment_preset, - Duel.state.protagonist.equipmentMatrix, + protagonist.equipment_preset, + Tankopedia.state.protagonist.equipment, ); const hasDownImprovedVerticalStabilizer = hasEquipment( 124, - Duel.state.protagonist.tank.equipment_preset, - Duel.state.protagonist.equipmentMatrix, + protagonist.equipment_preset, + Tankopedia.state.protagonist.equipment, ); const boundingRect = canvas.getBoundingClientRect(); delta.set(event.clientX, event.clientY).sub(position); @@ -385,6 +390,6 @@ export const StaticArmor = memo(({ thicknessRange }) => { })} - + ); }); diff --git a/packages/website/src/components/StaticArmorSceneComponent.tsx b/packages/website/src/components/StaticArmorSceneComponent.tsx index 1b706e9ab..7b5f21a89 100644 --- a/packages/website/src/components/StaticArmorSceneComponent.tsx +++ b/packages/website/src/components/StaticArmorSceneComponent.tsx @@ -16,16 +16,16 @@ import { Quaternion, Vector3, } from "three"; +import { defaultEqualizer } from "../config/equalizer"; import { unrotateDavaVector } from "../core/blitz/unrotateDavaVector"; import { jsxTree } from "../core/blitzkit/jsxTree"; import { modelTransformEvent, type ModelTransformEventData, } from "../core/blitzkit/modelTransform"; -import { defaultEqualizer } from "../core/blitzkit/tankToDuelMember"; import { discardClippingPlane } from "../core/three/discardClippingPlane"; +import { DuelModule, useDuel } from "../hooks/useDuel"; import { useEquipment } from "../hooks/useEquipment"; -import { Duel } from "../stores/duel"; import { Tankopedia } from "../stores/tankopedia"; import { transitionEvent } from "./Lighting"; import { ArmorType } from "./SpacedArmorScene"; @@ -75,8 +75,8 @@ export function StaticArmorSceneComponent({ }: StaticArmorSceneComponentProps) { const camera = useThree((state) => state.camera); const hasEnhancedArmor = useEquipment("protagonist", 110); - const tank = Duel.use((state) => state.protagonist.tank); - const equalize = Duel.use((state) => state.equalize); + const tank = useDuel("protagonist", DuelModule.Tank); + const equalize = Tankopedia.use((state) => state.equalize); const equalizer = (equalize ? tank.equalizer : undefined) ?? defaultEqualizer; const thicknessCoefficient = (hasEnhancedArmor ? 1.04 : 1) * equalizer.armor; const thickness = thicknessRaw * thicknessCoefficient; diff --git a/packages/website/src/components/TankModel.tsx b/packages/website/src/components/TankModel.tsx index 47035c4ad..c18a4f170 100644 --- a/packages/website/src/components/TankModel.tsx +++ b/packages/website/src/components/TankModel.tsx @@ -1,38 +1,36 @@ import { invalidate, useThree, type ThreeEvent } from "@react-three/fiber"; import { useRef } from "react"; import { Group, Mesh, MeshStandardMaterial, Vector2 } from "three"; -import { useTankModelDefinition } from "../../../../../../hooks/useTankModelDefinition"; -import { Duel } from "../../../../../../stores/duel"; import { applyPitchYawLimits } from "../core/blitz/applyPitchYawLimits"; -import { hasEquipment } from "../core/blitzkit/hasEquipment"; import { jsxTree } from "../core/blitzkit/jsxTree"; import { modelTransformEvent } from "../core/blitzkit/modelTransform"; import { controlsEnabledEvent } from "../core/controlsEnabled"; +import { DuelModule, useDuel } from "../hooks/useDuel"; +import { useDuelModel } from "../hooks/useDuelModel"; +import { hasEquipment } from "../hooks/useEquipment"; import { useModel } from "../hooks/useModel"; import { useTankTransform } from "../hooks/useTankTransform"; import { Tankopedia } from "../stores/tankopedia"; import { TankopediaDisplay } from "../stores/tankopediaPersistent/constants"; -import { ModelTankWrapper } from "./ModelTankWrapper"; export function TankModel() { - const protagonist = Duel.use((draft) => draft.protagonist); - const track = Duel.use((state) => state.protagonist.track); - const turret = Duel.use((state) => state.protagonist.turret); + const protagonist = Tankopedia.use((state) => state.protagonist); + const track = useDuel("protagonist", DuelModule.Track); + const turret = useDuel("protagonist", DuelModule.Turret); + const canvas = useThree((state) => state.gl.domElement); - const hullContainer = useRef(null); const turretContainer = useRef(null!); const gunContainer = useRef(null!); - const tankModelDefinition = useTankModelDefinition(); - const turretModelDefinition = - tankModelDefinition.turrets[protagonist.turret.id]; - const gunModelDefinition = turretModelDefinition.guns[protagonist.gun.id]; - const { gltf } = useModel(protagonist.tank.id); + const tankModelDefinition = useDuelModel("protagonist"); + const turretModelDefinition = tankModelDefinition.turrets[protagonist.turret]; + const gunModelDefinition = turretModelDefinition.guns[protagonist.gun]; + const { gltf } = useModel(protagonist.tank); const nodes = Object.values(gltf.nodes); useTankTransform(track, turret, turretContainer, gunContainer); return ( - + <> {nodes.map((node) => { const isHull = node.name === "hull"; const isWheel = node.name.startsWith("chassis_wheel_"); @@ -131,15 +129,17 @@ export function TankModel() { window.addEventListener("pointerup", handlePointerUp); } function handlePointerMove(event: PointerEvent) { + const protagonist = useDuel("protagonist", DuelModule.Tank); + const hasImprovedVerticalStabilizer = hasEquipment( 122, - Duel.state.protagonist.tank.equipment_preset, - Duel.state.protagonist.equipmentMatrix, + protagonist.equipment_preset, + Tankopedia.state.protagonist.equipment, ); const hasDownImprovedVerticalStabilizer = hasEquipment( 124, - Duel.state.protagonist.tank.equipment_preset, - Duel.state.protagonist.equipmentMatrix, + protagonist.equipment_preset, + Tankopedia.state.protagonist.equipment, ); const boundingRect = canvas.getBoundingClientRect(); @@ -214,15 +214,17 @@ export function TankModel() { window.addEventListener("pointerup", handlePointerUp); } function handlePointerMove(event: PointerEvent) { + const protagonist = useDuel("protagonist", DuelModule.Tank); + const hasImprovedVerticalStabilizer = hasEquipment( 122, - Duel.state.protagonist.tank.equipment_preset, - Duel.state.protagonist.equipmentMatrix, + protagonist.equipment_preset, + Tankopedia.state.protagonist.equipment, ); const hasDownImprovedVerticalStabilizer = hasEquipment( 124, - Duel.state.protagonist.tank.equipment_preset, - Duel.state.protagonist.equipmentMatrix, + protagonist.equipment_preset, + Tankopedia.state.protagonist.equipment, ); const boundingRect = canvas.getBoundingClientRect(); delta.set(event.clientX, event.clientY).sub(position); @@ -260,6 +262,6 @@ export function TankModel() { })} - + ); }