diff --git a/src/app/tools/tankopedia/[id]/components/Model/TankDisplay.tsx b/src/app/tools/tankopedia/[id]/components/Model/TankDisplay.tsx
index af76ffd0c..86972f3de 100644
--- a/src/app/tools/tankopedia/[id]/components/Model/TankDisplay.tsx
+++ b/src/app/tools/tankopedia/[id]/components/Model/TankDisplay.tsx
@@ -132,7 +132,6 @@ export function TankDisplay({ duel }: TankDisplayProps) {
>
- {/* */}
diff --git a/src/app/tools/tankopedia/[id]/components/Model/components/TankArmor/components/ArmorHighlighting.tsx b/src/app/tools/tankopedia/[id]/components/Model/components/TankArmor/components/ArmorHighlighting.tsx
index 2d6fc6589..509c33806 100644
--- a/src/app/tools/tankopedia/[id]/components/Model/components/TankArmor/components/ArmorHighlighting.tsx
+++ b/src/app/tools/tankopedia/[id]/components/Model/components/TankArmor/components/ArmorHighlighting.tsx
@@ -136,6 +136,19 @@ export function ArmorHighlighting({ duel }: ArmorHighlightingProps) {
tankModelDefinition.trackThickness,
gunModelDefinition.barrelThickness,
);
+ const maxSpacedArmorThickness = Math.max(
+ ...armorNodes
+ .map((node) => {
+ const armorId = nameToArmorId(node.name);
+ const { spaced, thickness } = resolveArmor(
+ tankModelDefinition.armor,
+ armorId,
+ );
+
+ return spaced ? thickness : null;
+ })
+ .filter(Boolean),
+ );
return (
(({ duel }) => {
const wrapper = useRef(null);
const awaitedModelDefinitions = useModelDefinitions();
@@ -127,6 +138,19 @@ export const SpacedArmorDepth = memo(({ duel }) => {
tankModelDefinition.turrets[duel.protagonist.turret.id];
const gunModelDefinition =
turretModelDefinition.guns[duel.protagonist.gun.id];
+ const maxThickness = Math.max(
+ ...armorNodes
+ .map((node) => {
+ const armorId = nameToArmorId(node.name);
+ const { spaced, thickness } = resolveArmor(
+ tankModelDefinition.armor,
+ armorId,
+ );
+
+ return spaced ? thickness : null;
+ })
+ .filter(Boolean),
+ );
const turretOrigin = new Vector3(
tankModelDefinition.turretOrigin[0],
tankModelDefinition.turretOrigin[1],
@@ -162,7 +186,9 @@ export const SpacedArmorDepth = memo(({ duel }) => {
return (
@@ -205,7 +231,9 @@ export const SpacedArmorDepth = memo(({ duel }) => {
return (
(({ duel }) => {
return (
-
-
- );
-}
diff --git a/src/components/ArmorMesh/components/SpacedArmorDepth/index.tsx b/src/components/ArmorMesh/components/SpacedArmorDepth/index.tsx
new file mode 100644
index 000000000..e0fcda234
--- /dev/null
+++ b/src/components/ArmorMesh/components/SpacedArmorDepth/index.tsx
@@ -0,0 +1,41 @@
+import { MeshProps } from '@react-three/fiber';
+import { MeshStandardMaterial, WebGLRenderTarget } from 'three';
+import ThreeCustomShaderMaterial from 'three-custom-shader-material';
+import fragmentShader from './shaders/fragment.glsl';
+import vertexShader from './shaders/vertex.glsl';
+
+export const spacedArmorDepthRenderTarget = new WebGLRenderTarget();
+
+type ArmorMeshSpacedArmorDepthProps = MeshProps &
+ (
+ | {
+ include?: false;
+ }
+ | {
+ include: true;
+ thickness: number;
+ maxThickness: number;
+ }
+ );
+
+export function ArmorMeshSpacedArmorDepth(
+ props: ArmorMeshSpacedArmorDepthProps,
+) {
+ return (
+
+ {!props.include && }
+ {props.include && (
+
+ )}
+
+ );
+}
diff --git a/src/components/ArmorMesh/components/SpacedArmorDepth/shaders/fragment.glsl b/src/components/ArmorMesh/components/SpacedArmorDepth/shaders/fragment.glsl
new file mode 100644
index 000000000..4591101bd
--- /dev/null
+++ b/src/components/ArmorMesh/components/SpacedArmorDepth/shaders/fragment.glsl
@@ -0,0 +1,12 @@
+varying vec3 vCSMViewPosition;
+uniform float thickness;
+uniform float maxThickness;
+
+void main() {
+ vec3 normalizedNormal = normalize(vNormal);
+ vec3 normalizedViewPosition = normalize(vCSMViewPosition);
+ float dotProduct = dot(normalizedNormal, -normalizedViewPosition);
+ float angle = acos(dotProduct);
+
+ csm_FragColor = vec4(angle / PI, thickness / maxThickness, 0.0, 1.0);
+}
\ No newline at end of file
diff --git a/src/components/ArmorMesh/components/SpacedArmorDepth/shaders/vertex.glsl b/src/components/ArmorMesh/components/SpacedArmorDepth/shaders/vertex.glsl
new file mode 100644
index 000000000..afaeda2c0
--- /dev/null
+++ b/src/components/ArmorMesh/components/SpacedArmorDepth/shaders/vertex.glsl
@@ -0,0 +1,6 @@
+varying vec3 vCSMViewPosition;
+
+void main() {
+ vec4 vViewPosition4 = modelViewMatrix * vec4(position, 1.0);
+ vCSMViewPosition = vViewPosition4.xyz;
+}
\ No newline at end of file