Allow fx files in addons (#16662)

Author: sebavan

.gitignore

@@ -19,6 +19,9 @@ src/[Ss]haders/**/*.ts
 *.compute.ts
 **/ShadersInclude/**/*.ts
 shaders/**/*.ts
+**/[Ss]haders/**/*.ts
+**/[Ss]hadersInclude/**/*.ts
+**/[Ss]hadersWGSL/**/*.ts
 jest-screenshot-report/
 junit.xml
 .env

.vscode/settings.json

@@ -8,6 +8,7 @@
         "**/packages/dev/**/Shaders/**/*.ts": true,
         "**/packages/dev/**/shaders/**/*.ts": true,
         "**/packages/dev/**/ShadersWGSL/**/*.ts": true,
+        "**/packages/dev/**/shadersWGSL/**/*.ts": true,
         "**/*.fragment.ts": true,
         "**/*.vertex.ts": true,
         "**/*.compute.ts": true

packages/dev/addons/src/msdfText/index.ts

@@ -3,5 +3,7 @@ export * from "./fontAsset";
 export * from "./paragraphOptions";
 export * from "./textRenderer";
 export * from "./sdf/index";
-export * from "./webgl/index";
-export * from "./webgpu/index";
+export * from "./shaders/msdf.vertex";
+export * from "./shaders/msdf.fragment";
+export * from "./shadersWGSL/msdf.vertex";
+export * from "./shadersWGSL/msdf.fragment";

packages/dev/addons/src/msdfText/webgl/fragment.ts renamed to packages/dev/addons/src/msdfText/shaders/msdf.fragment.fx

@@ -1,6 +1,3 @@
-/* eslint-disable @typescript-eslint/naming-convention */
-const name = "msdfFragmentShader";
-const shader = `
 #extension GL_OES_standard_derivatives : enable
 
 precision highp float;
@@ -37,7 +34,4 @@ void main(void)
     vec4 strokedFragColor = vec4(uStrokeColor.rgb, border * uStrokeColor.a);
 
     gl_FragColor = mix(filledFragColor, strokedFragColor, border);
-}`;
-
-/** @internal */
-export const msdfFragmentShader = { name, shader };
+}

packages/dev/addons/src/msdfText/webgl/vertex.ts renamed to packages/dev/addons/src/msdfText/shaders/msdf.vertex.fx

@@ -1,6 +1,3 @@
-/* eslint-disable @typescript-eslint/naming-convention */
-const name = "msdfVertexShader";
-const shader = `
 #define BILLBOARD 1
 #define BILLBOARDSCREENPROJECTED 2
 
@@ -37,7 +34,4 @@ void main(void) {
         gl_Position = projection * vec4(viewPos,1.0); 
     }
     atlasUV = vec2(uvs.x + offsets.x * uvs.z, uvs.y + (1.0 - offsets.y) * uvs.w);
-}`;
-
-/** @internal */
-export const msdfVertexShader = { name, shader };
+}

packages/dev/addons/src/msdfText/webgpu/fragment.ts renamed to packages/dev/addons/src/msdfText/shadersWGSL/msdf.fragment.fx

@@ -1,6 +1,3 @@
-/* eslint-disable @typescript-eslint/naming-convention */
-const name = "msdfFragmentShaderWGSL";
-const shader = `
 var fontAtlas: texture_2d<f32>;
 var fontAtlasSampler: sampler;
 uniform uColor: vec4f;
@@ -40,7 +37,4 @@ fn main(input: FragmentInputs) -> FragmentOutputs {
     let strokedFragColor = vec4<f32>(uniforms.uStrokeColor.rgb, border * uniforms.uStrokeColor.a);
 
     fragmentOutputs.color = mix(filledFragColor, strokedFragColor, border);
-}`;
-
-/** @internal */
-export const msdfFragmentShaderWGSL = { name, shader };
+}

packages/dev/addons/src/msdfText/webgpu/vertex.ts renamed to packages/dev/addons/src/msdfText/shadersWGSL/msdf.vertex.fx

@@ -1,6 +1,3 @@
-/* eslint-disable @typescript-eslint/naming-convention */
-const name = "msdfVertexShaderWGSL";
-const shader = `
 #define BILLBOARD 1
 #define BILLBOARDSCREENPROJECTED 2
 
@@ -40,7 +37,4 @@ fn main(input: VertexInputs) -> FragmentInputs {
         input.uvs.x + input.offsets.x * input.uvs.z,
         input.uvs.y + (1.0 - input.offsets.y) * input.uvs.w
     );
-}`;
-
-/** @internal */
-export const msdfVertexShaderWGSL = { name, shader };
+}

packages/dev/addons/src/msdfText/textRenderer.ts

@@ -384,11 +384,11 @@ export class TextRenderer implements IDisposable {
         let fragment: string = "";
         if (engine.isWebGPU) {
             shaderLanguage = ShaderLanguage.WGSL;
-            vertex = (await import("./webgpu/vertex")).msdfVertexShaderWGSL.shader;
-            fragment = (await import("./webgpu/fragment")).msdfFragmentShaderWGSL.shader;
+            vertex = (await import("./shadersWGSL/msdf.vertex")).msdfVertexShaderWGSL.shader;
+            fragment = (await import("./shadersWGSL/msdf.fragment")).msdfPixelShaderWGSL.shader;
         } else {
-            vertex = (await import("./webgl/vertex")).msdfVertexShader.shader;
-            fragment = (await import("./webgl/fragment")).msdfFragmentShader.shader;
+            vertex = (await import("./shaders/msdf.vertex")).msdfVertexShader.shader;
+            fragment = (await import("./shaders/msdf.fragment")).msdfPixelShader.shader;
         }
 
         const textRenderer = new TextRenderer(engine, shaderLanguage, font);