/// <reference path="../scripts/jquery-3.5.1.min.js"/>
/// <reference path="vec2.js" />
/// <reference path="mat4.js" />
/// <reference path="shader.js" />
/// <reference path="circle.js" />

function main() {
    // Define Constants
    const CIRCLE_RADIUS = 16;
    const GRAVITY = 9.8;

    // Retrieve context
    const lProgramContext = getContext('#rigidbody_2');

    if (lProgramContext.gl === null) {
        console.error('Unable to initialize WebGL. Your browser or machine may not support it.');
        return;
    }

    lProgramContext.gl.clearColor(0.0, 0.0, 0.0, 1.0);
    lProgramContext.gl.clear(lProgramContext.gl.COLOR_BUFFER_BIT);

    function run() {
        console.log('Running Rigid Body 2');
        lProgramContext.load().then(function(pProgramInfo) {
            const lCircle = circle(lProgramContext.gl, CIRCLE_RADIUS, 30, [
                { x: 1, y: 1, z: 0, w: 1 },
                { x: 1, y: 0, z: 1, w: 1 },
                { x: 0, y: 1, z: 1, w: 1 },
                { x: 0, y: 1, z: 0, w: 1 }
            ], vec2(lProgramContext.width / 2.0, lProgramContext.height / 2.0));

            function update(pDeltaTimeSeconds) {
                // Same physics updates from previously
                const lGravityForce = vec2(0, -1.0 * (lCircle.mass * GRAVITY));
                lCircle.force = addVec2(lCircle.force, lGravityForce);
                const lCurrentAcceleration = scaleVec2(lCircle.force, 1.0 / lCircle.mass);
                lCircle.velocity = addVec2(lCircle.velocity, scaleVec2(lCurrentAcceleration, pDeltaTimeSeconds));
                lCircle.position = addVec2(lCircle.position, scaleVec2(lCircle.velocity, pDeltaTimeSeconds));
                lCircle.rotationRadians += Math.PI * pDeltaTimeSeconds;
                lCircle.model = rotateMatrix2d(translateMatrix(mat4(), lCircle.position.x, lCircle.position.y, 0), lCircle.rotationRadians);
                lCircle.force = vec2();

                // Render Code only
                lProgramContext.gl.clearColor(0.0, 0.0, 0.0, 1.0);
                lProgramContext.gl.clearDepth(1.0);
                lProgramContext.gl.enable(lProgramContext.gl.DEPTH_TEST);
                lProgramContext.gl.depthFunc(lProgramContext.gl.LEQUAL);
                lProgramContext.gl.clear(lProgramContext.gl.COLOR_BUFFER_BIT | lProgramContext.gl.DEPTH_BUFFER_BIT);

                lProgramContext.gl.useProgram(pProgramInfo.program);
                lProgramContext.gl.uniformMatrix4fv(pProgramInfo.uniformLocations.projection, false, lProgramContext.perspective);
                lProgramContext.gl.uniformMatrix4fv(pProgramInfo.uniformLocations.model, false, lCircle.model);

                renderCircle(lProgramContext.gl, pProgramInfo, lCircle);
            }

            function cleanup() {
                lProgramContext.gl.deleteBuffer(lCircle.buffer);
                lProgramContext.gl.deleteProgram(pProgramInfo.program);
                lProgramContext.gl.clearColor(0.0, 0.0, 0.0, 1.0);
                lProgramContext.gl.clear(lProgramContext.gl.COLOR_BUFFER_BIT);
            }

            function reset() {
                lExitRequestFunc();
                lProgramContext.reset();
            }

            const lExitRequestFunc = requestUpdateLoop(update, cleanup);
            lProgramContext.stopButton.on('click', reset);
        });
    }

    lProgramContext.playButton.on('click', run);
}

$(document).ready(main);