fixed attribute issues in posterization lesson

Author: mikolalysenko

exercises/npr-1/files/vertex.glsl

@@ -1,11 +1,20 @@
 precision highp float;
 
-attribute vec4 position, normal;
-uniform mat4 model, view, projection;
-uniform mat4 inverseModel, inverseView, inverseProjection;
-uniform vec3 diffuse, lightDirection;
+attribute vec3 position;
+attribute vec3 normal;
+
+uniform mat4 model;
+uniform mat4 view;
+uniform mat4 projection;
+
+uniform mat4 inverseModel;
+uniform mat4 inverseView;
+uniform mat4 inverseProjection;
+
+uniform vec3 diffuse;
+uniform vec3 lightDirection;
 uniform float numBands;
 
 void main() {
-  gl_Position = vec4(0,0,0,1);
+  gl_Position = vec4(position,1);
 }

exercises/npr-1/index.js

@@ -34,6 +34,7 @@ require('../common')({
 window.addEventListener('resize', fit(canvas), false)
 
 var vertexNormals = getNormals(dragon.cells, dragon.positions, 0.1)
+var vertexCount = dragon.cells.length*3
 var vertexData = []
 for(var i=0; i<dragon.cells.length; ++i) {
   var loop = dragon.cells[i]
@@ -42,17 +43,7 @@ for(var i=0; i<dragon.cells.length; ++i) {
   }
 }
 var vertexBuffer = createBuffer(gl, vertexData)
-var vertexArray = createVAO(gl, [
-  {
-    "buffer": vertexBuffer,
-    "size": 3 
-  },
-  {
-    "buffer": createBuffer(gl, vertexNormals),
-    "size": 3
-  }
-])
-
+var normalBuffer = createBuffer(gl, vertexNormals)
 
 var actualShader = createShader({
     frag: process.env.file_fragment_glsl
@@ -122,8 +113,15 @@ function actual(fbo) {
   actualShader.bind()
   actualShader.uniforms = camera
 
-  vertexArray.bind()
-  vertexArray.draw(gl.TRIANGLES, vertexData.length / 3)
+  if(actualShader.attributes.normal.location >= 0) {
+    normalBuffer.bind()
+    actualShader.attributes.normal.pointer()
+  }
+
+  vertexBuffer.bind()
+  actualShader.attributes.position.pointer()
+
+  gl.drawArrays(gl.TRIANGLES, 0, vertexCount)
 }
 
 function expected(fbo) {
@@ -138,6 +136,11 @@ function expected(fbo) {
   expectedShader.bind()
   expectedShader.uniforms = camera
 
-  vertexArray.bind()
-  vertexArray.draw(gl.TRIANGLES, vertexData.length / 3)
+  normalBuffer.bind()
+  expectedShader.attributes.normal.pointer()
+
+  vertexBuffer.bind()
+  expectedShader.attributes.position.pointer()
+
+  gl.drawArrays(gl.TRIANGLES, 0, vertexCount)
 }

exercises/npr-1/shaders/fragment.glsl

@@ -1,6 +1,7 @@
 precision mediump float;
 
-uniform vec3 diffuse, lightDirection;
+uniform vec3 diffuse;
+uniform vec3 lightDirection;
 varying vec3 fragNormal;
 
 uniform float numBands;

exercises/npr-1/shaders/vertex.glsl

@@ -1,7 +1,16 @@
 precision mediump float;
-attribute vec3 position, normal;
-uniform mat4 model, view, projection;
-uniform mat4 inverseModel, inverseView, inverseProjection;
+
+attribute vec3 position;
+attribute vec3 normal;
+
+uniform mat4 model;
+uniform mat4 view;
+uniform mat4 projection;
+
+uniform mat4 inverseModel;
+uniform mat4 inverseView;
+uniform mat4 inverseProjection;
+
 varying vec3 fragNormal;
 
 void main() {