diff --git a/packages/website/src/components/Tankopedia/CharacteristicsSection/components/Characteristics/components/GunFlexibilityVisualizer/components/ModelChunk.tsx b/packages/website/src/components/Tankopedia/CharacteristicsSection/components/Characteristics/components/GunFlexibilityVisualizer/components/ModelChunk.tsx index 6e683bca3..2c2b83872 100644 --- a/packages/website/src/components/Tankopedia/CharacteristicsSection/components/Characteristics/components/GunFlexibilityVisualizer/components/ModelChunk.tsx +++ b/packages/website/src/components/Tankopedia/CharacteristicsSection/components/Characteristics/components/GunFlexibilityVisualizer/components/ModelChunk.tsx @@ -7,14 +7,42 @@ import { Duel } from '../../../../../../../../stores/duel'; const modelDefinitions = await awaitableModelDefinitions; -const surfaceMaterial = new MeshBasicMaterial({ - color: mauveDark.mauve6, - toneMapped: false, -}); -const outlineMaterial = new LineBasicMaterial({ - color: mauveDark.mauve8, - toneMapped: false, -}); +const surfaceMaterial: Record = { + gun: new MeshBasicMaterial({ + color: mauveDark.mauve11, + toneMapped: false, + }), + turret: new MeshBasicMaterial({ + color: mauveDark.mauve6, + toneMapped: false, + transparent: true, + opacity: 0.25, + }), + body: new MeshBasicMaterial({ + color: mauveDark.mauve9, + toneMapped: false, + transparent: true, + opacity: 0.5, + }), +}; +const outlineMaterial: Record = { + gun: new LineBasicMaterial({ + color: mauveDark.mauve3, + toneMapped: false, + }), + turret: new LineBasicMaterial({ + color: mauveDark.mauve8, + toneMapped: false, + transparent: true, + opacity: 0.25, + }), + body: new LineBasicMaterial({ + color: mauveDark.mauve11, + toneMapped: false, + transparent: true, + opacity: 0.5, + }), +}; interface Props { only: 'gun' | 'turret' | 'body'; @@ -67,8 +95,8 @@ export function ModelChunk({ only }: Props) { mesh(mesh, props, key) { return ( <> - - + + diff --git a/packages/website/src/components/Tankopedia/CharacteristicsSection/components/Characteristics/components/GunFlexibilityVisualizer/index.tsx b/packages/website/src/components/Tankopedia/CharacteristicsSection/components/Characteristics/components/GunFlexibilityVisualizer/index.tsx index 06b02b794..f5a5d8fa0 100644 --- a/packages/website/src/components/Tankopedia/CharacteristicsSection/components/Characteristics/components/GunFlexibilityVisualizer/index.tsx +++ b/packages/website/src/components/Tankopedia/CharacteristicsSection/components/Characteristics/components/GunFlexibilityVisualizer/index.tsx @@ -194,8 +194,8 @@ export function GunFlexibilityVisualizer({ transparent, ${Var('orange-a2')} ${Math.PI / 2 - maxPitch - CONIC_TRANSITION}rad, - ${Var('cyan-a5')} ${Math.PI / 2 - maxPitch}rad, - ${Var('jade-a5')} ${Math.PI / 2 - minPitch}rad, + ${Var('cyan-a6')} ${Math.PI / 2 - maxPitch}rad, + ${Var('jade-a6')} ${Math.PI / 2 - minPitch}rad, ${Var('orange-a2')} ${Math.PI / 2 - minPitch + CONIC_TRANSITION}rad, transparent 180deg diff --git a/packages/website/src/components/Tankopedia/HeroSection/components/TankSandbox/components/TankModel.tsx b/packages/website/src/components/Tankopedia/HeroSection/components/TankSandbox/components/TankModel.tsx index 0e295bdb6..f0d15081d 100644 --- a/packages/website/src/components/Tankopedia/HeroSection/components/TankSandbox/components/TankModel.tsx +++ b/packages/website/src/components/Tankopedia/HeroSection/components/TankSandbox/components/TankModel.tsx @@ -110,23 +110,6 @@ export function TankModel() { /> ); }, - - // group(group) { - // return { - // visible: - // group.name !== 'ST_base' && - // group.name !== 'MR_Base2' && - // (!group.name.includes('state_entity') || - // (isDynamicArmorActive && - // group.name.includes('state_entity_01')) || - // (!isDynamicArmorActive && - // group.name.includes('state_entity_00'))) && - // (!group.name.includes('shields') || - // (isDynamicArmorActive && - // group.name.includes('shields_rev')) || - // (!isDynamicArmorActive && group.name.endsWith('shields'))), - // }; - // }, }); })} @@ -214,24 +197,6 @@ export function TankModel() { /> ); }, - - // group(group) { - // return { - // visible: - // group.name !== 'ST_base' && - // group.name !== 'MR_Base2' && - // (!group.name.includes('state_entity') || - // (isDynamicArmorActive && - // group.name.includes('state_entity_01')) || - // (!isDynamicArmorActive && - // group.name.includes('state_entity_00'))) && - // (!group.name.includes('shields') || - // (isDynamicArmorActive && - // group.name.includes('shields_rev')) || - // (!isDynamicArmorActive && - // group.name.endsWith('shields'))), - // }; - // }, }); })} @@ -321,24 +286,6 @@ export function TankModel() { /> ); }, - - // group(group) { - // return { - // visible: - // group.name !== 'ST_base' && - // group.name !== 'MR_Base2' && - // (!group.name.includes('state_entity') || - // (isDynamicArmorActive && - // group.name.includes('state_entity_01')) || - // (!isDynamicArmorActive && - // group.name.includes('state_entity_00'))) && - // (!group.name.includes('shields') || - // (isDynamicArmorActive && - // group.name.includes('shields_rev')) || - // (!isDynamicArmorActive && - // group.name.endsWith('shields'))), - // }; - // }, }); })} diff --git a/packages/website/src/hooks/useTankTransform.ts b/packages/website/src/hooks/useTankTransform.ts index e053f4486..8cb7f256b 100644 --- a/packages/website/src/hooks/useTankTransform.ts +++ b/packages/website/src/hooks/useTankTransform.ts @@ -6,6 +6,7 @@ import { TurretDefinition, } from '@blitzkit/core'; import { invalidate } from '@react-three/fiber'; +import type { QuicklimeEvent } from 'quicklime'; import { type RefObject, useEffect } from 'react'; import { Euler, Group, Vector3 } from 'three'; import { degToRad } from 'three/src/math/MathUtils.js'; @@ -37,10 +38,16 @@ export function useTankTransform( const gunPosition = new Vector3(); const gunRotation = new Euler(); - function handleModelTransform(modelTransform?: ModelTransformEventData) { + function handleModelTransform( + event: QuicklimeEvent, + ) { + handleModelTransformInner(event.data); + } + + function handleModelTransformInner(data?: ModelTransformEventData) { const duel = duelStore.getState(); - const yaw = modelTransform?.yaw ?? duel.protagonist.yaw; - const pitch = modelTransform?.pitch ?? duel.protagonist.pitch; + const yaw = data?.yaw ?? duel.protagonist.yaw; + const pitch = data?.pitch ?? duel.protagonist.pitch; gunPosition .set(0, 0, 0) @@ -91,18 +98,18 @@ export function useTankTransform( invalidate(); } - handleModelTransform(); + handleModelTransformInner(); modelTransformEvent.on(handleModelTransform); const unsubscribes = [ duelStore.subscribe( (state) => state.protagonist.pitch, - () => handleModelTransform(), + () => handleModelTransformInner(), ), duelStore.subscribe( (state) => state.protagonist.yaw, - () => handleModelTransform(), + () => handleModelTransformInner(), ), () => modelTransformEvent.off(handleModelTransform), ];