feat(dashboard): metal and glow looks in the UGC and zone 3D views

NifFile::ShaderLookFor knows Polished Metal (98), Brushed Steel (99) and
LEGO-Emissive (53). The UGC mesh route sends each mesh's look (from its
multishader tag), and the UGC 3D view draws metal as reflective and glow
unlit. The zone views draw LEGO-Emissive objects going to their vertex
color by its alpha, as the shader does.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
Aaron Kimbrell
2026-09-28 09:55:00 -05:00
parent b34e8cb254
commit bc9ffeefaf
10 changed files with 130 additions and 21 deletions

View File

@@ -867,6 +867,16 @@ namespace Scenery {
return zone->json;
}
std::vector<uint16_t> MultishaderLooks(const NifFile::Model& model) {
std::vector<uint16_t> looks;
for (const auto& mesh : model.meshes) {
std::optional<int32_t> shader;
if (const auto it = g_ShaderValues.find(mesh.material.shaderTag); it != g_ShaderValues.end()) shader = it->second;
looks.push_back(NifFile::ShaderLookFor(NifFile::MultishaderPart(shader)));
}
return looks;
}
bool ZoneReady(uint32_t zoneId) {
return g_Zones.Ready(zoneId);
}

View File

@@ -3,6 +3,7 @@
#include <cstdint>
#include <optional>
#include <string>
#include <vector>
struct HTTPReply;
struct HTTPContext;
@@ -11,6 +12,10 @@ namespace WorldScene {
struct Object;
}
namespace NifFile {
struct Model;
}
/**
* A zone's scenery for the 3D views, drawn from the game client's files the way the client draws it: every object in
* the zone's scene files (.lvl) with the model of its render component (RenderComponent.render_asset, a .nif or a
@@ -46,6 +51,13 @@ namespace Scenery {
// Whether ZoneJson is built (so answering it is quick)
bool ZoneReady(uint32_t zoneId);
/**
* The eShaderLook bits (NifFile::ShaderLookFor) of each mesh of a multishader model (a player model: RenderComponent
* shader Multishader), from its parts' tags (mapShaders ids, read by Preload); for NifFile::Encode's `looks`.
* Any thread.
*/
std::vector<uint16_t> MultishaderLooks(const NifFile::Model& model);
/**
* The zone's flairs (the grass, flowers and small rocks its terrain file strews over it, models from FlairTable) as a
* manifest in ZoneJson's form, whose models the same mesh and texture routes serve, plus: distance (how far from the

View File

@@ -11,6 +11,7 @@
#include "Database.h"
#include "UgcIconParams.h"
#include "NifFile.h"
#include "Scenery.h"
#include "SettingsCatalog.h"
#include "SettingsHistory.h"
#include "UgcAssemblies.h"
@@ -477,7 +478,7 @@ namespace UgcRoutes {
});
Route(eHTTPMethod::GET, "/api/ugc/mesh/:id", Perm("properties_view"),
"A player model's generated .nif converted for the 3D view (NifFile::Encode, as the scenery meshes). Query: ?lod=0 (most detailed) "
"A player model's generated .nif converted for the 3D view (NifFile::Encode, as the scenery meshes, with each mesh's shader look). Query: ?lod=0 (most detailed) "
"to 3, &version=current|previous, &ao=0 for the mesh before the lighting bake. The header adds triangles and vertices",
[](HTTPReply& reply, const HTTPContext& context) {
const auto id = PathId<LWOOBJID>(context.path, 3);
@@ -495,7 +496,7 @@ namespace UgcRoutes {
if (!model) return JsonError(out, eHTTPStatusCode::UNPROCESSABLE_ENTITY, "The .nif can't be read: " + error);
out.status = eHTTPStatusCode::OK;
out.contentType = eContentType::APPLICATION_OCTET_STREAM;
out.message = NifFile::Encode(*model, std::vector<std::string>(model->meshes.size()));
out.message = NifFile::Encode(*model, std::vector<std::string>(model->meshes.size()), {}, Scenery::MultishaderLooks(*model));
out.headers.push_back("Cache-Control: private, no-cache");
});
});

View File

@@ -67,13 +67,16 @@ export function shaderOf(manifest, asset, mesh) {
}
// NifFile::eShaderLook bits
export const SHADER_LOOK = { UNLIT: 1, NO_TEXTURE: 2, NO_VERTEX_COLORS: 4, MATERIAL_COLOR: 8, TWO_LAYERS_BLENDED: 16, TWO_LAYERS_ADDED: 32 };
export const SHADER_LOOK = { UNLIT: 1, NO_TEXTURE: 2, NO_VERTEX_COLORS: 4, MATERIAL_COLOR: 8, TWO_LAYERS_BLENDED: 16, TWO_LAYERS_ADDED: 32, REFLECTIVE: 64, BRUSHED: 128, EMISSIVE: 256 };
/**
* How a mesh is drawn under the game's shaders, when the manifest has the zone's lighting: {lit, texture,
* vertexColors, material, layers} — whether the scene's sun and ambient light it, its texture and vertex colors are
* used, whether its NiMaterialProperty colors are (only fixed function and the "Material" shaders use them), and how
* a two layer shader puts its dark texture with the base one ('blended', 'added' or null). Null without
* a two layer shader puts its dark texture with the base one ('blended', 'added' or null), whether it is metal
* ('polished', 'brushed' or null: an environment reflection tinted by the vertex color) and whether it glows
* (LEGO-Emissive: the lit color goes to the vertex color by the vertex alpha times the material's emissive red, so
* the vertex alpha is no opacity). Null without
* lighting in the manifest (older servers), for the viewer's own lights.
*/
export function gameLook(manifest, asset, mesh) {
@@ -87,10 +90,18 @@ export function gameLook(manifest, asset, mesh) {
// Fixed function reads them as NiVertexColorProperty says; the shaders always do, unless they have none
vertexColors: !!(mesh.colors && !(bits & SHADER_LOOK.NO_VERTEX_COLORS) && (!fixedFunction || mesh.vertexColors !== 0)),
material: fixedFunction || !!(bits & SHADER_LOOK.MATERIAL_COLOR),
layers: bits & SHADER_LOOK.TWO_LAYERS_BLENDED ? 'blended' : bits & SHADER_LOOK.TWO_LAYERS_ADDED ? 'added' : null
layers: bits & SHADER_LOOK.TWO_LAYERS_BLENDED ? 'blended' : bits & SHADER_LOOK.TWO_LAYERS_ADDED ? 'added' : null,
metal: metalOf(bits),
emissive: !!(bits & SHADER_LOOK.EMISSIVE)
};
}
// A shader's metal from its eShaderLook bits: 'polished', 'brushed' or null
export function metalOf(bits) {
if (!(bits & SHADER_LOOK.REFLECTIVE)) return null;
return bits & SHADER_LOOK.BRUSHED ? 'brushed' : 'polished';
}
/**
* Meshes of a model that look the same (texture, colors, blending, sides, attributes) joined into one, so a model
* made of many pieces (the zones' "glom" files have over a hundred) costs a few draw calls instead of one per piece.

View File

@@ -247,10 +247,18 @@ export function createScenery({ scene, camera, renderer, urls, focus, onProgress
gameNormal = normalize( mat3( modelMatrix ) * gameNormal );
vGameLight = pow( clamp( gameLightColor * max( 0.0, dot( gameNormal, gameLightVec ) ) + gameAmbient, 0.0, 1.0 ), vec3( 2.2 ) );`;
// LEGO-Emissive: the lit color goes to the vertex color by the vertex alpha times the material's emissive red
const EMISSIVE_FRAGMENT = `
#ifdef USE_COLOR_ALPHA
outgoingLight = mix( outgoingLight, vColor.rgb, clamp( vColor.a * emissiveMix, 0.0, 1.0 ) );
#endif
#include <opaque_fragment>`;
/**
* A material that draws a mesh the way its game shader does (gameLook): unlit by the view's own lights and tone
* mapping, the zone's sun and ambient light per vertex when the shader is lit, the material's color only when the
* shader reads it.
* shader reads it. Metal is drawn lit like the rest (the game adds a reflection of its own textures); glowing
* meshes go to their vertex color as the emissive shader does.
*/
function gameMaterial(options, mesh, alphaMode, look, darkMap = null) {
const material = new THREE.MeshBasicMaterial({
@@ -261,7 +269,12 @@ export function createScenery({ scene, camera, renderer, urls, focus, onProgress
const layers = darkMap ? look.layers : null;
// TwoLayersAdded_PS: base * material diffuse red + dark * material diffuse green (their animations)
const weights = new THREE.Vector2(mesh.diffuse[0], mesh.diffuse[1]);
const emissive = !!look.emissive;
material.onBeforeCompile = (shader) => {
if (emissive) {
shader.uniforms.emissiveMix = { value: mesh.emissive[0] };
shader.fragmentShader = 'uniform float emissiveMix;\n' + shader.fragmentShader.replace('#include <opaque_fragment>', EMISSIVE_FRAGMENT);
}
if (layers) {
shader.uniforms.darkMap = { value: darkMap };
shader.uniforms.layerWeights = { value: weights };
@@ -280,7 +293,7 @@ export function createScenery({ scene, camera, renderer, urls, focus, onProgress
shader.fragmentShader = 'varying vec3 vGameLight;\n' +
shader.fragmentShader.replace('#include <aomap_fragment>', '#include <aomap_fragment>\n\treflectedLight.indirectDiffuse *= vGameLight;');
};
material.customProgramCacheKey = () => 'game:' + (options.map ? alphaMode : '') + ':' + look.lit + ':' + layers;
material.customProgramCacheKey = () => 'game:' + (options.map ? alphaMode : '') + ':' + look.lit + ':' + layers + ':' + emissive;
return material;
}
@@ -292,7 +305,8 @@ export function createScenery({ scene, camera, renderer, urls, focus, onProgress
let vertexAlpha = false;
// A two layer blend reads the vertex alpha as the mix of its textures, not as opacity
const layersBlended = !!(darkMap && look.layers === 'blended');
if (vertexColors && !layersBlended) for (let i = 3; i < mesh.colors.length && !vertexAlpha; i += 4) vertexAlpha = mesh.colors[i] < 250;
// ... and the emissive shader as how much the vertex color glows
if (vertexColors && !layersBlended && !(look && look.emissive)) for (let i = 3; i < mesh.colors.length && !vertexAlpha; i += 4) vertexAlpha = mesh.colors[i] < 250;
const textureAlpha = alphaMode === 'opacity' && !!(map && map.userData.alpha);
// The game's shaders take alpha from the vertex colors and texture only; NiMaterialProperty's is for fixed function
const materialAlpha = look && !look.material ? 1 : mesh.alpha;

View File

@@ -1,11 +1,13 @@
/**
* A 3D view of a .nif the UGC server made, from /api/ugc/mesh/:id (the dashboard converts it with NifFile::Encode,
* as it does the scenery's models), with wireframe and vertex color switches and triangle counts.
* as it does the scenery's models), with wireframe and vertex color switches and triangle counts. The metal and glow
* groups (the UGC server's shader settings; each mesh's "look" is its shader's eShaderLook bits) are drawn as metal
* reflecting the view's environment and as unlit glow.
*/
import * as THREE from 'three';
import { OrbitControls } from 'three/addons/controls/OrbitControls.js';
import { RoomEnvironment } from 'three/addons/environments/RoomEnvironment.js';
import { parseModel, mergeMeshes, linearColors } from '/js/scenery-core.js';
import { parseModel, mergeMeshes, linearColors, metalOf, SHADER_LOOK } from '/js/scenery-core.js';
export function createNifViewer(container) {
const renderer = new THREE.WebGLRenderer({ antialias: true });
@@ -116,7 +118,13 @@ export function createNifViewer(container) {
// Blending only matters where something is see-through (every shape of a brick model blends)
let seeThrough = !!mesh.blend && mesh.alpha < 0.99;
if (mesh.blend && hasColors) for (let i = 3; i < mesh.colors.length && !seeThrough; i += 4) seeThrough = mesh.colors[i] < 250;
const material = new THREE.MeshStandardMaterial({ color: baseColor.clone(), vertexColors: hasColors, transparent: seeThrough, roughness: 0.6, metalness: 0 });
const look = mesh.look || 0;
const metal = metalOf(look);
// Glow: the emissive shader's vertex color, unlit (its vertex alpha is the glow, not opacity)
const material = look & SHADER_LOOK.EMISSIVE
? new THREE.MeshBasicMaterial({ color: baseColor.clone(), vertexColors: hasColors })
: new THREE.MeshStandardMaterial({ color: baseColor.clone(), vertexColors: hasColors, transparent: seeThrough,
roughness: metal === 'polished' ? 0.18 : metal === 'brushed' ? 0.45 : 0.6, metalness: metal ? 1 : 0 });
const object = new THREE.Mesh(geometry, material);
if (seeThrough) object.renderOrder = 1;
root.add(object);