script.js

var gl;
const {mat2, mat3, mat4, vec2, vec3, vec4} = glMatrix;  // Now we can use function without glMatrix.~~~

function testGLError(functionLastCalled) {
    /* gl.getError returns the last error that occurred using WebGL for debugging */ 
    var lastError = gl.getError();

    if (lastError != gl.NO_ERROR) {
        alert(functionLastCalled + " failed (" + lastError + ")");
        return false;
    }
    return true;
}

function initialiseGL(canvas) {
    try {
        // Try to grab the standard context. If it fails, fallback to experimental
        gl = canvas.getContext('webgl',
			{stencil:true, alpha:true, depth:true, antialias:true, preserveDrawingBuffer:false});
		//gl = canvas.getContext('webgl',
		//	{stencil:true, alpha:true, depth:true, antialias:false, preserveDrawingBuffer:true});
        gl.viewport(0, 0, canvas.width, canvas.height);
    }
    catch (e) {
    }

    if (!gl) {
        alert("Unable to initialise WebGL. Your browser may not support it");
        return false;
    }
    return true;
}

var shaderProgram;

var vertexData = [
		// Backface (RED) 
        -0.5, -0.5, -0.5,  0.870, 0.174, 0.360, 1.0,
         0.5,  0.5, -0.5,  0.870, 0.174, 0.360, 1.0,
         0.5, -0.5, -0.5,  0.870, 0.174, 0.360, 1.0,
        -0.5, -0.5, -0.5,  0.870, 0.174, 0.360, 1.0,
        -0.5,  0.5, -0.5,  0.870, 0.174, 0.360, 1.0,
         0.5,  0.5, -0.5,  0.870, 0.174, 0.360, 1.0,
		// Front (BLUE)
        -0.5, -0.5,  0.5,  0.289, 0.477, 0.780, 1.0,
         0.5, -0.5,  0.5,  0.289, 0.477, 0.780, 1.0,
		     0.5,  0.5,  0.5,  0.289, 0.477, 0.780, 1.0,
        -0.5, -0.5,  0.5,  0.289, 0.477, 0.780, 1.0,
         0.5,  0.5,  0.5,  0.289, 0.477, 0.780, 1.0,
		    -0.5,  0.5,  0.5,  0.289, 0.477, 0.780, 1.0,
		// LEFT (GREEN)
        -0.5, -0.5, -0.5,  0.289, 0.780, 0.583, 1.0,
        -0.5,  0.5,  0.5,  0.289, 0.780, 0.583, 1.0,
        -0.5,  0.5, -0.5,  0.289, 0.780, 0.583, 1.0,
        -0.5, -0.5, -0.5,  0.289, 0.780, 0.583, 1.0,
        -0.5, -0.5,  0.5,  0.289, 0.780, 0.583, 1.0,
        -0.5,  0.5,  0.5,  0.289, 0.780, 0.583, 1.0, 
		// RIGHT (YELLOW)
         0.5, -0.5, -0.5,  0.920, 0.915, 0.598, 1.0,
         0.5,  0.5, -0.5,  0.920, 0.915, 0.598, 1.0,
		     0.5,  0.5,  0.5,  0.920, 0.915, 0.598, 1.0,
         0.5, -0.5, -0.5,  0.920, 0.915, 0.598, 1.0,
         0.5,  0.5,  0.5,  0.920, 0.915, 0.598, 1.0,
		     0.5, -0.5,  0.5,  0.920, 0.915, 0.598, 1.0,
		// BOTTON (MAGENTA)
        -0.5, -0.5, -0.5,  0.756, 0.485, 0.950, 1.0,
         0.5, -0.5, -0.5,  0.756, 0.485, 0.950, 1.0,
		     0.5, -0.5,  0.5,  0.756, 0.485, 0.950, 1.0,
        -0.5, -0.5, -0.5,  0.756, 0.485, 0.950, 1.0,
         0.5, -0.5,  0.5,  0.756, 0.485, 0.950, 1.0,