Feature/web gl2.0

src/main.js

@@ -37,7 +37,7 @@ function gltf_rv(
 function getWebGlContext(canvas)
 {
     const parameters = { alpha: false, antialias: true };
-    const contextTypes = [ "webgl", "experimental-webgl" ];
+    const contextTypes = [ "webgl2" ];
 
     let context;
 
@@ -49,6 +49,7 @@ function getWebGlContext(canvas)
             return context;
         }
     }
+    return context;
 }
 
 export { gltf_rv };

src/renderer.js

@@ -36,17 +36,11 @@ class gltfRenderer
         this.shaderCache = new ShaderCache(shaderSources);
 
         let requiredWebglExtensions = [
-            "EXT_shader_texture_lod",
-            "OES_standard_derivatives",
-            "OES_element_index_uint",
             "EXT_texture_filter_anisotropic",
-            "OES_texture_float",
             "OES_texture_float_linear"
         ];
 
         WebGl.loadWebGlExtensions(requiredWebglExtensions);
-        // use shader lod ext if requested and supported
-        this.parameters.useShaderLoD = this.parameters.useShaderLoD && WebGl.context.getExtension("EXT_shader_texture_lod") !== null;
 
         this.visibleLights = [];
 
@@ -463,7 +457,7 @@ class gltfRenderer
             {
                 linear = false;
             }
-            
+
             gltf.envData = {};
             gltf.envData.diffuseEnvMap = new gltfTextureInfo(gltf.textures.length - 3, 0, linear);
             gltf.envData.specularEnvMap = new gltfTextureInfo(gltf.textures.length - 2, 0, linear);

src/shader_cache.js

@@ -81,7 +81,7 @@ class ShaderCache
 
         // console.log(shaderIdentifier);
 
-        let defines = "";
+        let defines = "#version 300 es\n";
         for(let define of permutationDefines)
         {
             // console.log(define);

src/shaders/animation.glsl

@@ -1,85 +1,85 @@
 #ifdef HAS_TARGET_POSITION0
-attribute vec3 a_Target_Position0;
+in vec3 a_Target_Position0;
 #endif
 
 #ifdef HAS_TARGET_POSITION1
-attribute vec3 a_Target_Position1;
+in vec3 a_Target_Position1;
 #endif
 
 #ifdef HAS_TARGET_POSITION2
-attribute vec3 a_Target_Position2;
+in vec3 a_Target_Position2;
 #endif
 
 #ifdef HAS_TARGET_POSITION3
-attribute vec3 a_Target_Position3;
+in vec3 a_Target_Position3;
 #endif
 
 #ifdef HAS_TARGET_POSITION4
-attribute vec3 a_Target_Position4;
+in vec3 a_Target_Position4;
 #endif
 
 #ifdef HAS_TARGET_POSITION5
-attribute vec3 a_Target_Position5;
+in vec3 a_Target_Position5;
 #endif
 
 #ifdef HAS_TARGET_POSITION6
-attribute vec3 a_Target_Position6;
+in vec3 a_Target_Position6;
 #endif
 
 #ifdef HAS_TARGET_POSITION7
-attribute vec3 a_Target_Position7;
+in vec3 a_Target_Position7;
 #endif
 
 #ifdef HAS_TARGET_NORMAL0
-attribute vec3 a_Target_Normal0;
+in vec3 a_Target_Normal0;
 #endif
 
 #ifdef HAS_TARGET_NORMAL1
-attribute vec3 a_Target_Normal1;
+in vec3 a_Target_Normal1;
 #endif
 
 #ifdef HAS_TARGET_NORMAL2
-attribute vec3 a_Target_Normal2;
+in vec3 a_Target_Normal2;
 #endif
 
 #ifdef HAS_TARGET_NORMAL3
-attribute vec3 a_Target_Normal3;
+in vec3 a_Target_Normal3;
 #endif
 
 #ifdef HAS_TARGET_TANGENT0
-attribute vec3 a_Target_Tangent0;
+in vec3 a_Target_Tangent0;
 #endif
 
 #ifdef HAS_TARGET_TANGENT1
-attribute vec3 a_Target_Tangent1;
+in vec3 a_Target_Tangent1;
 #endif
 
 #ifdef HAS_TARGET_TANGENT2
-attribute vec3 a_Target_Tangent2;
+in vec3 a_Target_Tangent2;
 #endif
 
 #ifdef HAS_TARGET_TANGENT3
-attribute vec3 a_Target_Tangent3;
+in vec3 a_Target_Tangent3;
 #endif
 
 #ifdef USE_MORPHING
 uniform float u_morphWeights[WEIGHT_COUNT];
 #endif
 
 #ifdef HAS_JOINT_SET1
-attribute vec4 a_Joint1;
+in vec4 a_Joint1;
 #endif
 
 #ifdef HAS_JOINT_SET2
-attribute vec4 a_Joint2;
+in vec4 a_Joint2;
 #endif
 
 #ifdef HAS_WEIGHT_SET1
-attribute vec4 a_Weight1;
+in vec4 a_Weight1;
 #endif
 
 #ifdef HAS_WEIGHT_SET2
-attribute vec4 a_Weight2;
+in vec4 a_Weight2;
 #endif
 
 #ifdef USE_SKINNING

src/shaders/functions.glsl

@@ -3,21 +3,21 @@
 const float M_PI = 3.141592653589793;
 const float c_MinReflectance = 0.04;
 
-varying vec3 v_Position;
+in vec3 v_Position;
 
 #ifdef HAS_NORMALS
 #ifdef HAS_TANGENTS
-varying mat3 v_TBN;
+in mat3 v_TBN;
 #else
-varying vec3 v_Normal;
+in vec3 v_Normal;
 #endif
 #endif
 
 #ifdef HAS_VERTEX_COLOR_VEC3
-varying vec3 v_Color;
+in vec3 v_Color;
 #endif
 #ifdef HAS_VERTEX_COLOR_VEC4
-varying vec4 v_Color;
+in vec4 v_Color;
 #endif
 
 struct AngularInfo
@@ -74,7 +74,7 @@ vec3 getNormal()
 #endif
 
 #ifdef HAS_NORMAL_MAP
-    vec3 n = texture2D(u_NormalSampler, UV).rgb;
+    vec3 n = texture(u_NormalSampler, UV).rgb;
     n = normalize(tbn * ((2.0 * n - 1.0) * vec3(u_NormalScale, u_NormalScale, 1.0)));
 #else
     // The tbn matrix is linearly interpolated, so we need to re-normalize

src/shaders/metallic-roughness.frag

@@ -1,3 +1,4 @@
+
 //
 // This fragment shader defines a reference implementation for Physically Based Shading of
 // a microfacet surface material defined by a glTF model.
@@ -12,18 +13,11 @@
 // [4] "An Inexpensive BRDF Model for Physically based Rendering" by Christophe Schlick
 //     https://www.cs.virginia.edu/~jdl/bib/appearance/analytic%20models/schlick94b.pdf
 
-#ifdef USE_TEX_LOD
-#extension GL_EXT_shader_texture_lod: enable
-#endif
 
-#extension GL_OES_standard_derivatives : enable
+precision highp float;
 
-#ifdef USE_HDR
-#extension GL_OES_texture_float : enable
-#extension GL_OES_texture_float_linear : enable
-#endif
+out vec4 g_finalColor;
 
-precision highp float;
 
 #include <tonemapping.glsl>
 #include <textures.glsl>
@@ -102,15 +96,11 @@ vec3 getIBLContribution(MaterialInfo materialInfo, vec3 n, vec3 v)
 
     vec2 brdfSamplePoint = clamp(vec2(NdotV, materialInfo.perceptualRoughness), vec2(0.0, 0.0), vec2(1.0, 1.0));
     // retrieve a scale and bias to F0. See [1], Figure 3
-    vec2 brdf = texture2D(u_brdfLUT, brdfSamplePoint).rg;
+    vec2 brdf = texture(u_brdfLUT, brdfSamplePoint).rg;
 
-    vec4 diffuseSample = textureCube(u_DiffuseEnvSampler, n);
+    vec4 diffuseSample = texture(u_DiffuseEnvSampler, n);
 
-#ifdef USE_TEX_LOD
-    vec4 specularSample = textureCubeLodEXT(u_SpecularEnvSampler, reflection, lod);
-#else
-    vec4 specularSample = textureCube(u_SpecularEnvSampler, reflection);
-#endif
+    vec4 specularSample = textureLod(u_SpecularEnvSampler, reflection, lod);
 
 #ifdef USE_HDR
     // Already linear.
@@ -259,11 +249,12 @@ void main()
     vec3 diffuseColor = vec3(0.0);
     vec3 specularColor= vec3(0.0);
     vec3 f0 = vec3(0.04);
+    vec4 output_color = baseColor;
 
 #ifdef MATERIAL_SPECULARGLOSSINESS
 
 #ifdef HAS_SPECULAR_GLOSSINESS_MAP
-    vec4 sgSample = SRGBtoLINEAR(texture2D(u_SpecularGlossinessSampler, getSpecularGlossinessUV()));
+    vec4 sgSample = SRGBtoLINEAR(texture(u_SpecularGlossinessSampler, getSpecularGlossinessUV()));
     perceptualRoughness = (1.0 - sgSample.a * u_GlossinessFactor); // glossiness to roughness
     f0 = sgSample.rgb * u_SpecularFactor; // specular
 #else
@@ -272,7 +263,7 @@ void main()
 #endif // ! HAS_SPECULAR_GLOSSINESS_MAP
 
 #ifdef HAS_DIFFUSE_MAP
-    baseColor = SRGBtoLINEAR(texture2D(u_DiffuseSampler, getDiffuseUV())) * u_DiffuseFactor;
+    baseColor = SRGBtoLINEAR(texture(u_DiffuseSampler, getDiffuseUV())) * u_DiffuseFactor;
 #else
     baseColor = u_DiffuseFactor;
 #endif // !HAS_DIFFUSE_MAP
@@ -296,7 +287,7 @@ void main()
 #ifdef HAS_METALLIC_ROUGHNESS_MAP
     // Roughness is stored in the 'g' channel, metallic is stored in the 'b' channel.
     // This layout intentionally reserves the 'r' channel for (optional) occlusion map data
-    vec4 mrSample = texture2D(u_MetallicRoughnessSampler, getMetallicRoughnessUV());
+    vec4 mrSample = texture(u_MetallicRoughnessSampler, getMetallicRoughnessUV());
     perceptualRoughness = mrSample.g * u_RoughnessFactor;
     metallic = mrSample.b * u_MetallicFactor;
 #else
@@ -306,7 +297,7 @@ void main()
 
     // The albedo may be defined from a base texture or a flat color
 #ifdef HAS_BASE_COLOR_MAP
-    baseColor = SRGBtoLINEAR(texture2D(u_BaseColorSampler, getBaseColorUV())) * u_BaseColorFactor;
+    baseColor = SRGBtoLINEAR(texture(u_BaseColorSampler, getBaseColorUV())) * u_BaseColorFactor;
 #else
     baseColor = u_BaseColorFactor;
 #endif
@@ -332,7 +323,7 @@ void main()
 #endif
 
 #ifdef MATERIAL_UNLIT
-    gl_FragColor = vec4(LINEARtoSRGB(baseColor.rgb), baseColor.a);
+    exportColor( vec4(LINEARtoSRGB(baseColor.rgb), baseColor.a));
     return;
 #endif
 
@@ -392,60 +383,62 @@ void main()
     float ao = 1.0;
     // Apply optional PBR terms for additional (optional) shading
 #ifdef HAS_OCCLUSION_MAP
-    ao = texture2D(u_OcclusionSampler,  getOcclusionUV()).r;
+    ao = texture(u_OcclusionSampler,  getOcclusionUV()).r;
     color = mix(color, color * ao, u_OcclusionStrength);
 #endif
 
     vec3 emissive = vec3(0);
 #ifdef HAS_EMISSIVE_MAP
-    emissive = SRGBtoLINEAR(texture2D(u_EmissiveSampler, getEmissiveUV())).rgb * u_EmissiveFactor;
+    emissive = SRGBtoLINEAR(texture(u_EmissiveSampler, getEmissiveUV())).rgb * u_EmissiveFactor;
     color += emissive;
 #endif
 
 #ifndef DEBUG_OUTPUT // no debug
 
    // regular shading
-    gl_FragColor = vec4(toneMap(color), baseColor.a);
+    output_color = vec4(toneMap(color), baseColor.a);
 
 #else // debug output
 
     #ifdef DEBUG_METALLIC
-        gl_FragColor.rgb = vec3(metallic);
+        output_color.rgb = vec3(metallic);
     #endif
 
     #ifdef DEBUG_ROUGHNESS
-        gl_FragColor.rgb = vec3(perceptualRoughness);
+        output_color.rgb = vec3(perceptualRoughness);
     #endif
 
     #ifdef DEBUG_NORMAL
         #ifdef HAS_NORMAL_MAP
-            gl_FragColor.rgb = texture2D(u_NormalSampler, getNormalUV()).rgb;
+            output_color.rgb = texture(u_NormalSampler, getNormalUV()).rgb;
         #else
-            gl_FragColor.rgb = vec3(0.5, 0.5, 1.0);
+            output_color = vec3(0.5, 0.5, 1.0);
         #endif
     #endif
 
     #ifdef DEBUG_BASECOLOR
-        gl_FragColor.rgb = LINEARtoSRGB(baseColor.rgb);
+        output_color.rgb = LINEARtoSRGB(baseColor.rgb);
     #endif
 
     #ifdef DEBUG_OCCLUSION
-        gl_FragColor.rgb = vec3(ao);
+        output_color.rgb = vec3(ao);
     #endif
 
     #ifdef DEBUG_EMISSIVE
-        gl_FragColor.rgb = LINEARtoSRGB(emissive);
+        output_color.rgb = LINEARtoSRGB(emissive);
     #endif
 
     #ifdef DEBUG_F0
-        gl_FragColor.rgb = vec3(f0);
+        output_color.rgb = vec3(f0);
     #endif
 
     #ifdef DEBUG_ALPHA
-        gl_FragColor.rgb = vec3(baseColor.a);
+        output_color.rgb = vec3(baseColor.a);
     #endif
 
-    gl_FragColor.a = 1.0;
+    output_color.a = 1.0;
 
 #endif // !DEBUG_OUTPUT
+
+    g_finalColor = output_color;
 }