title: WebGL - How to pass unsigned byte vertex attribute colour values?
body: <p>My vertices are made up of an array with this structure:</p>
  
  <pre><code>[     Position      ][        colour        ]
  [float][float][float][byte][byte][byte][byte]
  </code></pre>
  
  <p>Passing the vertex position is no problem:</p>
  
  <pre><code>gl.bindBuffer(gl.ARRAY_BUFFER, this.vbo);
  gl.vertexAttribPointer(this.material.aVertexPosition, 3, gl.FLOAT, false, 4, 0);
  </code></pre>
  
  <p>But I can't figure out how I can pass the colours to the shader. Unfortunately, it's not possible to use integers inside the glsl shader so I have to use floats. 
  How can I get my unsigned byte colour value into the glsl float colour value? I tried it like this for r, g and b sepperately but the colours are all messed up:</p>
  
  <pre><code>gl.bindBuffer(gl.ARRAY_BUFFER, this.vbo);
  gl.vertexAttribPointer(this.material.aR, 1, gl.BYTE, false, 15, 12);
  </code></pre>
  
  <p>Vertex Shader (colouredPoint.vs)</p>
  
  <pre><code>precision highp float;
  
  attribute vec3 aVertexPosition;
  attribute float aR;
  attribute float aG;
  attribute float aB;
  
  uniform mat4 world;
  uniform mat4 view;
  uniform mat4 proj;
  
  varying vec3 vVertexColour;
  
  void main(void){
      gl_PointSize = 4.0;  
      gl_Position = proj * view * world * vec4(aVertexPosition, 1.0);
      vVertexColour = vec3(aR, aG, aB);
  } 
  </code></pre>
  
  <p>Pixel Shader (colouredPoint.fs)</p>
  
  <pre><code>precision highp float;
  
  varying vec3 vVertexColour;
  
  void main(void){
      gl_FragColor = vec4(vVertexColour, 1);
  } 
  </code></pre>