function createOcta(gl, translation, rotationAxis, translationAxis, altTranslation)
{    
    // Vertex Data
    var vertexBuffer2;
    vertexBuffer2 = gl.createBuffer();
    gl.bindBuffer(gl.ARRAY_BUFFER, vertexBuffer2);

    var v1 = [0.0, -.75, 0.0];
    var v2 = [-.75, 0.0, 0.0];
    var v3 = [0.0, 0.0, .75];
    var v4 = [.75, 0.0, 0.0];
    var v5 = [0.0, 0.0, -.75];
    var v6 = [0.0, .75, 0.0];


    var verts = [
       //bottom face 1
       ...v1, ...v2, ...v3,

       //bottom face 2
       ...v1, ...v3, ...v4,

       //bottom face 3
       ...v1, ...v4, ...v5,

       //bottom face 4
       ...v1, ...v5, ...v2,

       //top face 1
       ...v6, ...v2, ...v3,

       //top face 2
       ...v6, ...v3, ...v4,

       //top face 3
       ...v6, ...v4, ...v5,

       //top face 4
       ...v6, ...v5, ...v2
       ];
       
    gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(verts), gl.STATIC_DRAW);

    // Color data
    var colorBuffer = gl.createBuffer();
    gl.bindBuffer(gl.ARRAY_BUFFER, colorBuffer);
    var faceColors = [
        [1.0, 0.0, 0.0, 1.0], // color 1
        [0.0, 0.0, 1.0, 1.0], // color 2
        [0.0, 1.0, 0.0, 1.0], // color 3
        [0.0, 1.0, 1.0, 1.0], // color 4 
        [1.0, 1.0, 0.0, 1.0], // color 5
        [1.0, 0.0, 1.0, 1.0], // color 6
        [1.0, 0.6, 0.4, 1.0], // color 7
        [0.4, 0.6, 0.2, 1.0], // color 8
    ];

    var vertexColors = [];

    // Each vertex must have the color information, that is why the same color is concatenated 3 times, one for each vertex of the octahedron's face.

    for (const color of faceColors) 
    {
        for (var j=0; j < 3; j++)
            vertexColors = vertexColors.concat(color);
    }

    gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(vertexColors), gl.STATIC_DRAW);

    // Index data (defines the triangles to be drawn).
    var scutoidIndexBuffer = gl.createBuffer();
    gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, scutoidIndexBuffer);
    var scutoidIndices = [
        0, 1, 2,        //Face 1
        3, 4, 5,        //Face 2
        6, 7, 8,        //Face 3
        9, 10, 11,      //Face 4
        12, 13, 14,     //Face 5
        15, 16, 17,     //Face 6
        18, 19, 20,     //Face 7
        21, 22, 23      //Face 8
    ];

    // gl.ELEMENT_ARRAY_BUFFER: Buffer used for element indices.
    // Uint16Array: Array of 16-bit unsigned integers.
    gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, new Uint16Array(scutoidIndices), gl.STATIC_DRAW);
    
    var octa = {
            buffer:vertexBuffer2, colorBuffer:colorBuffer, indices:scutoidIndexBuffer,
            vertSize:3, nVerts:24, colorSize:4, nColors: 24, nIndices:24,
            primtype:gl.TRIANGLES, modelViewMatrix: mat4.create(), currentTime : Date.now()};

    mat4.translate(octa.modelViewMatrix, octa.modelViewMatrix, translation);

    var timerun = 0;
    var up = true;

    octa.update = function()
    {
        var now = Date.now();
        var deltat = now - this.currentTime;
        this.currentTime = now;
        var fract = deltat / duration;
        var angle = Math.PI * 2 * fract;

        //Variable "up" determines the direction the triangle will move each frame. 
        //It is inverted every time the time counter reaches ~4.3 seconds, and the counter is reset
        timerun += deltat;
        mat4.rotate(this.modelViewMatrix, this.modelViewMatrix, angle, rotationAxis);

        if(up)
        {
            mat4.translate(this.modelViewMatrix, this.modelViewMatrix, translationAxis);
        }

        else
        {
            mat4.translate(this.modelViewMatrix, this.modelViewMatrix, altTranslation);
        }
        
        if(timerun >= 4300)
        {
            up = !up;
            timerun = 0;
        }
        console.log(timerun);
        console.log(up);
    };
    
    return octa;
}
// TO DO: Create the functions for each of the figures.
TO DO: Create the functions for each of the figures.
TO DO : Create the functions for each of the figures .
function createOcta(gl, translation, rotationAxis, translationAxis, altTranslation)
{    
    var vertexBuffer2;
    vertexBuffer2 = gl.createBuffer();
    gl.bindBuffer(gl.ARRAY_BUFFER, vertexBuffer2);
    var v1 = [0.0, -.75, 0.0];
    var v2 = [-.75, 0.0, 0.0];
    var v3 = [0.0, 0.0, .75];
    var v4 = [.75, 0.0, 0.0];
    var v5 = [0.0, 0.0, -.75];
    var v6 = [0.0, .75, 0.0];
    var verts = [
       ...v1, ...v2, ...v3,
       ...v1, ...v3, ...v4,
       ...v1, ...v4, ...v5,
       ...v1, ...v5, ...v2,
       ...v6, ...v2, ...v3,
       ...v6, ...v3, ...v4,
       ...v6, ...v4, ...v5,
       ...v6, ...v5, ...v2
       ];
    gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(verts), gl.STATIC_DRAW);
    var colorBuffer = gl.createBuffer();
    gl.bindBuffer(gl.ARRAY_BUFFER, colorBuffer);
    var faceColors = [
        [1.0, 0.0, 0.0, 1.0], 
        [0.0, 0.0, 1.0, 1.0], 
        [0.0, 1.0, 0.0, 1.0], 
        [0.0, 1.0, 1.0, 1.0], 
        [1.0, 1.0, 0.0, 1.0], 
        [1.0, 0.0, 1.0, 1.0], 
        [1.0, 0.6, 0.4, 1.0], 
        [0.4, 0.6, 0.2, 1.0], 
    ];
    var vertexColors = [];
    for (const color of faceColors) 
    {
        for (var j=0; j < 3; j++)
            vertexColors = vertexColors.concat(color);
    }
    gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(vertexColors), gl.STATIC_DRAW);
    var scutoidIndexBuffer = gl.createBuffer();
    gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, scutoidIndexBuffer);
    var scutoidIndices = [
        0, 1, 2,        
        3, 4, 5,        
        6, 7, 8,        
        9, 10, 11,      
        12, 13, 14,     
        15, 16, 17,     
        18, 19, 20,     
        21, 22, 23      
    ];
    gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, new Uint16Array(scutoidIndices), gl.STATIC_DRAW);
    var octa = {
            buffer:vertexBuffer2, colorBuffer:colorBuffer, indices:scutoidIndexBuffer,
            vertSize:3, nVerts:24, colorSize:4, nColors: 24, nIndices:24,
            primtype:gl.TRIANGLES, modelViewMatrix: mat4.create(), currentTime : Date.now()};
    mat4.translate(octa.modelViewMatrix, octa.modelViewMatrix, translation);
    var timerun = 0;
    var up = true;
    octa.update = function()
    {
        var now = Date.now();
        var deltat = now - this.currentTime;
        this.currentTime = now;
        var fract = deltat / duration;
        var angle = Math.PI * 2 * fract;
        timerun += deltat;
        mat4.rotate(this.modelViewMatrix, this.modelViewMatrix, angle, rotationAxis);
        if(up)
        {
            mat4.translate(this.modelViewMatrix, this.modelViewMatrix, translationAxis);
        }
        else
        {
            mat4.translate(this.modelViewMatrix, this.modelViewMatrix, altTranslation);
        }
        if(timerun >= 4300)
        {
            up = !up;
            timerun = 0;
        }
        console.log(timerun);
        console.log(up);
    };
    return octa;
}
function createOcta ( gl , translation , rotationAxis , translationAxis , altTranslation ) { var vertexBuffer2 ; vertexBuffer2 = gl . createBuffer ( ) ; gl . bindBuffer ( gl . ARRAY_BUFFER , vertexBuffer2 ) ; var v1 = [ 0.0 , - .75 , 0.0 ] ; var v2 = [ - .75 , 0.0 , 0.0 ] ; var v3 = [ 0.0 , 0.0 , .75 ] ; var v4 = [ .75 , 0.0 , 0.0 ] ; var v5 = [ 0.0 , 0.0 , - .75 ] ; var v6 = [ 0.0 , .75 , 0.0 ] ; var verts = [ ... v1 , ... v2 , ... v3 , ... v1 , ... v3 , ... v4 , ... v1 , ... v4 , ... v5 , ... v1 , ... v5 , ... v2 , ... v6 , ... v2 , ... v3 , ... v6 , ... v3 , ... v4 , ... v6 , ... v4 , ... v5 , ... v6 , ... v5 , ... v2 ] ; gl . bufferData ( gl . ARRAY_BUFFER , new Float32Array ( verts ) , gl . STATIC_DRAW ) ; var colorBuffer = gl . createBuffer ( ) ; gl . bindBuffer ( gl . ARRAY_BUFFER , colorBuffer ) ; var faceColors = [ [ 1.0 , 0.0 , 0.0 , 1.0 ] , [ 0.0 , 0.0 , 1.0 , 1.0 ] , [ 0.0 , 1.0 , 0.0 , 1.0 ] , [ 0.0 , 1.0 , 1.0 , 1.0 ] , [ 1.0 , 1.0 , 0.0 , 1.0 ] , [ 1.0 , 0.0 , 1.0 , 1.0 ] , [ 1.0 , 0.6 , 0.4 , 1.0 ] , [ 0.4 , 0.6 , 0.2 , 1.0 ] , ] ; var vertexColors = [ ] ; for ( const color of faceColors ) { for ( var j = 0 ; j < 3 ; j ++ ) vertexColors = vertexColors . concat ( color ) ; } gl . bufferData ( gl . ARRAY_BUFFER , new Float32Array ( vertexColors ) , gl . STATIC_DRAW ) ; var scutoidIndexBuffer = gl . createBuffer ( ) ; gl . bindBuffer ( gl . ELEMENT_ARRAY_BUFFER , scutoidIndexBuffer ) ; var scutoidIndices = [ 0 , 1 , 2 , 3 , 4 , 5 , 6 , 7 , 8 , 9 , 10 , 11 , 12 , 13 , 14 , 15 , 16 , 17 , 18 , 19 , 20 , 21 , 22 , 23 ] ; gl . bufferData ( gl . ELEMENT_ARRAY_BUFFER , new Uint16Array ( scutoidIndices ) , gl . STATIC_DRAW ) ; var octa = { buffer : vertexBuffer2 , colorBuffer : colorBuffer , indices : scutoidIndexBuffer , vertSize : 3 , nVerts : 24 , colorSize : 4 , nColors : 24 , nIndices : 24 , primtype : gl . TRIANGLES , modelViewMatrix : mat4 . create ( ) , currentTime : Date . now ( ) } ; mat4 . translate ( octa . modelViewMatrix , octa . modelViewMatrix , translation ) ; var timerun = 0 ; var up = true ; octa . update = function ( ) { var now = Date . now ( ) ; var deltat = now - this . currentTime ; this . currentTime = now ; var fract = deltat / duration ; var angle = Math . PI * 2 * fract ; timerun += deltat ; mat4 . rotate ( this . modelViewMatrix , this . modelViewMatrix , angle , rotationAxis ) ; if ( up ) { mat4 . translate ( this . modelViewMatrix , this . modelViewMatrix , translationAxis ) ; } else { mat4 . translate ( this . modelViewMatrix , this . modelViewMatrix , altTranslation ) ; } if ( timerun >= 4300 ) { up = ! up ; timerun = 0 ; } console . log ( timerun ) ; console . log ( up ) ; } ; return octa ; }
TO DO: Create the functions for each of the figures.
TO DO : Create the functions for each of the figures .
// Vertex Data //bottom face 1 //bottom face 2 //bottom face 3 //bottom face 4 //top face 1 //top face 2 //top face 3 //top face 4 // Color data // color 1 // color 2 // color 3 // color 4  // color 5 // color 6 // color 7 // color 8 // Each vertex must have the color information, that is why the same color is concatenated 3 times, one for each vertex of the octahedron's face. // Index data (defines the triangles to be drawn). //Face 1 //Face 2 //Face 3 //Face 4 //Face 5 //Face 6 //Face 7 //Face 8 // gl.ELEMENT_ARRAY_BUFFER: Buffer used for element indices. // Uint16Array: Array of 16-bit unsigned integers. //Variable "up" determines the direction the triangle will move each frame.  //It is inverted every time the time counter reaches ~4.3 seconds, and the counter is reset