text: var vssrc = 
  'attribute vec4 a_pos;\n' +
  'uniform vec4 u_trans;\n' +
  'void main() {\n' +
  '  gl_Position = u_trans + a_pos;\n' +
  '}\n'
  
  var fssrc = 
  'void main() {\n' +
  '  gl_FragColor = vec4(1.0, 0, 0, 1);\n' +
  '}\n'
  
  function main() {
      var canvas = document.getElementById('webgl');
      var gl = getWebGLContext(canvas);
      if (!gl) {
          console.log('failed to get the rendering context for webgl');
          return;
      }
  
      if (!initShaders(gl, vssrc, fssrc)) {
      	console.log('failed to initialize shaders');
      	return;
      }
  
      // 1. create buffer
      var buffer = gl.createBuffer();
  
      var vertices = new Float32Array([
          0.0, 0.5, -0.5, -0.5, 0.5, -0.5
      ]);
  
      var n = 3;
  
      // 2. bind buffer
      gl.bindBuffer(gl.ARRAY_BUFFER, buffer);
  
      // 3. buffer data
      gl.bufferData(gl.ARRAY_BUFFER, vertices, gl.STATIC_DRAW);
  
      // 4. vertex attribute
      var a_pos = gl.getAttribLocation(gl.program, 'a_pos');
      gl.vertexAttribPointer(a_pos, 2, gl.FLOAT, false, 0, 0);
  
      // 5. enable vertex
      gl.enableVertexAttribArray(a_pos);
  
      gl.clearColor(0.0, 0.0, 0.0, 1.0);
      gl.clear(gl.COLOR_BUFFER_BIT);
  
      // translate vec4
      var u_trans = gl.getUniformLocation(gl.program, "u_trans");
      gl.uniform4f(u_trans, 0.5, 0.5, 0, 0)
  
      // draw from buffer[0] to buffer[n-1], count == n.
      gl.drawArrays(gl.TRIANGLES, 0, n);
      // gl.drawArrays(gl.LINES, 0, n);
      // gl.drawArrays(gl.LINE_STRIP, 0, n);
      // gl.drawArrays(gl.LINE_LOOP, 0, n);
  }
  