NfsMW: Fix WebGPU and rewrite shader (#720)

src/NeedForSpeedMostWanted/particles.ts

@@ -3,7 +3,7 @@ import { makeStaticDataBuffer } from "../gfx/helpers/BufferHelpers.js";
 import { fillMatrix4x3, fillVec4, fillVec4v } from "../gfx/helpers/UniformBufferHelpers.js";
 import {  GfxBufferUsage,GfxDevice, GfxFormat, GfxIndexBufferDescriptor, GfxInputLayoutBufferDescriptor, GfxVertexAttributeDescriptor, GfxVertexBufferDescriptor, GfxVertexBufferFrequency } from "../gfx/platform/GfxPlatform.js";
 import { GfxBuffer, GfxInputLayout } from "../gfx/platform/GfxPlatformImpl.js";
-import { GfxRenderInstList, GfxRenderInstManager } from "../gfx/render/GfxRenderInstManager.js";
+import { GfxRenderInstList, GfxRenderInstManager, setSortKeyDepth } from "../gfx/render/GfxRenderInstManager.js";
 import { CalcBillboardFlags, calcBillboardMatrix, lerp, transformVec3Mat4w1 } from "../MathHelpers.js";
 import { DeviceProgram } from "../Program.js";
 import { assert } from "../util.js";
@@ -12,6 +12,7 @@ import { NfsMap } from "./map.js";
 import { NfsTexture } from "./region.js";
 import { attachmentStatesAdditive, attachmentStatesTranslucent } from "./render.js";
 import { GfxRenderCache } from "../gfx/render/GfxRenderCache.js";
+import { computeViewSpaceDepthFromWorldSpacePoint } from "../Camera.js";
 
 export class NfsParticleEmitterGroup {
     private children: NfsParticleEmitter[];
@@ -21,7 +22,12 @@ export class NfsParticleEmitterGroup {
     }
 
     public prepareToRender(renderInstManager: GfxRenderInstManager, renderInstList: GfxRenderInstList, viewerInput: ViewerRenderInput) {
+        const template = renderInstManager.pushTemplate();
+        const pos: vec3 = [this.transformationMatrix[12], this.transformationMatrix[13], this.transformationMatrix[14]];
+        const depth = computeViewSpaceDepthFromWorldSpacePoint(viewerInput.camera.viewMatrix, pos);
+        template.sortKey = setSortKeyDepth(template.sortKey, depth);
         this.children.forEach(e => e.prepareToRender(renderInstManager, renderInstList, viewerInput));
+        renderInstManager.popTemplate();
     }
 }
 
@@ -227,18 +233,19 @@ export class NfsParticleProgram extends DeviceProgram {
     public static ub_ObjectParams = 1;
 
     public override both = `
+layout(std140) uniform ub_SceneParams {
+    Mat4x4 u_ViewProjMat;
+};
 
-    layout(std140) uniform ub_SceneParams {
-        Mat4x4 u_ViewProjMat;
-    };
+layout(std140) uniform ub_ObjectParams {
+    Mat4x3 u_ObjectViewMat;
+    vec4 u_Color;
+    float u_Frame;
+    float u_Size;
+};
 
-    layout(std140) uniform ub_ObjectParams {
-        Mat4x3 u_ObjectViewMat;
-        vec4 u_Color;
-        float u_Frame;
-        float u_Size;
-    };
-    `;
+uniform sampler2D u_Texture;
+`;
 
     public override vert = `
 layout(location = ${NfsParticleProgram.a_Position}) in vec3 a_Position;
@@ -255,19 +262,16 @@ void main() {
     texCoord.y = 1.0 - texCoord.y;
     v_TexCoord = texCoord / u_Size + (1.0 / u_Size) * vec2(constX, constY);
 }
-    `;
-
+`;
     public override frag = `
-uniform sampler2D u_Texture;
 
 in vec2 v_TexCoord;
 
 void main() {
     gl_FragColor = (texture(SAMPLER_2D(u_Texture), v_TexCoord) * u_Color).rgba;
     gl_FragColor.a *= 2.0;
 }
-    `;
-
+`;
 }
 
 type NfsParticleEmitterType = {

src/NeedForSpeedMostWanted/postprocess.ts

@@ -78,7 +78,7 @@ export class NfsPostProcessing {
         renderInst.setDrawCount(3);
 
         builder.pushPass((pass) => {
-            pass.setDebugName('Downsample');
+            pass.setDebugName('Downsample Luminance');
             pass.attachRenderTargetID(GfxrAttachmentSlot.Color0, downsampleColorID);
             const resolvedTexId = builder.resolveRenderTarget(mainColorTargetID);
             pass.attachResolveTexture(resolvedTexId),
@@ -154,7 +154,7 @@ layout(std140) uniform ub_PostProcParams {
 };
 
 uniform sampler2D u_MainColor;
-uniform sampler2D u_Blur;
+uniform sampler2D u_BlurredLuminance;
 uniform sampler2D u_Vignette;
 `;
 
@@ -170,16 +170,30 @@ uniform sampler2D u_Vignette;
 
 in vec2 v_TexCoord;
 
+float getSpline(float p0, float p1, float p2, float p3, float t) {
+    float t2 = t * t;
+    float t3 = t2 * t;
+    float invT = 1.0 - t;
+    float invT2 = invT * invT;
+    float invT3 = invT2 * invT;
+    return p0 * invT3 + 3.0 * p1 * invT2 * t + 3.0 * p2 * invT * t2 + p3 * t3;
+}
+
 void main() {
+    vec3 mainCol = texture(SAMPLER_2D(u_MainColor), v_TexCoord).rgb;
+    vec3 tintedColor = mainCol * mix(ColourBloomTintWhite, ColourBloomTint, ub_TintIntensity);
+
+    float luminance = dot(mainCol, LuminanceVector);
+    vec3 desatured = Desaturation * luminance + (1.0 - Desaturation) * mainCol;
+
+    float blurredLuminance = texture(SAMPLER_2D(u_BlurredLuminance), v_TexCoord).r;
+    float blackBloom = BlackBloomIntensity.y + BlackBloomIntensity.x * getSpline(0.0, 0.1724138, 1.12069, 1.0, blurredLuminance);
+    float colorBloom = ColourBloomIntensity * getSpline(0.2, 0.5, 0.5862069, 0.4655172, blurredLuminance);
+
+    vec3 finalColor = tintedColor * colorBloom + desatured * blackBloom;
     float vignette = texture(SAMPLER_2D(u_Vignette), vec2(v_TexCoord.x, 1.0 - v_TexCoord.y)).r;
-    vec4 mainCol = texture(SAMPLER_2D(u_MainColor), v_TexCoord);
-    vec3 desatured = Desaturation * (mainCol.rgb + dot(mainCol.rgb, LuminanceVector));
-    float blurLuminance = texture(SAMPLER_2D(u_Blur), v_TexCoord).x;
-    float blackBloom = blurLuminance * BlackBloomIntensity.x + BlackBloomIntensity.y;
-    vec3 tint = mix(ColourBloomTintWhite, ColourBloomTint, ub_TintIntensity);
-    vec3 colorBloom = mix(0.2, 0.4625, blurLuminance) * ColourBloomIntensity * tint;
-    vec3 finalColor = mainCol.rgb * colorBloom + desatured * blackBloom;
-    gl_FragColor = vec4(finalColor * vignette, 1.0);
+    gl_FragColor.rgb = finalColor * vignette;
+    gl_FragColor.a = 1.0;
 }
     `;
 }