Rotating Octahedron + Click

by juansb827

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/gl-matrix/2.4.0/gl-matrix-min.js"></script>
<html>
    <body>
        <canvas id="game-surface" width="500" height="500">
            
        </canvas>
        <br>
        <i>Octaedro construido con la primitiva TRIANGLE_FAN</i>
       
    </body>
</html>

JavaScript

var vertexShader =[
    'precision mediump float;',
    '',
    'attribute vec3 vertPosition;',
    'attribute vec3 vertColor;',
    'varying vec3 fragColor;',
    'uniform mat4 mWorld;',
    'uniform mat4 mView;',
    'uniform mat4 mProj;',
    '',
    'void main()',
    '{',
    'fragColor = vertColor;',
    'gl_Position = mProj* mView * mWorld* vec4(vertPosition,1.0);',
    '}'

].join('\n');

var fragmentShader =[
    'precision mediump float;',
    '',
    'varying vec3 fragColor;',
    'void main()',
    '{',
    'gl_FragColor = vec4(fragColor,1.0);',
    '}'
].join('\n');

function Init(){
    var canvas = document.getElementById("canvas");
    var gl= canvas.getContext('webgl');

    //Color Of the Paint
   // gl.clearColor(0.75,0.85,0.8,1.0);

   // Fondo Area de trabajo
    gl.clear(gl.COLOR_BUFFER_BIT);
    gl.enable(gl.DEPTH_TEST);
   //Vertex Shader 
    var     vertexSh = gl.createShader(gl.VERTEX_SHADER);
    //Fragment Shader
    var fragmentSh = gl.createShader(gl.FRAGMENT_SHADER);

    //Assign Shader
    gl.shaderSource(vertexSh, vertexShader);
    gl.shaderSource(fragmentSh,fragmentShader);

    //Compile Shaders
    gl.compileShader(vertexSh);
    if(!gl.getShaderParameter(vertexSh,gl.COMPILE_STATUS)){
        console.log('Error compiling the vertex shader',gl.getShaderInfoLog(vertexSh));
        return;
    }
    gl.compileShader(fragmentSh);
    if(!gl.getShaderParameter(fragmentSh,gl.COMPILE_STATUS)){
        console.log('Error compiling the fragment shader',gl.getShaderInfoLog(fragmentSh));
        return;
    }

    //Create Program
    var program = gl.createProgram();
    gl.attachShader(program,vertexSh);
    gl.attachShader(program,fragmentSh);
    gl.linkProgram(program);
    if(!gl.getProgramParameter(program,gl.LINK_STATUS)){
        console.error('Error Linking the program',gl.getProgramInfoLog(program)); 
        return;
    }

    //Validate Program and found additional errors
    gl.validateProgram(program);
   ...