TresAbhi/blitzkit
1
0 Fork 0
mirror of https://github.com/blitzkit/blitzkit.git synced 2026-10-21 02:37:05 +02:00
Code Issues Packages Projects Releases Wiki Activity

feat: isolated model hooks

Browse Source
This commit is contained in:
TrèsAbhi committed 2024-01-16 13:16:06 -06:00
1 parent 95b8532660
commit 1c64305678
6 files changed
+27 -36
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

src/app/tools/tankopedia/[id]/components/Model/components/TankArmor/components/ArmorHighlighting.tsx
+2 -7
View File
@@ -1,7 +1,5 @@
import { useLoader } from '@react-three/fiber';
import { useEffect, useRef } from 'react';
import { Euler, Group, Mesh, Vector3 } from 'three';
import { GLTFLoader } from 'three-stdlib';
import { degToRad } from 'three/src/math/MathUtils';
import { ArmorMesh } from '../../../../../../../../../components/ArmorMesh';
import {
@@ -9,13 +7,13 @@ import {
Y_AXIS,
Z_AXIS,
} from '../../../../../../../../../constants/axis';
import { asset } from '../../../../../../../../../core/blitzkrieg/asset';
import {
ModelTransformEventData,
modelTransformEvent,
} from '../../../../../../../../../core/blitzkrieg/modelTransform';
import { nameToArmorId } from '../../../../../../../../../core/blitzkrieg/nameToArmorId';
import { resolveArmor } from '../../../../../../../../../core/blitzkrieg/resolveThickness';
import { useArmor } from '../../../../../../../../../hooks/useArmor';
import { useModelDefinitions } from '../../../../../../../../../hooks/useModelDefinitions';
import { useTankopedia } from '../../../../../../../../../stores/tankopedia';
import { Duel } from '../../../../../page';
@@ -107,10 +105,7 @@ export function ArmorHighlighting({ duel }: ArmorHighlightingProps) {
return unsubscribe;
});
const armorGltf = useLoader(
GLTFLoader,
asset(`3d/tanks/armor/${duel.protagonist.tank.id}.glb`),
);
const armorGltf = useArmor(duel.protagonist.tank.id);
const armorNodes = Object.values(armorGltf.nodes);
const tankModelDefinition = modelDefinitions[duel.protagonist.tank.id];
src/app/tools/tankopedia/[id]/components/Model/components/TankArmor/components/ExternalModuleMask.tsx
+4 -11
View File
@@ -1,7 +1,5 @@
import { useLoader } from '@react-three/fiber';
import { memo, useEffect, useRef } from 'react';
import { Euler, Group, Mesh, Vector3 } from 'three';
import { GLTFLoader } from 'three-stdlib';
import { degToRad } from 'three/src/math/MathUtils';
import { ArmorMeshExternalModuleMask } from '../../../../../../../../../components/ArmorMesh';
import {
@@ -9,13 +7,14 @@ import {
Y_AXIS,
Z_AXIS,
} from '../../../../../../../../../constants/axis';
import { asset } from '../../../../../../../../../core/blitzkrieg/asset';
import {
ModelTransformEventData,
modelTransformEvent,
} from '../../../../../../../../../core/blitzkrieg/modelTransform';
import { nameToArmorId } from '../../../../../../../../../core/blitzkrieg/nameToArmorId';
import { resolveArmor } from '../../../../../../../../../core/blitzkrieg/resolveThickness';
import { useArmor } from '../../../../../../../../../hooks/useArmor';
import { useModel } from '../../../../../../../../../hooks/useModel';
import { useModelDefinitions } from '../../../../../../../../../hooks/useModelDefinitions';
import { useTankopedia } from '../../../../../../../../../stores/tankopedia';
import { Duel } from '../../../../../page';
@@ -114,14 +113,8 @@ export const ExternalModuleMask = memo<ExternalModuleMaskProps>(({ duel }) => {
return unsubscribe;
});
const armorGltf = useLoader(
GLTFLoader,
asset(`3d/tanks/armor/${duel.protagonist.tank.id}.glb`),
);
const modelGltf = useLoader(
GLTFLoader,
asset(`3d/tanks/models/${duel.protagonist.tank.id}.glb`),
);
const armorGltf = useArmor(duel.protagonist.tank.id);
const modelGltf = useModel(duel.protagonist.tank.id);
const armorNodes = Object.values(armorGltf.nodes);
const modelNodes = Object.values(modelGltf.nodes);
src/app/tools/tankopedia/[id]/components/Model/components/TankArmor/components/SpacedArmorDepth.tsx
+4 -11
View File
@@ -1,7 +1,5 @@
import { useLoader } from '@react-three/fiber';
import { memo, useEffect, useRef } from 'react';
import { Euler, Group, Mesh, Vector3 } from 'three';
import { GLTFLoader } from 'three-stdlib';
import { degToRad } from 'three/src/math/MathUtils';
import { ArmorMeshSpacedArmorDepth } from '../../../../../../../../../components/ArmorMesh/components/SpacedArmorDepth';
import {
@@ -9,13 +7,14 @@ import {
Y_AXIS,
Z_AXIS,
} from '../../../../../../../../../constants/axis';
import { asset } from '../../../../../../../../../core/blitzkrieg/asset';
import {
ModelTransformEventData,
modelTransformEvent,
} from '../../../../../../../../../core/blitzkrieg/modelTransform';
import { nameToArmorId } from '../../../../../../../../../core/blitzkrieg/nameToArmorId';
import { resolveArmor } from '../../../../../../../../../core/blitzkrieg/resolveThickness';
import { useArmor } from '../../../../../../../../../hooks/useArmor';
import { useModel } from '../../../../../../../../../hooks/useModel';
import { useModelDefinitions } from '../../../../../../../../../hooks/useModelDefinitions';
import { useTankopedia } from '../../../../../../../../../stores/tankopedia';
import { Duel } from '../../../../../page';
@@ -120,14 +119,8 @@ export const SpacedArmorDepth = memo<SpacedArmorDepthProps>(({ duel }) => {
return unsubscribe;
});
const armorGltf = useLoader(
GLTFLoader,
asset(`3d/tanks/armor/${duel.protagonist.tank.id}.glb`),
);
const modelGltf = useLoader(
GLTFLoader,
asset(`3d/tanks/models/${duel.protagonist.tank.id}.glb`),
);
const armorGltf = useArmor(duel.protagonist.tank.id);
const modelGltf = useModel(duel.protagonist.tank.id);
const armorNodes = Object.values(armorGltf.nodes);
const modelNodes = Object.values(modelGltf.nodes);
src/app/tools/tankopedia/[id]/components/Model/components/TankModel.tsx
+3 -7
View File
@@ -1,4 +1,4 @@
import { ThreeEvent, useLoader, useThree } from '@react-three/fiber';
import { ThreeEvent, useThree } from '@react-three/fiber';
import { memo, useEffect, useRef, useState } from 'react';
import {
Euler,
@@ -8,11 +8,9 @@ import {
Vector2,
Vector3,
} from 'three';
import { GLTFLoader } from 'three-stdlib';
import { degToRad } from 'three/src/math/MathUtils';
import { X_AXIS, Y_AXIS, Z_AXIS } from '../../../../../../../constants/axis';
import { applyPitchYawLimits } from '../../../../../../../core/blitz/applyPitchYawLimits';
import { asset } from '../../../../../../../core/blitzkrieg/asset';
import {
ModelDefinitions,
modelDefinitions,
@@ -23,6 +21,7 @@ import {
} from '../../../../../../../core/blitzkrieg/modelTransform';
import { resolveJsxTree } from '../../../../../../../core/blitzkrieg/resolveJsxTree';
import { normalizeAnglePI } from '../../../../../../../core/math/normalizeAngle180';
import { useModel } from '../../../../../../../hooks/useModel';
import mutateTankopedia, {
useTankopedia,
} from '../../../../../../../stores/tankopedia';
@@ -122,10 +121,7 @@ export const TankModel = memo(({ duel: { protagonist } }: TankModelProps) => {
tankModelDefinition.turrets[protagonist.turret.id];
const gunModelDefinition = turretModelDefinition.guns[protagonist.gun.id];
const gltf = useLoader(
GLTFLoader,
asset(`3d/tanks/models/${protagonist.tank.id}.glb`),
);
const gltf = useModel(protagonist.tank.id);
const nodes = Object.values(gltf.nodes);
return (
src/hooks/useArmor.ts
+7
View File
@@ -0,0 +1,7 @@
import { useLoader } from '@react-three/fiber';
import { GLTFLoader } from 'three-stdlib';
import { asset } from '../core/blitzkrieg/asset';
export function useArmor(id: number) {
return useLoader(GLTFLoader, asset(`3d/tanks/armor/${id}.glb`));
}
src/hooks/useModel.ts
+7
View File
@@ -0,0 +1,7 @@
import { useLoader } from '@react-three/fiber';
import { GLTFLoader } from 'three-stdlib';
import { asset } from '../core/blitzkrieg/asset';
export function useModel(id: number) {
return useLoader(GLTFLoader, asset(`3d/tanks/models/${id}.glb`));
}