Merge pull request #20005 from J-Rojas/fix-19959

ShaderMaterial: Introduce glslVersion property.

src/constants.d.ts

@@ -365,3 +365,6 @@ export const StreamReadUsage: Usage;
 export const StaticCopyUsage: Usage;
 export const DynamicCopyUsage: Usage;
 export const StreamCopyUsage: Usage;
+
+export const GLSL1: string;
+export const GLSL3: string;

src/constants.js

@@ -195,3 +195,6 @@ export const StreamReadUsage = 35041;
 export const StaticCopyUsage = 35046;
 export const DynamicCopyUsage = 35050;
 export const StreamCopyUsage = 35042;
+
+export const GLSL1 = "100";
+export const GLSL3 = "300 es";

src/materials/ShaderMaterial.d.ts

@@ -29,6 +29,7 @@ export interface ShaderMaterialParameters extends MaterialParameters {
 		drawBuffers?: boolean;
 		shaderTextureLOD?: boolean;
 	};
+	glslVersion?: string;
 }
 
 export class ShaderMaterial extends Material {
@@ -125,6 +126,7 @@ export class ShaderMaterial extends Material {
 	 * @default false
 	 */
 	uniformsNeedUpdate: boolean;
+	glslVersion: string;
 
 	setValues( parameters: ShaderMaterialParameters ): void;
 	toJSON( meta: any ): any;

src/materials/ShaderMaterial.js

@@ -66,6 +66,8 @@ function ShaderMaterial( parameters ) {
 	this.index0AttributeName = undefined;
 	this.uniformsNeedUpdate = false;
 
+	this.glslVersion = null;
+
 	if ( parameters !== undefined ) {
 
 		if ( parameters.attributes !== undefined ) {
@@ -109,6 +111,8 @@ ShaderMaterial.prototype.copy = function ( source ) {
 
 	this.extensions = Object.assign( {}, source.extensions );
 
+	this.glslVersion = source.glslVersion;
+
 	return this;
 
 };
@@ -117,6 +121,7 @@ ShaderMaterial.prototype.toJSON = function ( meta ) {
 
 	const data = Material.prototype.toJSON.call( this, meta );
 
+	data.glslVersion = this.glslVersion;
 	data.uniforms = {};
 
 	for ( const name in this.uniforms ) {

src/renderers/webgl/WebGLProgram.js

@@ -399,6 +399,7 @@ function WebGLProgram( renderer, cacheKey, parameters, bindingStates ) {
 	const program = gl.createProgram();
 
 	let prefixVertex, prefixFragment;
+	let versionString = parameters.glslVersion ? '#version ' + parameters.glslVersion + "\n" : '';
 
 	if ( parameters.isRawShaderMaterial ) {
 
@@ -666,19 +667,21 @@ function WebGLProgram( renderer, cacheKey, parameters, bindingStates ) {
 	vertexShader = unrollLoops( vertexShader );
 	fragmentShader = unrollLoops( fragmentShader );
 
-	if ( parameters.isWebGL2 && ! parameters.isRawShaderMaterial ) {
+	if ( ( parameters.glslVersion === null || parameters.glslVersion === undefined ) &&
+	       parameters.isWebGL2 && ! parameters.isRawShaderMaterial ) {
 
-		// GLSL 3.0 conversion
+		// Automated GLSL 3.0 conversion. The shader chunks of standard shaders (eg MeshStandardMaterial) require GLSL 3.0 features within WebGL2.
+		// Apply these conversions if no glslVersion is specified.
+
+		versionString = '#version 300 es\n';
 
 		prefixVertex = [
-			'#version 300 es\n',
 			'#define attribute in',
 			'#define varying out',
 			'#define texture2D texture'
 		].join( '\n' ) + '\n' + prefixVertex;
 
 		prefixFragment = [
-			'#version 300 es\n',
 			'#define varying in',
 			'out highp vec4 pc_fragColor;',
 			'#define gl_FragColor pc_fragColor',
@@ -696,8 +699,8 @@ function WebGLProgram( renderer, cacheKey, parameters, bindingStates ) {
 
 	}
 
-	const vertexGlsl = prefixVertex + vertexShader;
-	const fragmentGlsl = prefixFragment + fragmentShader;
+	const vertexGlsl = versionString + prefixVertex + vertexShader;
+	const fragmentGlsl = versionString + prefixFragment + fragmentShader;
 
 	// console.log( '*VERTEX*', vertexGlsl );
 	// console.log( '*FRAGMENT*', fragmentGlsl );

src/renderers/webgl/WebGLPrograms.js

@@ -270,7 +270,9 @@ function WebGLPrograms( renderer, cubemaps, extensions, capabilities, bindingSta
 			rendererExtensionDrawBuffers: isWebGL2 || extensions.get( 'WEBGL_draw_buffers' ) !== null,
 			rendererExtensionShaderTextureLod: isWebGL2 || extensions.get( 'EXT_shader_texture_lod' ) !== null,
 
-			customProgramCacheKey: material.customProgramCacheKey()
+			customProgramCacheKey: material.customProgramCacheKey(),
+
+			glslVersion: material.glslVersion
 
 		};