From 0f299335d61c1bb15c9abccff4b1eb65a8e27740 Mon Sep 17 00:00:00 2001 From: Mark Greene Date: Wed, 28 Oct 2026 20:49:14 +1300 Subject: [PATCH 1/9] Fix: Legendary camouflage parts, materials, names and attachments MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Fixes a batch of legendary camouflage problems in the Tankopedia viewer, adds three missing unique camouflages and lets attachments be shown together with a camouflage. ## Camouflage parts (state switchers) - Camouflages now choose which tank pieces show the same way the game does. Each switcher's load-time scenario script runs at export time (checks for attached camouflage items, or compares the camouflage preset), along with its state-switch actions. This replaces the old guess from part names (new `core/blitzkit/switcherStates.ts`). - Fixes missing roof MGs, fenders and fuel tanks (IS-3 Bear, Obj. 140 Terror, IS-7, IS-4, FV215b 183, AMX 50 B, KV-1S) and default parts mixed into camouflages (Pershing Speedfire, Forest Witch Fullmetal, Waffenträger Goldstreifen). - Switchers inside camouflage parts now show one state instead of all of them stacked (Obj. Kust double net, Goldstreifen stowage, Tiger II cat). - States are matched by original node names, because the GLTF loader renames duplicates. - Camouflage part meshes with no LODs (`lodIndex -1`) are kept, which restores the Tiger II cat body and missing pieces on about 11 other camouflages. ## Materials - `AlphaBlend` materials export as transparent. `AlphaBlendAdditive` materials export as additive and are applied in `jsxTree`, and unlit `Textured` materials export as unlit (IS-8 Raroh flames, dinosaur holograms, and glass and screens on a few base tanks). - Camouflage part materials that share a name with the tank's material no longer replace the tank's camouflage material (Bisonte C45 Unbreakable). ## Names - With a legendary camouflage selected, the title shows the tank's in-battle name ("GuP Type 95 Ha-Go", "KV-1 Warrior", "Shinobi"). - Camouflages without a name in the game files yet show "Unreleased" in orange instead of their raw string key, and no longer crash the tank names list. ## Attachments - Attachments (`kind: customization`) are listed in their own group under the camouflages and can be turned on together with a camouflage. They load the same way as camouflages and fade with the same transition. ## Other - Liberté, You Rock! and Ozzie (single-tank camouflages that only set a preset through `override`) are now available. - Mastery gun mark meshes (`custom_gun_marks_*`) are no longer drawn (Helsing, HWT20 FalconFire and two camouflage guns). ## Not included - Pixel Wave, Digital Trace and Forest Shadow are tiled pattern camouflages, which the viewer can't render yet. - FV301 Corbie's drone position and the dinosaur heads' glow depend on camouflage animations and emissive materials, which are separate PRs. Fixes #417 Fixes #419 Fixes #421 --- .../api/server/2_camouflageDefinitions.ts | 17 +- packages/core/src/blitzkit/tankNames.ts | 2 +- .../src/protos/camouflage_definitions.proto | 1 + .../core/src/protos/camouflage_definitions.ts | 19 +- packages/core/src/streams/sc2.ts | 2 + packages/core/src/types/camouflagesYaml.ts | 5 + packages/i18n/strings/en.json | 3 + .../Options/components/SkinSwitcher.tsx | 107 +++++--- .../components/TankSandbox/Title/index.tsx | 13 +- .../TankSandbox/components/Lighting.tsx | 11 +- .../TankSandbox/components/TankModel.tsx | 8 +- .../website/src/core/blitzkit/jsxTree.tsx | 15 +- .../website/src/core/blitzkit/skinTree.tsx | 73 +++-- .../src/core/blitzkit/switcherStates.ts | 255 ++++++++++++++++++ packages/website/src/hooks/useSkin.ts | 27 +- .../[id]/skins/[skin].glb.ts | 78 +++--- .../[...chunk_models_tanks]/[id]/model.glb.ts | 33 ++- packages/website/src/stores/tankopedia.ts | 3 + 18 files changed, 559 insertions(+), 113 deletions(-) create mode 100644 packages/website/src/core/blitzkit/switcherStates.ts diff --git a/packages/core/src/blitzkit/api/server/2_camouflageDefinitions.ts b/packages/core/src/blitzkit/api/server/2_camouflageDefinitions.ts index e2b81e3f9..460d4ec66 100644 --- a/packages/core/src/blitzkit/api/server/2_camouflageDefinitions.ts +++ b/packages/core/src/blitzkit/api/server/2_camouflageDefinitions.ts @@ -3,6 +3,7 @@ import { Sc2ReadStream, type TankParameters, } from "@blitzkit/core"; +import locales from "@blitzkit/i18n/locales.json"; import { isEqual, times } from "lodash-es"; import { Cache } from "./0_base"; import { ServerBlitzKitAPI1 } from "./1_tankDefinitions"; @@ -87,14 +88,19 @@ export abstract class ServerBlitzKitAPI2 extends ServerBlitzKitAPI1 { ), ); + const [nation, tankKey] = vehicle.split(":"); + // some unique camos only set the preset for their one tank + const preset = + yamlEntry.preset ?? + yamlEntry.override?.[nation]?.override?.[tankKey]?.preset; let hasPreset = false; - if (camo.group === "legendary" && yamlEntry.preset !== undefined) { + if (preset !== undefined) { if (!skinPresets.has(vehicle)) { skinPresets.set(vehicle, this.skinPresets(vehicle)); } - hasPreset = (await skinPresets.get(vehicle)!).has(yamlEntry.preset); + hasPreset = (await skinPresets.get(vehicle)!).has(preset); } if (resolvedParts.some(Boolean) || hasPreset) { @@ -102,7 +108,11 @@ export abstract class ServerBlitzKitAPI2 extends ServerBlitzKitAPI1 { } } - const name = this.getString(camo.userString); + // unreleased camos are in the game files before their names + const name = + camo.userString in this.stringsI18n[locales.default] + ? this.getString(camo.userString) + : undefined; camouflageDefinitions.camouflages[camo.id] = { id: camo.id, @@ -110,6 +120,7 @@ export abstract class ServerBlitzKitAPI2 extends ServerBlitzKitAPI1 { tank_name: resolvedTankName, tank_name_full: resolvedTankNameFull, tank_id: tankId, + attachment: camo.kind === "customization", }; } diff --git a/packages/core/src/blitzkit/tankNames.ts b/packages/core/src/blitzkit/tankNames.ts index 15462add5..d55c74f75 100644 --- a/packages/core/src/blitzkit/tankNames.ts +++ b/packages/core/src/blitzkit/tankNames.ts @@ -38,7 +38,7 @@ export async function fetchTankNames(api: BlitzKitAPI) { ?.map((id) => locales.supported.map( ({ locale }) => - camouflageDefinitions.camouflages[id]?.name!.locales[locale], + camouflageDefinitions.camouflages[id]?.name?.locales[locale], ), ) .flat() diff --git a/packages/core/src/protos/camouflage_definitions.proto b/packages/core/src/protos/camouflage_definitions.proto index bae9a1c46..2bbf5e2c3 100644 --- a/packages/core/src/protos/camouflage_definitions.proto +++ b/packages/core/src/protos/camouflage_definitions.proto @@ -14,4 +14,5 @@ message Camouflage { optional I18nString tank_name = 3; optional I18nString tank_name_full = 4; optional uint32 tank_id = 5; + optional bool attachment = 6; } \ No newline at end of file diff --git a/packages/core/src/protos/camouflage_definitions.ts b/packages/core/src/protos/camouflage_definitions.ts index 3ba5ae248..14466cb1c 100644 --- a/packages/core/src/protos/camouflage_definitions.ts +++ b/packages/core/src/protos/camouflage_definitions.ts @@ -25,6 +25,7 @@ export interface Camouflage { tank_name?: I18nString | undefined; tank_name_full?: I18nString | undefined; tank_id?: number | undefined; + attachment?: boolean | undefined; } function createBaseCamouflageDefinitions(): CamouflageDefinitions { @@ -192,7 +193,7 @@ export const CamouflageDefinitions_CamouflagesEntry: MessageFns = { @@ -212,6 +213,9 @@ export const Camouflage: MessageFns = { if (message.tank_id !== undefined && message.tank_id !== 0) { writer.uint32(40).uint32(message.tank_id); } + if (message.attachment !== undefined && message.attachment !== false) { + writer.uint32(48).bool(message.attachment); + } return writer; }, @@ -262,6 +266,14 @@ export const Camouflage: MessageFns = { message.tank_id = reader.uint32(); continue; } + case 6: { + if (tag !== 48) { + break; + } + + message.attachment = reader.bool(); + continue; + } } if ((tag & 7) === 4 || tag === 0) { break; @@ -278,6 +290,7 @@ export const Camouflage: MessageFns = { tank_name: isSet(object.tank_name) ? I18nString.fromJSON(object.tank_name) : undefined, tank_name_full: isSet(object.tank_name_full) ? I18nString.fromJSON(object.tank_name_full) : undefined, tank_id: isSet(object.tank_id) ? globalThis.Number(object.tank_id) : 0, + attachment: isSet(object.attachment) ? globalThis.Boolean(object.attachment) : false, }; }, @@ -298,6 +311,9 @@ export const Camouflage: MessageFns = { if (message.tank_id !== undefined && message.tank_id !== 0) { obj.tank_id = Math.round(message.tank_id); } + if (message.attachment !== undefined && message.attachment !== false) { + obj.attachment = message.attachment; + } return obj; }, @@ -317,6 +333,7 @@ export const Camouflage: MessageFns = { ? I18nString.fromPartial(object.tank_name_full) : undefined; message.tank_id = object.tank_id ?? 0; + message.attachment = object.attachment ?? false; return message; }, }; diff --git a/packages/core/src/streams/sc2.ts b/packages/core/src/streams/sc2.ts index 73e2a2147..db490d602 100644 --- a/packages/core/src/streams/sc2.ts +++ b/packages/core/src/streams/sc2.ts @@ -40,6 +40,8 @@ export interface ConfigArchive { interface EnabledPresets { AlphaTest: boolean; + AlphaBlend?: boolean; + AlphaBlendAdditive?: boolean; } interface Flags { diff --git a/packages/core/src/types/camouflagesYaml.ts b/packages/core/src/types/camouflagesYaml.ts index 1be674afa..35d1531ca 100644 --- a/packages/core/src/types/camouflagesYaml.ts +++ b/packages/core/src/types/camouflagesYaml.ts @@ -5,5 +5,10 @@ export type CamouflagesYaml = Record< shortUserString?: string; preset?: string; customEntities?: Record; + // nation -> tank + override?: Record< + string, + { override?: Record } + >; } >; diff --git a/packages/i18n/strings/en.json b/packages/i18n/strings/en.json index 5bed66678..559bf4d35 100644 --- a/packages/i18n/strings/en.json +++ b/packages/i18n/strings/en.json @@ -484,6 +484,9 @@ "model": { "name": "Model" }, + "skins": { + "unreleased": "Unreleased" + }, "dynamic": { "name": "Dynamic armor", diff --git a/packages/website/src/components/Tankopedia/HeroSection/components/Options/components/SkinSwitcher.tsx b/packages/website/src/components/Tankopedia/HeroSection/components/Options/components/SkinSwitcher.tsx index 762ed5ca8..6971bad78 100644 --- a/packages/website/src/components/Tankopedia/HeroSection/components/Options/components/SkinSwitcher.tsx +++ b/packages/website/src/components/Tankopedia/HeroSection/components/Options/components/SkinSwitcher.tsx @@ -1,5 +1,5 @@ import { alias } from "@blitzkit/core"; -import { Flex, Tooltip } from "@radix-ui/themes"; +import { Flex, Text, Tooltip } from "@radix-ui/themes"; import { uniqBy } from "lodash-es"; import { SKIN_NUMBER } from "../../../../../../constants/skinNumber"; import { api } from "../../../../../../core/blitzkit/api"; @@ -14,21 +14,30 @@ const camouflageDefinitions = await api.camouflageDefinitions(); export function SkinSwitcher() { const tank = Duel.use((state) => state.protagonist.tank); const skin = Tankopedia.use((state) => state.requestedSkin); + const attachment = Tankopedia.use((state) => state.requestedAttachment); const requestedDisplay = Tankopedia.use((state) => state.requestedDisplay); const disturbed = Tankopedia.use((state) => state.disturbed); - const { unwrap } = useLocale(); + const { unwrap, strings } = useLocale(); const skins = uniqBy( Object.values(camouflageDefinitions.camouflages).filter( (camouflage) => camouflage.tank_id === tank.id, ), - (camouflage) => unwrap(camouflage.name!), + (camouflage) => + (camouflage.name && unwrap(camouflage.name)) || camouflage.id, ); + // attachments aren't camouflages so they get their own group + const groups = [ + skins.filter((camouflage) => !camouflage.attachment), + skins.filter((camouflage) => camouflage.attachment), + ].filter((group) => group.length > 0); + if (skins.length === 0) return null; return ( - {skins.map((camouflage, index) => { - const name = unwrap(camouflage.name!).replace( - "%(camo_num)", - SKIN_NUMBER, - ); - const top = index === 0 ? "var(--radius-full)" : "0"; - const bottom = index === skins.length - 1 ? "var(--radius-full)" : "0"; + {groups.map((group) => ( + + {group.map((camouflage, index) => { + const rawName = camouflage.name && unwrap(camouflage.name); + const name = rawName + ? rawName.replace("%(camo_num)", SKIN_NUMBER) + : strings.website.tools.tankopedia.sandbox.skins.unreleased; + const top = index === 0 ? "var(--radius-full)" : "0"; + const bottom = + index === group.length - 1 ? "var(--radius-full)" : "0"; - return ( - - { - Tankopedia.mutate((draft) => { - draft.requestedSkin = - draft.requestedSkin === camouflage.id - ? undefined - : camouflage.id; - }); - }} - /> - - ); - })} + return ( + {name} + ) + } + side="left" + > + { + const slot = camouflage.attachment + ? "requestedAttachment" + : "requestedSkin"; + + Tankopedia.mutate((draft) => { + draft[slot] = + draft[slot] === camouflage.id + ? undefined + : camouflage.id; + }); + }} + /> + + ); + })} + + ))} ); } diff --git a/packages/website/src/components/Tankopedia/HeroSection/components/TankSandbox/Title/index.tsx b/packages/website/src/components/Tankopedia/HeroSection/components/TankSandbox/Title/index.tsx index 17bb872e8..d3708ad8a 100644 --- a/packages/website/src/components/Tankopedia/HeroSection/components/TankSandbox/Title/index.tsx +++ b/packages/website/src/components/Tankopedia/HeroSection/components/TankSandbox/Title/index.tsx @@ -22,9 +22,16 @@ export function Title({ skeleton }: MaybeSkeletonComponentProps) { const camouflage = skin === undefined ? undefined : camouflageDefinitions.camouflages[skin]; const tankName = unwrap(protagonist.name!); - const name = camouflage - ? `${tankName} ${unwrap(camouflage.name!).replace("%(camo_num)", SKIN_NUMBER)}` - : tankName; + // legendary camos carry the tank's in-battle name + const name = ( + camouflage + ? camouflage.tank_name + ? unwrap(camouflage.tank_name) + : camouflage.name + ? `${tankName} ${unwrap(camouflage.name)}` + : tankName + : tankName + ).replace("%(camo_num)", SKIN_NUMBER); const fontSize = revealed ? disturbed ? "1.5rem" diff --git a/packages/website/src/components/Tankopedia/HeroSection/components/TankSandbox/components/Lighting.tsx b/packages/website/src/components/Tankopedia/HeroSection/components/TankSandbox/components/Lighting.tsx index f440de6da..d6293f09b 100644 --- a/packages/website/src/components/Tankopedia/HeroSection/components/TankSandbox/components/Lighting.tsx +++ b/packages/website/src/components/Tankopedia/HeroSection/components/TankSandbox/components/Lighting.tsx @@ -48,7 +48,9 @@ export function Lighting({ hasPbr }: Props) { const requestedDisplay = Tankopedia.use((state) => state.requestedDisplay); const revealed = Tankopedia.use((state) => state.revealed); const skinPending = Tankopedia.use( - (state) => state.loadedSkin !== state.skin, + (state) => + state.loadedSkin !== state.skin || + state.loadedAttachment !== state.attachment, ); const animationTime = useRef(REVEAL_ANIMATION_TIME); @@ -245,9 +247,14 @@ function Animator({ }); } - if (x >= 1 && Tankopedia.state.skin !== Tankopedia.state.loadedSkin) { + if ( + x >= 1 && + (Tankopedia.state.skin !== Tankopedia.state.loadedSkin || + Tankopedia.state.attachment !== Tankopedia.state.loadedAttachment) + ) { Tankopedia.mutate((draft) => { draft.skin = draft.loadedSkin; + draft.attachment = draft.loadedAttachment; }); } }); 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 22b850f5b..88ac06c6e 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 @@ -30,6 +30,8 @@ export function TankModel() { const { gltf } = useModel(protagonist.tank.id); const nodes = Object.values(gltf.nodes); const skinGltf = useSkin(protagonist.tank.id); + const attachmentGltf = useSkin(protagonist.tank.id, "attachment"); + const skins = [skinGltf, attachmentGltf].filter((skin) => skin !== undefined); useTankTransform(track, turret, turretContainer, gunContainer); @@ -94,7 +96,7 @@ export function TankModel() { window.removeEventListener("pointerup", handlePointerUp); } - return skinTree(node, skinGltf, { + return skinTree(node, skins, { mesh(_, props, key) { return ( [1]; -export function skinTree( - node: Object3D, - skin: Skin | undefined, - mergers: Mergers, -) { - const skinNodes = new Map( - skin?.scene.children.map((node) => [node.name, node]), - ); +// names get sanitized and made unique on load +function nameOf(object3d: Object3D): string { + return object3d.userData.name ?? object3d.name; +} + +/** + * skins are layered in order, so an attachment's states win over the + * camouflage's + */ +export function skinTree(node: Object3D, skins: Skin[], mergers: Mergers) { + const skinNodes = new Map(); + const materials = new Map(); + const states: Record = {}; + + for (const skin of skins) { + for (const node of skin.scene.children) { + skinNodes.set(node.name, [...(skinNodes.get(node.name) ?? []), node]); + } + + for (const [name, material] of skin.materials) { + materials.set(name, material); + } + + Object.assign(states, skin.scene.userData.states); + } + + function switchChildren(object3d: Object3D, childMergers: Mergers) { + if (object3d.userData.state === undefined) return; + + const name = nameOf(object3d); + const state = name in states ? states[name] : object3d.userData.state; + + return object3d.children + .filter((child) => nameOf(child) === state) + .map((child) => jsxTree(child, childMergers)); + } + + const partMergers: Mergers = { + ...mergers, + group(object3d, props, key) { + return ( + + {switchChildren(object3d, partMergers) ?? props.children} + + ); + }, + }; const skinMergers: Mergers = { mesh(mesh, props, key) { - const material = skin?.materials.get((mesh.material as Material).name); + const material = materials.get((mesh.material as Material).name); return mergers!.mesh!( mesh, @@ -23,20 +62,14 @@ export function skinTree( ); }, group(object3d, props, key) { - const skinNode = skinNodes.get(object3d.name); - const isSwitch = object3d.userData.state !== undefined; - const state = skin - ? skin.scene.userData.states[object3d.name] - : object3d.userData.state; + const parts = skinNodes.get(object3d.name) ?? []; return ( - {isSwitch - ? object3d.children - .filter((child) => child.name === state) - .map((child) => jsxTree(child, skinMergers)) - : props.children} - {skinNode?.children.map((child) => jsxTree(child, mergers))} + {switchChildren(object3d, skinMergers) ?? props.children} + {parts.flatMap((part) => + part.children.map((child) => jsxTree(child, partMergers)), + )} ); }, diff --git a/packages/website/src/core/blitzkit/switcherStates.ts b/packages/website/src/core/blitzkit/switcherStates.ts new file mode 100644 index 000000000..568675946 --- /dev/null +++ b/packages/website/src/core/blitzkit/switcherStates.ts @@ -0,0 +1,255 @@ +import { parseHierarchies, type Sc2ReadStream } from "@blitzkit/core"; +import { times } from "lodash-es"; + +interface Value { + "any.type": string; + "any.value": unknown; +} + +interface ScriptNode { + type: string; + node: Record & { defaults?: Record }; + connections?: Record< + string, + { pinIn: string; pinOut: string; target: string } + >; +} + +interface Script { + nodes: Record; +} + +interface Action { + "act.delay": number; + "act.entityName": string; + "act.event": number; + "act.switchIndex": number; + "act.type": number; + "act.userEventId": string; +} + +interface Entity { + name: string; + parent?: Entity; + children: Entity[]; +} + +const SELF_ENTITY = "*** Self ***"; +const SCENE_LOADED_EVENT = 1; +const USER_EVENT = 2; +const SWITCH_ACTIONS = [8, 9]; +// what the game fires as a tank is shown in the garage, in order +const LOAD_EVENTS = ["Added", "TankAliveInHangar", "TankIsShownInNewScreen"]; +const MAX_DEPTH = 64; + +function findChild(entity: Entity, name: string): Entity | undefined { + for (const child of entity.children) { + if (child.name === name) return child; + + const found = findChild(child, name); + + if (found) return found; + } +} + +function resolveTarget(owner: Entity, entityName: string) { + if (entityName === SELF_ENTITY) return owner; + + const [first, ...rest] = entityName.split("->"); + let target: Entity | undefined; + + for ( + let ancestor: Entity | undefined = owner; + ancestor && !target; + ancestor = ancestor.parent + ) { + target = ancestor.name === first ? ancestor : findChild(ancestor, first); + } + + for (const name of rest) target = target && findChild(target, name); + + return target; +} + +/** + * replays what picks each state switcher's state as a tank is shown in the + * garage, with the camo's preset applied and its items attached; delayed + * actions are skipped so states stay as they are when the tank appears + */ +export function switcherStates( + sc2: ReturnType, + preset: string | undefined, + attachments: Map, +) { + const scripts: Record = {}; + const stateNames = new Map(); + const scenarios: { owner: Entity; script: Script }[] = []; + const actions: { owner: Entity; action: Action }[] = []; + const states: Record = {}; + + function activateState(entity: Entity | undefined, state: number) { + const names = entity && stateNames.get(entity); + + if (names) states[entity.name] = names[state] ?? null; + } + + for (const component of Object.values( + sc2["#sceneComponents"] as unknown as Record, + ) as { "comp.typename"?: string; "ssc.scripts"?: Record }[]) { + if (component?.["comp.typename"] !== "ScenarioSingletonComponent") continue; + + Object.assign(scripts, component["ssc.scripts"]); + } + + parseHierarchies( + sc2["#hierarchy"], + { name: "", children: [] }, + (hierarchy, components, parent) => { + const entity: Entity = { name: hierarchy.name, parent, children: [] }; + + parent.children.push(entity); + + for (const item of attachments.get(hierarchy.name) ?? []) { + entity.children.push({ name: item, parent: entity, children: [] }); + } + + for (const component of components) { + switch (component["comp.typename"]) { + case "StateSwitcherComponent": { + const names = times( + component["ssc.statesCount"], + (index) => component[`ssc.state${index}`], + ); + + stateNames.set(entity, names); + states[entity.name] = names[component["ssc.activeState"]] ?? null; + break; + } + + case "ScenarioComponent": { + const script = scripts[component["scenario.scriptId"]]; + + if (script) scenarios.push({ owner: entity, script }); + break; + } + + case "ActionComponent": + times(component["ac.actionCount"], (index) => { + actions.push({ + owner: entity, + action: component[index.toString().padStart(4, "0")] as Action, + }); + }); + break; + } + } + + return entity; + }, + ); + + function runScenario( + { owner, script }: (typeof scenarios)[number], + event: string, + ) { + const { nodes } = script; + const links = (id: string) => Object.values(nodes[id].connections ?? {}); + + function input(id: string, pin: string): unknown { + const link = links(id).find((link) => link.pinIn === pin); + + return link + ? output(link.target, link.pinOut) + : nodes[id].node.defaults?.[pin]?.["any.value"]; + } + + function output(id: string, pin: string): unknown { + const { type, node } = nodes[id]; + + switch (type) { + case "ScenarioSceneInfoNode": + return node["scenarioSceneInfoNode.infoKind"] === "GetCurrentEntity" + ? owner + : undefined; + + case "ScenarioGetMemberNode": + return node["scenarioGetMemberNode.fieldName"] === "parent" && + pin === "parent" + ? (input(id, "object") as Entity | undefined)?.parent + : undefined; + + case "ScenarioFunctionNode": + switch ( + `${node["scenarioFunctionNode.className"]}.${node["scenarioFunctionNode.functionName"]}` + ) { + case "Entity.FindChildByName": { + const entity = input(id, "entity") as Entity | undefined; + return entity && findChild(entity, input(id, "name") as string); + } + + case "TankComponent.GetAppliedSkinMaterialConfigName": + return preset; + + case "String.Compare": + return input(id, "1") === input(id, "2"); + } + } + } + + function execute(id: string, depth: number) { + if (depth > MAX_DEPTH) return; + + const { type, node } = nodes[id]; + let pin = "exit"; + + if (type === "ScenarioEventNode") { + pin = "event"; + } else if (type === "ScenarioBranchNode") { + pin = input(id, "condition") ? "true" : "false"; + } else if ( + node["scenarioFunctionNode.functionName"] === "ActivateState" + ) { + activateState( + input(id, "entity") as Entity | undefined, + Number(input(id, "state")), + ); + } + + for (const link of links(id)) { + if (link.pinIn === pin) execute(link.target, depth + 1); + } + } + + for (const id in nodes) { + const { type, node } = nodes[id]; + const name = + node["ScenarioEventNode.eventName"] === "Custom" + ? node.defaults?.["Event Name"]?.["any.value"] + : node["ScenarioEventNode.eventName"]; + + if (type === "ScenarioEventNode" && name === event) execute(id, 0); + } + } + + for (const event of LOAD_EVENTS) { + for (const { owner, action } of actions) { + if ( + action["act.delay"] === 0 && + SWITCH_ACTIONS.includes(action["act.type"]) && + (event === LOAD_EVENTS[0] + ? action["act.event"] === SCENE_LOADED_EVENT + : action["act.event"] === USER_EVENT && + action["act.userEventId"] === event) + ) { + activateState( + resolveTarget(owner, action["act.entityName"]), + action["act.switchIndex"], + ); + } + } + + for (const scenario of scenarios) runScenario(scenario, event); + } + + return states; +} diff --git a/packages/website/src/hooks/useSkin.ts b/packages/website/src/hooks/useSkin.ts index 6514d2482..93a6a0811 100644 --- a/packages/website/src/hooks/useSkin.ts +++ b/packages/website/src/hooks/useSkin.ts @@ -18,7 +18,11 @@ async function loadSkin(path: string) { const materials: Material[] = await gltf.parser.getDependencies("material"); const skin = { scene: gltf.scene, - materials: new Map(materials.map((material) => [material.name, material])), + materials: new Map( + materials + .filter((material) => material.userData.camouflage) + .map((material) => [material.name, material]), + ), }; loadedSkins.set(path, skin); @@ -30,9 +34,16 @@ function skinPath(id: number, skin: number) { return alias("models_legendary", `/${id}/skins/${skin}.glb`); } -export function useSkin(id: number) { - const requestedSkin = Tankopedia.use((state) => state.requestedSkin); - const skin = Tankopedia.use((state) => state.skin); +// attachments load the same way as camouflages and can be shown with one +const slots = { + skin: { requested: "requestedSkin", loaded: "loadedSkin" }, + attachment: { requested: "requestedAttachment", loaded: "loadedAttachment" }, +} as const; + +export function useSkin(id: number, slot: keyof typeof slots = "skin") { + const { requested, loaded } = slots[slot]; + const requestedSkin = Tankopedia.use((state) => state[requested]); + const skin = Tankopedia.use((state) => state[slot]); useEffect(() => { const path = @@ -41,7 +52,7 @@ export function useSkin(id: number) { if (path === undefined || loadedSkins.has(path)) { Tankopedia.mutate((draft) => { - draft.loadedSkin = requestedSkin; + draft[loaded] = requestedSkin; }); return; } @@ -62,8 +73,8 @@ export function useSkin(id: number) { settled = true; Tankopedia.mutate((draft) => { - draft.loadedSkin = requestedSkin; - draft.skin = requestedSkin; + draft[loaded] = requestedSkin; + draft[slot] = requestedSkin; draft.revealed = true; }); }); @@ -76,7 +87,7 @@ export function useSkin(id: number) { draft.revealed = true; }); }; - }, [id, requestedSkin]); + }, [id, slot, requestedSkin]); return skin === undefined ? undefined : loadedSkins.get(skinPath(id, skin)); } diff --git a/packages/website/src/pages/[...chunk_models_legendary]/[id]/skins/[skin].glb.ts b/packages/website/src/pages/[...chunk_models_legendary]/[id]/skins/[skin].glb.ts index 0d64498f4..ca5145d1b 100644 --- a/packages/website/src/pages/[...chunk_models_legendary]/[id]/skins/[skin].glb.ts +++ b/packages/website/src/pages/[...chunk_models_legendary]/[id]/skins/[skin].glb.ts @@ -7,6 +7,7 @@ import { } from "@blitzkit/core"; import { Document, + Material, Node, NodeIO, PropertyType, @@ -19,6 +20,7 @@ import type { Vector3Tuple, Vector4Tuple } from "three"; import { SKIN_NUMBER } from "../../../../constants/skinNumber"; import { api } from "../../../../core/blitzkit/api"; import { mixStaticPaths } from "../../../../core/blitzkit/mixStaticPaths"; +import { switcherStates } from "../../../../core/blitzkit/switcherStates"; import { vfs } from "../../../../core/blitzkit/vfs"; import { extractMaterials, @@ -67,8 +69,10 @@ export async function GET({ props }: APIContext<{ skin: number }>) { const [nation, tankKey] = ( include as { vehicle: { name: string } } ).vehicle.name.split(":"); - const { preset, customEntities } = camouflagesYaml[key]; - const skinNumber = Number(preset?.match(/(\d+)$/)?.[1] ?? 1); + const { customEntities } = camouflagesYaml[key]; + const preset = + camouflagesYaml[key].preset ?? + camouflagesYaml[key].override?.[nation]?.override?.[tankKey]?.preset; const parameters = await vfs.yaml( `Data/3d/Tanks/Parameters/${nation}/${tankKey}.yaml`, ); @@ -88,7 +92,6 @@ export async function GET({ props }: APIContext<{ skin: number }>) { scale: Vector3Tuple; } > = {}; - const states: Record = {}; parseHierarchies(sc2["#hierarchy"], null, (hierarchy, components) => { for (const component of components) { @@ -111,43 +114,50 @@ export async function GET({ props }: APIContext<{ skin: number }>) { scale: component["sc.attachmentScale"] as Vector3Tuple, }; } - - if (component["comp.typename"] !== "StateSwitcherComponent") continue; - - const active = component[`ssc.state${component["ssc.activeState"]}`]; - // camos without their own variant keep the default piece, but groups - // of elements to hide stay hidden - let state: string | null = - active && !/skin\d*/.test(active) && !active.includes("hide") - ? active - : null; - - for (let index = 0; index < component["ssc.statesCount"]; index++) { - const name = component[`ssc.state${index}`]; - const match = name.match(/skin(\d*)/); - - if ( - match && - !name.includes("hide") && - Number(match[1] || 1) === skinNumber - ) { - state = name; - } - } - - states[hierarchy.name] = state; } return null; }); + const attachments = new Map(); + + for (const name in customEntities) { + const slot = slots[name]; + + if (!slot) continue; + + attachments.set(slot.target, [ + ...(attachments.get(slot.target) ?? []), + customEntities[name].item, + ]); + } + + const states = switcherStates(sc2, preset, attachments); + + // attachments are layered over camouflages, so they only keep what they change + if (camouflagesXml.root.camouflages[key].kind === "customization") { + const baseline = switcherStates(sc2, preset, new Map()); + + for (const name in states) { + if (states[name] === baseline[name]) delete states[name]; + } + } const document = new Document(); - const scene = document.createScene().setExtras({ states }); + const scene = document.createScene(); const targets = new Map(); document.createBuffer(); - if (preset) await extractMaterials(document, sc2, basePath, preset); + if (preset) { + const materials = await extractMaterials(document, sc2, basePath, preset); + + // parts may share these names, so mark the ones that replace the tank's + for (const material of materials.values()) { + if (!(material instanceof Material)) continue; + + material.setExtras({ ...material.getExtras(), camouflage: true }); + } + } for (const name in customEntities) { const slot = slots[name]; @@ -163,6 +173,12 @@ export async function GET({ props }: APIContext<{ skin: number }>) { } const part = await extractModel(vfs, path, true); + const partSc2 = new Sc2ReadStream( + (await vfs.file(`Data/3d/${path}.sc2`)).buffer as ArrayBuffer, + ).sc2(); + + Object.assign(states, switcherStates(partSc2, preset, new Map())); + const map = mergeDocuments(document, part); const partScene = map.get(part.getRoot().listScenes()[0]) as Scene; const node = document @@ -186,6 +202,8 @@ export async function GET({ props }: APIContext<{ skin: number }>) { target.addChild(node); } + scene.setExtras({ states }); + applySkinNumber(document, SKIN_NUMBER); await document.transform( diff --git a/packages/website/src/pages/[...chunk_models_tanks]/[id]/model.glb.ts b/packages/website/src/pages/[...chunk_models_tanks]/[id]/model.glb.ts index c4f5a5392..771655ba0 100644 --- a/packages/website/src/pages/[...chunk_models_tanks]/[id]/model.glb.ts +++ b/packages/website/src/pages/[...chunk_models_tanks]/[id]/model.glb.ts @@ -14,7 +14,7 @@ import { } from "@blitzkit/core"; import type { AbstractVFS } from "@blitzkit/core/src/blitzkit/vfs/abstract"; import { Document, Material, Node, NodeIO, Scene } from "@gltf-transform/core"; -import { ALL_EXTENSIONS } from "@gltf-transform/extensions"; +import { ALL_EXTENSIONS, KHRMaterialsUnlit } from "@gltf-transform/extensions"; import { dedup, prune } from "@gltf-transform/functions"; import type { APIContext } from "astro"; import { isEqual, times } from "lodash-es"; @@ -65,7 +65,13 @@ export async function GET({ props }: APIContext<{ id: number }>) { const ERROR_ON_UNKNOWN_COMPONENT = false; const omitMeshNames = { - start: ["chassis_chassis_", "chassis_track_crash_", "HP_"], + start: [ + "chassis_chassis_", + "chassis_track_crash_", + "HP_", + // mastery marks a new tank doesn't have yet + "custom_gun_marks_", + ], end: ["_POINT"], }; @@ -132,7 +138,8 @@ export async function extractModel( times(renderObject["ro.batchCount"], (batchIndex): void => { const lodIndex = renderObject[`rb${batchIndex}.lodIndex`]; - if (lodIndex !== 0) return; + // -1 means the batch has no lods and is always drawn + if (lodIndex !== 0 && !(isPart && lodIndex === -1)) return; const batchKey = batchIndex.toString().padStart(4, "0"); const batch = renderObject["ro.batches"][batchKey]; @@ -345,6 +352,26 @@ export async function extractMaterials( } } + const enabledPresets = + node.enabledPresets ?? defaultConfigArchive?.enabledPresets; + const fxName = node.fxName ?? defaultConfigArchive?.fxName; + + if (enabledPresets?.AlphaBlend || enabledPresets?.AlphaBlendAdditive) { + material.setAlphaMode("BLEND"); + } + + if (enabledPresets?.AlphaBlendAdditive) { + // gltf has no additive blending so the viewer applies it + material.setExtras({ blending: "additive" }); + } + + if (fxName?.endsWith("/Textured.material")) { + material.setExtension( + "KHR_materials_unlit", + document.createExtension(KHRMaterialsUnlit).createUnlit(), + ); + } + if (textures.miscMap) { material.setOcclusionTexture( document diff --git a/packages/website/src/stores/tankopedia.ts b/packages/website/src/stores/tankopedia.ts index 04a11ee78..3beaaffd6 100644 --- a/packages/website/src/stores/tankopedia.ts +++ b/packages/website/src/stores/tankopedia.ts @@ -106,6 +106,9 @@ interface Tankopedia { requestedSkin?: number; loadedSkin?: number; skin?: number; + requestedAttachment?: number; + loadedAttachment?: number; + attachment?: number; requestedDisplay: TankopediaDisplay; display: TankopediaDisplay; statSearch?: string; From 484d4ae3dae0de2bc51cef293a9ff1eff2f0673f Mon Sep 17 00:00:00 2001 From: tresabhi <43380238+tresabhi@users.noreply.github.com> Date: Thu, 29 Oct 2026 11:07:11 -0500 Subject: [PATCH 2/9] please dont make name undefinedable, just default to the string id --- .../src/blitzkit/api/server/2_camouflageDefinitions.ts | 7 +------ 1 file changed, 1 insertion(+), 6 deletions(-) diff --git a/packages/core/src/blitzkit/api/server/2_camouflageDefinitions.ts b/packages/core/src/blitzkit/api/server/2_camouflageDefinitions.ts index 460d4ec66..4462f1010 100644 --- a/packages/core/src/blitzkit/api/server/2_camouflageDefinitions.ts +++ b/packages/core/src/blitzkit/api/server/2_camouflageDefinitions.ts @@ -3,7 +3,6 @@ import { Sc2ReadStream, type TankParameters, } from "@blitzkit/core"; -import locales from "@blitzkit/i18n/locales.json"; import { isEqual, times } from "lodash-es"; import { Cache } from "./0_base"; import { ServerBlitzKitAPI1 } from "./1_tankDefinitions"; @@ -108,11 +107,7 @@ export abstract class ServerBlitzKitAPI2 extends ServerBlitzKitAPI1 { } } - // unreleased camos are in the game files before their names - const name = - camo.userString in this.stringsI18n[locales.default] - ? this.getString(camo.userString) - : undefined; + const name = this.getString(camo.userString); camouflageDefinitions.camouflages[camo.id] = { id: camo.id, From bddcf10e90c974421d7b6e6d0f31ccc37c622acf Mon Sep 17 00:00:00 2001 From: tresabhi <43380238+tresabhi@users.noreply.github.com> Date: Thu, 29 Oct 2026 11:07:33 -0500 Subject: [PATCH 3/9] assert --- packages/core/src/blitzkit/tankNames.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/core/src/blitzkit/tankNames.ts b/packages/core/src/blitzkit/tankNames.ts index d55c74f75..15462add5 100644 --- a/packages/core/src/blitzkit/tankNames.ts +++ b/packages/core/src/blitzkit/tankNames.ts @@ -38,7 +38,7 @@ export async function fetchTankNames(api: BlitzKitAPI) { ?.map((id) => locales.supported.map( ({ locale }) => - camouflageDefinitions.camouflages[id]?.name?.locales[locale], + camouflageDefinitions.camouflages[id]?.name!.locales[locale], ), ) .flat() From e5be69dd37b7dfdd712f19f00a5ce72b68fda534 Mon Sep 17 00:00:00 2001 From: tresabhi <43380238+tresabhi@users.noreply.github.com> Date: Thu, 29 Oct 2026 11:08:20 -0500 Subject: [PATCH 4/9] no unreleased! --- packages/i18n/strings/en.json | 3 --- 1 file changed, 3 deletions(-) diff --git a/packages/i18n/strings/en.json b/packages/i18n/strings/en.json index 559bf4d35..5bed66678 100644 --- a/packages/i18n/strings/en.json +++ b/packages/i18n/strings/en.json @@ -484,9 +484,6 @@ "model": { "name": "Model" }, - "skins": { - "unreleased": "Unreleased" - }, "dynamic": { "name": "Dynamic armor", From 523fee501019e14492d2ce7c9aa7bf99de75a16b Mon Sep 17 00:00:00 2001 From: tresabhi <43380238+tresabhi@users.noreply.github.com> Date: Thu, 29 Oct 2026 11:15:28 -0500 Subject: [PATCH 5/9] its only ever going to be standard material --- packages/website/src/core/blitzkit/jsxTree.tsx | 17 ++++------------- 1 file changed, 4 insertions(+), 13 deletions(-) diff --git a/packages/website/src/core/blitzkit/jsxTree.tsx b/packages/website/src/core/blitzkit/jsxTree.tsx index e79b2390b..9cf52a79b 100644 --- a/packages/website/src/core/blitzkit/jsxTree.tsx +++ b/packages/website/src/core/blitzkit/jsxTree.tsx @@ -1,11 +1,5 @@ import type { ComponentProps, ReactNode } from "react"; -import { - AdditiveBlending, - Material, - Mesh, - MeshStandardMaterial, - Object3D, -} from "three"; +import { AdditiveBlending, Mesh, MeshStandardMaterial, Object3D } from "three"; export function jsxTree( node: Object3D, @@ -33,13 +27,10 @@ export function jsxTree( if (props.material instanceof MeshStandardMaterial) { props.material.depthWrite = true; - } - if ( - props.material instanceof Material && - props.material.userData.blending === "additive" - ) { - props.material.blending = AdditiveBlending; + if (props.material.userData.blending === "additive") { + props.material.blending = AdditiveBlending; + } } return mergers?.mesh ? ( From c772d47a07d13572ce372799c0f63c7c2c2c9f51 Mon Sep 17 00:00:00 2001 From: Mark Greene Date: Fri, 30 Oct 2026 07:11:31 +1300 Subject: [PATCH 6/9] Fix: Unify Tankopedia model, camouflage and attachment loaders - Tankopedia state uses `loaders: { model, skin, attachment }` with `requested` and `loaded` - useSkin swaps the camouflage halfway through the lighting transition for both cached and downloaded skins - Remove the leftover "Unreleased" camouflage name handling --- .../GunFlexibilityVisualizer/index.tsx | 4 +- .../Options/components/SkinSwitcher.tsx | 46 ++++++++---------- .../HeroSection/components/Options/index.tsx | 4 +- .../components/TankSandbox/Title/index.tsx | 12 ++--- .../TankSandbox/components/Lighting.tsx | 16 ++----- .../Tankopedia/HeroSection/index.tsx | 4 +- packages/website/src/hooks/useSkin.ts | 48 +++++++++---------- packages/website/src/stores/tankopedia.ts | 23 +++++---- 8 files changed, 74 insertions(+), 83 deletions(-) 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 f28050abc..cb975b796 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 @@ -44,7 +44,9 @@ export function GunFlexibilityVisualizer({ 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 modelRequested = Tankopedia.use((state) => state.modelRequested); + const modelRequested = Tankopedia.use( + (state) => state.loaders.model.requested, + ); const tankModel = modelDefinition.models[tank.id]; const turretModel = tankModel.turrets[turret.id]; diff --git a/packages/website/src/components/Tankopedia/HeroSection/components/Options/components/SkinSwitcher.tsx b/packages/website/src/components/Tankopedia/HeroSection/components/Options/components/SkinSwitcher.tsx index 6971bad78..0858016c9 100644 --- a/packages/website/src/components/Tankopedia/HeroSection/components/Options/components/SkinSwitcher.tsx +++ b/packages/website/src/components/Tankopedia/HeroSection/components/Options/components/SkinSwitcher.tsx @@ -1,5 +1,5 @@ import { alias } from "@blitzkit/core"; -import { Flex, Text, Tooltip } from "@radix-ui/themes"; +import { Flex, Tooltip } from "@radix-ui/themes"; import { uniqBy } from "lodash-es"; import { SKIN_NUMBER } from "../../../../../../constants/skinNumber"; import { api } from "../../../../../../core/blitzkit/api"; @@ -13,17 +13,18 @@ const camouflageDefinitions = await api.camouflageDefinitions(); export function SkinSwitcher() { const tank = Duel.use((state) => state.protagonist.tank); - const skin = Tankopedia.use((state) => state.requestedSkin); - const attachment = Tankopedia.use((state) => state.requestedAttachment); + const skin = Tankopedia.use((state) => state.loaders.skin.requested); + const attachment = Tankopedia.use( + (state) => state.loaders.attachment.requested, + ); const requestedDisplay = Tankopedia.use((state) => state.requestedDisplay); const disturbed = Tankopedia.use((state) => state.disturbed); - const { unwrap, strings } = useLocale(); + const { unwrap } = useLocale(); const skins = uniqBy( Object.values(camouflageDefinitions.camouflages).filter( (camouflage) => camouflage.tank_id === tank.id, ), - (camouflage) => - (camouflage.name && unwrap(camouflage.name)) || camouflage.id, + (camouflage) => unwrap(camouflage.name!), ); // attachments aren't camouflages so they get their own group @@ -54,26 +55,16 @@ export function SkinSwitcher() { {groups.map((group) => ( {group.map((camouflage, index) => { - const rawName = camouflage.name && unwrap(camouflage.name); - const name = rawName - ? rawName.replace("%(camo_num)", SKIN_NUMBER) - : strings.website.tools.tankopedia.sandbox.skins.unreleased; + const name = unwrap(camouflage.name!).replace( + "%(camo_num)", + SKIN_NUMBER, + ); const top = index === 0 ? "var(--radius-full)" : "0"; const bottom = index === group.length - 1 ? "var(--radius-full)" : "0"; return ( - {name} - ) - } - side="left" - > + { - const slot = camouflage.attachment - ? "requestedAttachment" - : "requestedSkin"; - Tankopedia.mutate((draft) => { - draft[slot] = - draft[slot] === camouflage.id + const loader = + draft.loaders[ + camouflage.attachment ? "attachment" : "skin" + ]; + + loader.requested = + loader.requested === camouflage.id ? undefined : camouflage.id; }); diff --git a/packages/website/src/components/Tankopedia/HeroSection/components/Options/index.tsx b/packages/website/src/components/Tankopedia/HeroSection/components/Options/index.tsx index 725ec6803..695cbc55f 100644 --- a/packages/website/src/components/Tankopedia/HeroSection/components/Options/index.tsx +++ b/packages/website/src/components/Tankopedia/HeroSection/components/Options/index.tsx @@ -82,7 +82,9 @@ export function Options({ thicknessRange, canvas, skeleton }: OptionsProps) { const revealed = Tankopedia.use((state) => state.revealed); const disturbed = Tankopedia.use((state) => state.disturbed); const highGraphics = TankopediaPersistent.use((state) => state.highGraphics); - const modelRequested = Tankopedia.use((state) => state.modelRequested); + const modelRequested = Tankopedia.use( + (state) => state.loaders.model.requested, + ); const equalize = Duel.use((state) => state.equalize); const equalizer = Duel.use((state) => state.antagonist.tank.equalizer); diff --git a/packages/website/src/components/Tankopedia/HeroSection/components/TankSandbox/Title/index.tsx b/packages/website/src/components/Tankopedia/HeroSection/components/TankSandbox/Title/index.tsx index d3708ad8a..d8ed0dfd6 100644 --- a/packages/website/src/components/Tankopedia/HeroSection/components/TankSandbox/Title/index.tsx +++ b/packages/website/src/components/Tankopedia/HeroSection/components/TankSandbox/Title/index.tsx @@ -13,12 +13,14 @@ const camouflageDefinitions = await api.camouflageDefinitions(); export function Title({ skeleton }: MaybeSkeletonComponentProps) { const { unwrap, strings } = useLocale(); - const modelRequested = Tankopedia.use((state) => state.modelRequested); + const modelRequested = Tankopedia.use( + (state) => state.loaders.model.requested, + ); const protagonist = Duel.use((state) => state.protagonist.tank); const revealed = Tankopedia.use((state) => state.revealed); const disturbed = Tankopedia.use((state) => state.disturbed); const hasRevealed = useRef(false); - const skin = Tankopedia.use((state) => state.requestedSkin); + const skin = Tankopedia.use((state) => state.loaders.skin.requested); const camouflage = skin === undefined ? undefined : camouflageDefinitions.camouflages[skin]; const tankName = unwrap(protagonist.name!); @@ -27,9 +29,7 @@ export function Title({ skeleton }: MaybeSkeletonComponentProps) { camouflage ? camouflage.tank_name ? unwrap(camouflage.tank_name) - : camouflage.name - ? `${tankName} ${unwrap(camouflage.name)}` - : tankName + : `${tankName} ${unwrap(camouflage.name!)}` : tankName ).replace("%(camo_num)", SKIN_NUMBER); const fontSize = revealed @@ -109,7 +109,7 @@ export function Title({ skeleton }: MaybeSkeletonComponentProps) { onPointerDown={(event) => event.stopPropagation()} onClick={() => { Tankopedia.mutate((draft) => { - draft.modelRequested = true; + draft.loaders.model.requested = true; }); }} > diff --git a/packages/website/src/components/Tankopedia/HeroSection/components/TankSandbox/components/Lighting.tsx b/packages/website/src/components/Tankopedia/HeroSection/components/TankSandbox/components/Lighting.tsx index d6293f09b..8ce7701ca 100644 --- a/packages/website/src/components/Tankopedia/HeroSection/components/TankSandbox/components/Lighting.tsx +++ b/packages/website/src/components/Tankopedia/HeroSection/components/TankSandbox/components/Lighting.tsx @@ -49,8 +49,8 @@ export function Lighting({ hasPbr }: Props) { const revealed = Tankopedia.use((state) => state.revealed); const skinPending = Tankopedia.use( (state) => - state.loadedSkin !== state.skin || - state.loadedAttachment !== state.attachment, + state.loaders.skin.requested !== state.loaders.skin.loaded || + state.loaders.attachment.requested !== state.loaders.attachment.loaded, ); const animationTime = useRef(REVEAL_ANIMATION_TIME); @@ -65,6 +65,7 @@ export function Lighting({ hasPbr }: Props) { useEffect(() => { Tankopedia.mutate((draft) => { draft.revealed = true; + draft.loaders.model.loaded = true; }); }, []); @@ -246,17 +247,6 @@ function Animator({ draft.display = requestedDisplay; }); } - - if ( - x >= 1 && - (Tankopedia.state.skin !== Tankopedia.state.loadedSkin || - Tankopedia.state.attachment !== Tankopedia.state.loadedAttachment) - ) { - Tankopedia.mutate((draft) => { - draft.skin = draft.loadedSkin; - draft.attachment = draft.loadedAttachment; - }); - } }); return null; diff --git a/packages/website/src/components/Tankopedia/HeroSection/index.tsx b/packages/website/src/components/Tankopedia/HeroSection/index.tsx index 51205fb49..0e15e8974 100644 --- a/packages/website/src/components/Tankopedia/HeroSection/index.tsx +++ b/packages/website/src/components/Tankopedia/HeroSection/index.tsx @@ -20,7 +20,9 @@ export function HeroSection({ skeleton }: MaybeSkeletonComponentProps) { const canvas = useRef(null!); const isFullScreen = useFullScreen(); const protagonist = Duel.use((state) => state.protagonist.tank); - const modelRequested = Tankopedia.use((state) => state.modelRequested); + const modelRequested = Tankopedia.use( + (state) => state.loaders.model.requested, + ); const thicknessRange = useMemo(() => { const entries = Object.values(tankDefinitions.tanks); const filtered = entries.filter( diff --git a/packages/website/src/hooks/useSkin.ts b/packages/website/src/hooks/useSkin.ts index 93a6a0811..d7421795c 100644 --- a/packages/website/src/hooks/useSkin.ts +++ b/packages/website/src/hooks/useSkin.ts @@ -35,36 +35,28 @@ function skinPath(id: number, skin: number) { } // attachments load the same way as camouflages and can be shown with one -const slots = { - skin: { requested: "requestedSkin", loaded: "loadedSkin" }, - attachment: { requested: "requestedAttachment", loaded: "loadedAttachment" }, -} as const; - -export function useSkin(id: number, slot: keyof typeof slots = "skin") { - const { requested, loaded } = slots[slot]; - const requestedSkin = Tankopedia.use((state) => state[requested]); - const skin = Tankopedia.use((state) => state[slot]); +export function useSkin(id: number, loader: "skin" | "attachment" = "skin") { + const requested = Tankopedia.use((state) => state.loaders[loader].requested); + const loaded = Tankopedia.use((state) => state.loaders[loader].loaded); useEffect(() => { - const path = - requestedSkin === undefined ? undefined : skinPath(id, requestedSkin); + if (requested === Tankopedia.state.loaders[loader].loaded) return; + + const path = requested === undefined ? undefined : skinPath(id, requested); + const cached = path === undefined || loadedSkins.has(path); let settled = false; - if (path === undefined || loadedSkins.has(path)) { + if (!cached) { Tankopedia.mutate((draft) => { - draft[loaded] = requestedSkin; + draft.revealed = false; }); - return; + + if (!skins.has(path)) skins.set(path, loadSkin(path)); } - Tankopedia.mutate((draft) => { - draft.revealed = false; - }); - - if (!skins.has(path)) skins.set(path, loadSkin(path)); - + // swaps halfway through the lighting transition Promise.all([ - skins.get(path), + path && skins.get(path), new Promise((resolve) => setTimeout(resolve, TRANSITION_ANIMATION_TIME * 1e3), ), @@ -73,9 +65,8 @@ export function useSkin(id: number, slot: keyof typeof slots = "skin") { settled = true; Tankopedia.mutate((draft) => { - draft[loaded] = requestedSkin; - draft[slot] = requestedSkin; - draft.revealed = true; + draft.loaders[loader].loaded = requested; + if (!cached) draft.revealed = true; }); }); @@ -83,11 +74,16 @@ export function useSkin(id: number, slot: keyof typeof slots = "skin") { if (settled) return; settled = true; + + if (cached) return; + Tankopedia.mutate((draft) => { draft.revealed = true; }); }; - }, [id, slot, requestedSkin]); + }, [id, loader, requested]); - return skin === undefined ? undefined : loadedSkins.get(skinPath(id, skin)); + return loaded === undefined + ? undefined + : loadedSkins.get(skinPath(id, loaded)); } diff --git a/packages/website/src/stores/tankopedia.ts b/packages/website/src/stores/tankopedia.ts index 3beaaffd6..a3723796c 100644 --- a/packages/website/src/stores/tankopedia.ts +++ b/packages/website/src/stores/tankopedia.ts @@ -78,10 +78,19 @@ export enum TankopediaRelativeAgainst { All, } +interface LoaderState { + requested: Type; + loaded: Type; +} + interface Tankopedia { disturbed: boolean; revealed: boolean; - modelRequested: boolean; + loaders: { + model: LoaderState; + skin: LoaderState; + attachment: LoaderState; + }; shot?: Shot; skills: Record; relativeAgainst: TankopediaRelativeAgainst; @@ -103,12 +112,6 @@ interface Tankopedia { ); xpMultiplier: (typeof XP_MULTIPLIERS)[number]; customShell?: ShellDefinition; - requestedSkin?: number; - loadedSkin?: number; - skin?: number; - requestedAttachment?: number; - loadedAttachment?: number; - attachment?: number; requestedDisplay: TankopediaDisplay; display: TankopediaDisplay; statSearch?: string; @@ -119,7 +122,11 @@ const skillDefinitions = await api.skillDefinitions(); export const Tankopedia = new Varuna((model) => ({ disturbed: false, revealed: false, - modelRequested: App.state.autoLoadModels, + loaders: { + model: { requested: App.state.autoLoadModels, loaded: false }, + skin: { requested: undefined, loaded: undefined }, + attachment: { requested: undefined, loaded: undefined }, + }, relativeAgainst: TankopediaRelativeAgainst.Class, editStatic: false, skills: createDefaultSkills(skillDefinitions), From c535811c1d2a06932e1bde364d9e0d958cd15e59 Mon Sep 17 00:00:00 2001 From: Mark Greene Date: Fri, 30 Oct 2026 17:26:50 +1300 Subject: [PATCH 7/9] Fix: Fade glowing camouflage parts with the lights Unlit `Textured` materials loaded as `MeshBasicMaterial`, so they stayed bright while the lights receded during a camouflage switch (E 100 legendary camouflage). - `Textured` materials now export as standard materials with the base color texture as emissive and a black base color, so they look the same as before. - The Tankopedia model fades their emissive intensity with the lighting transition. - Additive blending applies to these parts again, since they are standard materials. --- .../TankSandbox/components/TankModel.tsx | 38 ++++++++++++++++++- .../[...chunk_models_tanks]/[id]/model.glb.ts | 11 +++--- 2 files changed, 43 insertions(+), 6 deletions(-) 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 88ac06c6e..718ca7bbd 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 @@ -1,5 +1,6 @@ import { invalidate, useThree, type ThreeEvent } from "@react-three/fiber"; -import { useRef } from "react"; +import type { QuicklimeEvent } from "quicklime"; +import { useEffect, useRef } from "react"; import { Group, Mesh, MeshStandardMaterial, Vector2 } from "three"; import { applyPitchYawLimits } from "../../../../../../core/blitz/applyPitchYawLimits"; import { hasEquipment } from "../../../../../../core/blitzkit/hasEquipment"; @@ -14,6 +15,7 @@ import { Duel } from "../../../../../../stores/duel"; import { Tankopedia } from "../../../../../../stores/tankopedia"; import { TankopediaDisplay } from "../../../../../../stores/tankopediaPersistent/constants"; import { ModelTankWrapper } from "../../../../../Armor/components/ModelTankWrapper"; +import { transitionEvent } from "./Lighting"; export function TankModel() { const protagonist = Duel.use((draft) => draft.protagonist); @@ -35,6 +37,40 @@ export function TankModel() { useTankTransform(track, turret, turretContainer, gunContainer); + useEffect(() => { + const emissiveMaterials = new Set(); + + for (const scene of [gltf.scene, ...skins.map((skin) => skin.scene)]) { + scene.traverse((object) => { + if ( + object instanceof Mesh && + object.material instanceof MeshStandardMaterial && + object.material.emissiveMap + ) { + emissiveMaterials.add(object.material); + } + }); + } + + // emissive parts fade with the lights instead of glowing in the dark + function applyIntensity(intensity: number) { + for (const material of emissiveMaterials) { + material.emissiveIntensity = intensity; + } + } + + function handleTransitionEvent(event: QuicklimeEvent) { + applyIntensity(event.data); + } + + applyIntensity(transitionEvent.last!); + transitionEvent.on(handleTransitionEvent); + + return () => { + transitionEvent.off(handleTransitionEvent); + }; + }, [gltf, skinGltf, attachmentGltf]); + return ( {nodes.map((node) => { diff --git a/packages/website/src/pages/[...chunk_models_tanks]/[id]/model.glb.ts b/packages/website/src/pages/[...chunk_models_tanks]/[id]/model.glb.ts index 771655ba0..d0b9d70ef 100644 --- a/packages/website/src/pages/[...chunk_models_tanks]/[id]/model.glb.ts +++ b/packages/website/src/pages/[...chunk_models_tanks]/[id]/model.glb.ts @@ -14,7 +14,7 @@ import { } from "@blitzkit/core"; import type { AbstractVFS } from "@blitzkit/core/src/blitzkit/vfs/abstract"; import { Document, Material, Node, NodeIO, Scene } from "@gltf-transform/core"; -import { ALL_EXTENSIONS, KHRMaterialsUnlit } from "@gltf-transform/extensions"; +import { ALL_EXTENSIONS } from "@gltf-transform/extensions"; import { dedup, prune } from "@gltf-transform/functions"; import type { APIContext } from "astro"; import { isEqual, times } from "lodash-es"; @@ -366,10 +366,11 @@ export async function extractMaterials( } if (fxName?.endsWith("/Textured.material")) { - material.setExtension( - "KHR_materials_unlit", - document.createExtension(KHRMaterialsUnlit).createUnlit(), - ); + // unlit in game, emissive so the viewer can fade it with the lights + material + .setEmissiveTexture(material.getBaseColorTexture()) + .setEmissiveFactor([1, 1, 1]) + .setBaseColorFactor([0, 0, 0, 1]); } if (textures.miscMap) { From e216b4cd6becdd33197ccc04925739432a6d588f Mon Sep 17 00:00:00 2001 From: tresabhi <43380238+tresabhi@users.noreply.github.com> Date: Fri, 30 Oct 2026 16:49:43 -0500 Subject: [PATCH 8/9] fix 1 pixel lights --- .../components/TankSandbox/components/Lighting.tsx | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/packages/website/src/components/Tankopedia/HeroSection/components/TankSandbox/components/Lighting.tsx b/packages/website/src/components/Tankopedia/HeroSection/components/TankSandbox/components/Lighting.tsx index 8ce7701ca..4acaa5669 100644 --- a/packages/website/src/components/Tankopedia/HeroSection/components/TankSandbox/components/Lighting.tsx +++ b/packages/website/src/components/Tankopedia/HeroSection/components/TankSandbox/components/Lighting.tsx @@ -165,6 +165,7 @@ export function Lighting({ hasPbr }: Props) { key={index} position={position} intensity={intensity} + userData={{ intensity }} penumbra={1} castShadow={highGraphics} decay={1} @@ -215,6 +216,11 @@ function Animator({ for (const child of wrapper.current.children) { if (child instanceof SpotLight) { child.angle = ANGLE * t * factor; + child.intensity = child.userData.intensity; + + if (child.angle === 0) { + child.intensity = 0; + } } else if (child instanceof HemisphereLight) { child.intensity = HEMISPHERE_INTENSITY * t * factor; } From 8028446788fdfd80f4e2ed823dc62f29d3a869ef Mon Sep 17 00:00:00 2001 From: tresabhi <43380238+tresabhi@users.noreply.github.com> Date: Fri, 30 Oct 2026 16:59:31 -0500 Subject: [PATCH 9/9] fall back to github.token for pr runs --- .github/workflows/website.yaml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.github/workflows/website.yaml b/.github/workflows/website.yaml index dba93a9d8..1cb3ea769 100644 --- a/.github/workflows/website.yaml +++ b/.github/workflows/website.yaml @@ -110,7 +110,7 @@ jobs: # the PR's ref, or the manual input, or production (selected when cron) ref: ${{ github.event.pull_request.head.sha || inputs.branch || 'production' }} submodules: recursive - token: ${{ secrets.GH_TOKEN }} + token: ${{ secrets.GH_TOKEN || github.token }} - name: Setup bun uses: oven-sh/setup-bun@v2