"use strict";

const VERTEX_SHADER_SOURCE = `
    attribute vec2 a_position;

    uniform vec2 u_translation;

	uniform float u_rotation; // radians

    void main() {
		float x = a_position.x + u_translation.x + a_position.x * cos(u_rotation) - a_position.y * sin(u_rotation);
		float y = a_position.y + u_translation.y + a_position.x * sin(u_rotation)+ a_position.y * cos(u_rotation);

         gl_Position = vec4(x, y, 1.0, 1.0);
    }
`;

const FRAGMENT_SHADER_SOURCE = `
    precision mediump float;
    uniform vec4 u_FragColor;
    void main() {
        gl_FragColor = u_FragColor;
    }
`;

const MOVE_SPEED = 0.5;

function main() {
    // Setup context
    const canvas = document.getElementById("c");
    const gl = canvas.getContext("webgl");
    if (gl === null) {
        window.alert("WebGL not supported!");
        return;
    }

    // Setup shaders
    const vertexShader = createShader(gl, gl.VERTEX_SHADER, VERTEX_SHADER_SOURCE);
    const fragmentShader = createShader(gl, gl.FRAGMENT_SHADER, FRAGMENT_SHADER_SOURCE);
    const program = createProgram(gl, vertexShader, fragmentShader);
    const positionAttributeLocation = gl.getAttribLocation(program, "a_position");
	gl.enableVertexAttribArray(positionAttributeLocation);
	gl.vertexAttribPointer(positionAttributeLocation, 2, gl.FLOAT,false, 0, 0);

	const rotationUniform = gl.getUniformLocation(program,"u_rotation");
    const translationUniformLocation = gl.getUniformLocation(program, "u_translation");
    const colourUniform = gl.getUniformLocation(program, "u_FragColor");
    gl.useProgram(program);

    let translationX = 0.0;
    let translationY = 0.0;

	let oldTime = 0;
	let angle = 0;

    let leftPresed = false;
    let rightPressed = false;
    let downPressed = false;
    let upPressed = false;

    // User input ( created here, because input.js didnt work)
    {
        document.addEventListener("keydown", function (event) {
            switch (event.key) {
                case "a": {
                        leftPresed = true;
                    }
                    break;

                case "d": {
                        rightPressed = true;
                    }
                    break;

                case "s": {
                        downPressed = true;
                    }
                    break;

                case "w": {
                        upPressed = true;
                    }
                    break;
            }
        });

        document.addEventListener("keyup", function (event) {
            switch (event.key) {
                case "a": {
                        leftPresed = false;
                    }
                    break;

                case "d": {
                        rightPressed = false;
                    }
                    break;

                case "s": {
                        downPressed = false;
                    }
                    break;

                case "w": {
                        upPressed = false;
                    }
                    break;
            }
        });

    }

    // Setup vertex position buffer
    const positions = [
-0.8, 0.8,-0.65, 0.6, -0.8, 0.6,  // building_1_1
 -0.8, 0.8,-0.65, 0.6, -0.65, 0.8, // building_1_2

0.1, 1.0, 0.5, 1.0, 0.3, -1.0, //first half of river
0.3, -1.0,0.5, 1.0, 0.7, -1.0, //second half

-0.6, 0.5, -0.83, 0.3, -0.83, 0.5, //building_2_1
-0.6, 0.5, -0.83, 0.3, -0.6, 0.3, // building_2_2

0.75, 0.95, 0.95, 0.77, 0.95, 0.95, //building_3_1
0.75, 0.95, 0.95, 0.77, 0.75, 0.77, // building_3_2

0.8, 0.7, 0.95, 0.7, 0.95, 0.45, //helipad_1
0.8, 0.7, 0.95, 0.45, 0.8, 0.45, //helipad_2

0.84, 0.65, 0.86, 0.65, 0.86, 0.5,//
0.84, 0.65, 0.86, 0.5, 0.84, 0.5,//
0.89, 0.65, 0.91, 0.65, 0.91, 0.5,//
0.89, 0.65, 0.91, 0.5, 0.89, 0.5,//helipad
0.86, 0.59, 0.86, 0.54, 0.89, 0.59,//
0.86, 0.54, 0.89, 0.54, 0.89, 0.59,//

// helicopter
-0.1, 0.5, 0.1, 0.5, 0.03, 0.58,// front
-0.1, 0.5, 0.03, 0.58, -0.03, 0.58,// end front
-0.1, 0.5, 0.1, 0.5, -0.1, 0.1,// mid-square
-0.1, 0.1, 0.1, 0.5, 0.1, 0.1,// square end
0.1, 0.1, -0.1, 0.1, 0, 0,
0.02, 0.02, -0.02, 0.02, -0.02, -0.3, //tail
-0.02, -0.3, 0.02, 0.02, 0.02, -0.3,
-0.02, -0.3, 0.02, 0.02, 0.02, -0.3,
-0.02, -0.3, -0.02, -0.26, -0.05, -0.3, //
0, 0.3, 0.3, 0.3, 0.3, 0.35, //blades
0, 0.3, -0.3, 0.3, -0.3, 0.35
    ];
    const positionBuffer = gl.createBuffer();
    gl.bindBuffer(gl.ARRAY_BUFFER, positionBuffer);
    gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(positions), gl.STATIC_DRAW);

    // Prepare position buffer
    {
        const size = 2;          // 2 components per iteration
        const type = gl.FLOAT;   // the data is 32bit floats
        const normalize = false; // don't normalize the data
        const stride = 0;        // 0 = move forward size * sizeof(type) each iteration to get the next position
        const offset = 0;        // start at the beginning of the buffer
        gl.vertexAttribPointer(positionAttributeLocation, size, type, normalize, stride, offset);
        gl.enableVertexAttribArray(positionAttributeLocation);
    }

    gl.clearColor(0, 0.59, 0.25, 1);

    const render = function () {
        resizeCanvas(canvas);
        gl.viewport(0, 0, canvas.width, canvas.height);

        gl.clear(gl.COLOR_BUFFER_BIT);

        gl.uniform2fv(translationUniformLocation, [0, 0]);
            gl.uniform4fv(colourUniform, [0.6,0.3,0,1]);
            gl.drawArrays(gl.TRIANGLES, 0, 6);
            gl.drawArrays(gl.TRIANGLES, 12, 6);
            gl.drawArrays(gl.TRIANGLES, 18, 6);


            gl.uniform4fv(colourUniform, [0.4,0.7,1,1]);
            gl.drawArrays(gl.TRIANGLES, 6, 6);

            gl.uniform4fv(colourUniform, [0,0,0,1]);
            gl.drawArrays(gl.TRIANGLES, 24, 6);
            gl.drawArrays(gl.LINE_LOOP, 0, 6);
            gl.drawArrays(gl.LINE_LOOP, 12, 6);
            gl.drawArrays(gl.LINE_LOOP, 18, 6);


            gl.uniform4fv(colourUniform, [1,1,1,1]);
            gl.drawArrays(gl.TRIANGLES, 30, 18);
        // Draw the triangle
        {

            gl.uniform2fv(translationUniformLocation, [translationX, translationY]);
            gl.uniform4fv(colourUniform, [0,0,0,0.8]);
            gl.drawArrays(gl.TRIANGLES, 48, 27);
        }

		{
		gl.uniform1f(rotationUniform, angle);
		//draw
		gl.drawArrays(gl.TRIANGLES, 75, 3);
		}

    };

    let lastSeconds = 0;

	angle = 0; // degrees
	const turnSpeed = 1; // degree per second
	let update = function(deltaTime) {
		angle += turnSpeed * deltaTime;
	};

	let oldtime = 0;

    let animate = function (milliseconds) {

        const seconds = milliseconds / 1000;
        const delta = seconds - lastSeconds;

        render();
        window.requestAnimationFrame(animate);

        if (leftPresed) {
            translationX -= MOVE_SPEED * delta;
			update(delta);
        }
        if (rightPressed) {
            translationX += MOVE_SPEED * delta;
        }
        if (downPressed) {
            translationY -= MOVE_SPEED * delta;
        }
        if (upPressed) {
            translationY += MOVE_SPEED * delta;
        }

        lastSeconds = seconds;
    };

    animate();
}

function resizeCanvas (canvas) {
    check(isCanvas(canvas));

    const cssToRealPixels = window.devicePixelRatio || 1.0;

    const displayWidth = Math.floor(canvas.clientWidth  * cssToRealPixels);
    const displayHeight = Math.floor(canvas.clientHeight * cssToRealPixels);

    if (canvas.width !== displayWidth || canvas.height !== displayHeight) {
        canvas.width = canvas.clientWidth;
        canvas.height = canvas.clientHeight;
        return true;
    }
    else {
        return false;
    }
}

function createShader (gl, type, source) {
    check(isContext(gl), isString(source));

    const shader = gl.createShader(type);
    gl.shaderSource(shader, source);
    gl.compileShader(shader);
    const success = gl.getShaderParameter(shader, gl.COMPILE_STATUS);
    if (!success) {
        console.error(gl.getShaderInfoLog(shader));
        gl.deleteShader(shader);
        return null;
    }

    return shader;
}

function createProgram (gl, vertexShader, fragmentShader) {
    check(isContext(gl), isShader(vertexShader), isShader(fragmentShader));

    const program = gl.createProgram();
    gl.attachShader(program, vertexShader);
    gl.attachShader(program, fragmentShader);
    gl.linkProgram(program);

    const success = gl.getProgramParameter(program, gl.LINK_STATUS);
    if (!success) {
        console.error(gl.getProgramInfoLog(program));
        gl.deleteProgram(program);
        return null;
    }

    return program;
}