we opengl2 now, and GLSL 3

meeees · Jan 1, 2020 · cc76233 · cc76233
1 parent 9826f9a
commit cc76233
Show file tree

Hide file tree

Showing 2 changed files with 30 additions and 28 deletions.
diff --git a/webgl/shaders.mjs b/webgl/shaders.mjs
@@ -1,14 +1,15 @@
-const vertShader = `
-    attribute vec4 aVertexPosition;
-    attribute vec3 aVertexNormal;
-    attribute vec2 aTextureCoord;
+const vertShader = `#version 300 es
+
+    in vec4 aVertexPosition;
+    in vec3 aVertexNormal;
+    in vec2 aTextureCoord;
 
     uniform mat4 uModelViewMatrix;
     uniform mat4 uProjectionMatrix;
     uniform mat4 uNormalMatrix;
 
-    varying highp vec3 vLighting;
-    varying highp vec2 vTextureCoord;
+    out highp vec3 vLighting;
+    out highp vec2 vTextureCoord;
 
     void main() {
         gl_Position = uProjectionMatrix * uModelViewMatrix * aVertexPosition;
@@ -25,35 +26,42 @@ const vertShader = `
     }
 `;
 
-const fragShader = `
-    #extension GL_EXT_draw_buffers : require 
-    varying highp vec3 vLighting;
-    varying highp vec2 vTextureCoord;
+const fragShader = `#version 300 es
+    precision mediump float;
+    
+    in highp vec3 vLighting;
+    in highp vec2 vTextureCoord;
 
     uniform sampler2D uSampler;
 
+    layout(location = 0) out vec4 color;
+    layout(location = 1) out vec4 collision;
+
     void main() {
-        gl_FragData[0] = texture2D(uSampler, vTextureCoord) * vec4(vLighting, 1.0);
-        gl_FragData[1] = texture2D(uSampler, vTextureCoord);
+        color = texture(uSampler, vTextureCoord) * vec4(vLighting, 1.0);
+        collision = texture(uSampler, vTextureCoord);
     }
 `;
 
-const screenVertShader = `
-    attribute vec2 aVertexPosition;
-    varying highp vec2 vTextureCoord;
+const screenVertShader = `#version 300 es
+    in vec2 aVertexPosition;
+    out highp vec2 vTextureCoord;
 
     void main() {
         vTextureCoord = aVertexPosition * vec2(0.5, 0.5) + vec2(0.5, 0.5);
         gl_Position = vec4(aVertexPosition, 0, 1);
     }
 `
 
-const screenFragShader = `
+const screenFragShader = `#version 300 es
+    precision mediump float;
+
     uniform sampler2D uSampler;
-    varying highp vec2 vTextureCoord;
+    in highp vec2 vTextureCoord;
+    out vec4 color;
 
     void main() {
-        gl_FragData[0] = texture2D(uSampler, vTextureCoord);
+        color = texture(uSampler, vTextureCoord);
     }
 `
 

diff --git a/webgl/webgl.mjs b/webgl/webgl.mjs
@@ -14,22 +14,17 @@ var voxels;
 var cameraPos = [0.0, 0.0, 6.0 ];
 var cameraRot = [0.0, 0.0, 0.0];
 
-var bufferExt;
 var renderTextures;
 
 function main() {
     canvas = document.getElementById('glCanvas');
-    gl = canvas.getContext('webgl');
+    gl = canvas.getContext('webgl2');
 
     if(gl === null) {
         const dContext = canvas.getContext('2d');
         dContext.fillText('Your browser no like webgl, use better browser', 10, 10);
     }
 
-    bufferExt = bufferExt = gl.getExtension('WEBGL_draw_buffers') ||
-    gl.getExtension("GL_EXT_draw_buffers") ||
-    gl.getExtension("EXT_draw_buffers");
-
     shaderInfo = initPrograms(gl);
     buffers = Voxel.initBuffers(gl);
     screenBuffers = initScreenBuffer(gl);
@@ -72,7 +67,7 @@ function setupRenderTextures(gl) {
 
 
 
-        const attachmentPoint = bufferExt.COLOR_ATTACHMENT0_WEBGL;
+        const attachmentPoint = gl.COLOR_ATTACHMENT0;
         gl.framebufferTexture2D(gl.FRAMEBUFFER, attachmentPoint, gl.TEXTURE_2D, mainTexture, level);
     }
 
@@ -92,16 +87,15 @@ function setupRenderTextures(gl) {
 
 
 
-        const attachmentPoint = bufferExt.COLOR_ATTACHMENT1_WEBGL;
+        const attachmentPoint = gl.COLOR_ATTACHMENT1;
         gl.framebufferTexture2D(gl.FRAMEBUFFER, attachmentPoint, gl.TEXTURE_2D, collisionTexture, level);
     }
 
     const depthBuffer = gl.createRenderbuffer();
     gl.bindRenderbuffer(gl.RENDERBUFFER, depthBuffer);
     gl.renderbufferStorage(gl.RENDERBUFFER, gl.DEPTH_COMPONENT16, width, height);
     gl.framebufferRenderbuffer(gl.FRAMEBUFFER, gl.DEPTH_ATTACHMENT, gl.RENDERBUFFER, depthBuffer);
-    bufferExt.drawBuffersWEBGL([bufferExt.COLOR_ATTACHMENT0_WEBGL, 
-        bufferExt.COLOR_ATTACHMENT1_WEBGL]);
+    gl.drawBuffers([gl.COLOR_ATTACHMENT0, gl.COLOR_ATTACHMENT1]);
 
     return {
         framebuffer: fb,