//set variables
var player;
var cube;
var badCube;
var platform;
var cubesArray = [];
var badCubesArray = [];
var platforms = [];
var lives = [];
var cubesEated = 0;
var gravity;
var drag;
var jump = false;
var time = 60;
var hitOnce = false;
//////////////////////////////////////////////////////////////
function setup() {
    createCanvas(800, 400);
    lives[0] = new Live(width - 20, 5);
    lives[1] = new Live(width - 40, 5);
    lives[2] = new Live(width - 60, 5);
    //DEFINE GRAVITY
    gravity = createVector(0, 0.2);
    playerGravity = createVector(0, 0.8);
    //CREATE THE PLATFORMS
    platforms[0] = new Platform(0, 300, width, 20);
    //CREATE NEW PLAYER
    player = new Player(35, 270);
    setInterval(createGoodCube, 800);
    setInterval(createBadCube, 1000);
    setInterval(timeCount, 1000);
}
///////////////////////////////////////////////////////////////
function draw() {
    background('#00bcd488');
    //DISPLAY LIVES
    for (i = 0; i < lives.length; i++) {
        lives[i].display();
    }
    //DISPLAY CUBES EATED COUNTER
    fill(250);
    rect(7, 8, 15, 15);
    textSize(24);
    fill(250);
    text(`: ${cubesEated}`, 29, 23);
    // DISPLAY TIMER
    if (time > 10) {
        fill(250);
        textSize(28);
    } else {
        fill('#ff2e63');
        textSize(32);
    }
    text(time, width / 2, 28);
    //DISPLAY THE PLATFORMS
    platforms[0].show();
    //IF UP_ARROW PRESSED APPLY JUMP FUNCTION
    if (jump === true) {
        player.applyForce(playerGravity);
        player.jump();
        //CHECK IF PLAYER ON PLATFORM
        if (player.pos.y + player.size >= platforms[0].pos.y) {
            //STOPS PLAYER FROM FALLING
            player.pos.y = platforms[0].pos.y - player.size;
            //MAKE JUMP VARIABLE READY FOR ANOTHER JUMP
            jump = false;
            //RESET JUMP VELOCITY
            player.update();
        }
    }
    //DISPLAY THE PLAYER
    player.show();
    //MOVE RIGHT
    if (keyIsDown(RIGHT_ARROW)) {
        player.moveRight();
    }
    //MOVE LEFT
    if (keyIsDown(LEFT_ARROW)) {
        player.moveLeft();
    }
    //MAKE ENEMY CUBES JUMP+ APPLY GRVITY ON THEM
    for (i = 0; i < cubesArray.length; i++) {
        cubesArray[i].show();
        cubesArray[i].applyForce(gravity);
        cubesArray[i].update();
        if (cubesArray[i].checkCollusion(player)) {
            cubesEated += 1;
            cubesArray.splice(i, 1);
        }
    }
    // REMOVE CUBE THAT FALLS DOWN
    for (i = 0; i < cubesArray.length; i++) {
        if (cubesArray[i].pos.y > height + 10) {
            cubesArray.splice(i, 1);
        }
    }
    for (j = 0; j < badCubesArray.length; j++) {
        badCubesArray[j].show();
        badCubesArray[j].applyForce(gravity);
        badCubesArray[j].update();
        if (badCubesArray[j].checkCollusion(player) && hitOnce === false) {
            badCubesArray.splice(j, 1);
            lives.pop();
            hitOnce = true;
        }
    }
    hitOnce = false;
    // REMOVE CUBE THAT FALLS DOWN
    for (j = 0; j < badCubesArray.length; j++) {
        if (badCubesArray[j].pos.y > height + 10) {
            badCubesArray.splice(j, 1);
        }
    }
    //IF PLAYER DIES THREE TIMES END THE GAME AND DISPLAY SCORE
    if (lives.length === 0 || time === 0) {
        // noLoop();
        // clear();
        // background('#00bcd488');
        // textSize(58);
        // text('GAME OVER', 220, height / 2);
        // textSize(38);
        // text(`YOUR SCORE: ${cubesEated}`, 255, 270)
    }
}
/////////////////////////////////////////////////////////////////
//JUMP FUNCTION
function keyPressed() {
    if (keyCode === UP_ARROW) {
        jump = true;
    }
}
//CREATE CUBE EACH TIME THE SETTIMOUT FUNCTION CALL & INSERT TO ARRAY
function createGoodCube() {
    cube = new GoodCube(random(100, 700), height);
    cubesArray.push(cube);
}
//CREATE THE BAD CUBES
function createBadCube() {
    badCube = new BadCube(random(100, 700), height);
    badCubesArray.push(badCube);
}
//CREATE THE TIME COUNTER
function timeCount() {
    time = time - 1;
}

function Player(x, y) {
    //GENERAL SETTINGS
    this.pos = createVector(x, y);
    this.rightVel = createVector(0, 0);
    this.leftVel = createVector(0, 0);
    this.jumpAcc = createVector(0, 0);
    this.vel = createVector(0, 0);
    this.upVel = createVector(0, -15);
    this.size = 30;

    //APPLY GRAVITY ON PLAYER
    this.applyForce = function(gravity) {
            this.jumpAcc.add(gravity);
        }
        //JUMP
    this.jump = function() {
            this.upVel.add(this.jumpAcc);
            this.pos.add(this.upVel);
            this.jumpAcc.mult(0);
        }
        // RESET PLAYER UP VEL AFTER JUMP
    this.update = function() {
            this.pos.y = this.pos.y - 1;
            this.upVel = createVector(0, -15);
        }
        //MOVE RIGHT
    this.moveRight = function() {
            this.acc = createVector(0.8, 0);
            this.rightVel.add(this.acc);
            this.rightVel.limit(10, 0);
            this.pos.add(this.rightVel);
        }
        //MOVE LEFT
    this.moveLeft = function() {
            this.acc = createVector(-0.8, 0);
            this.leftVel.add(this.acc);
            this.leftVel.limit(10, 0);
            this.pos.add(this.leftVel);
        }
        //VISUALS OF PLAYER
    this.show = function() {
        fill('#fbd46d');
        rect(this.pos.x, this.pos.y, this.size, this.size);
    }
}

function GoodCube(x, y) {
    //GENERAL SETTINGS
    this.random = random(-5, -12);
    this.pos = createVector(x, y);
    this.vel = createVector(0, this.random);
    this.acc = createVector(0, 0);
    this.size = 20;
    this.color = '#eeeeee';
    //APPLY GRAVITY ON CUBES
    this.applyForce = function(force) {
            this.acc.add(force);
        }
        //MAKE CUBES JUMP UP AND DOWN
    this.update = function() {
            this.vel.add(this.acc);
            this.pos.add(this.vel);
            this.acc.mult(0);
        }
        //VISUALS OF CUBES
    this.show = function() {
            fill(this.color);
            rect(this.pos.x, this.pos.y, this.size, this.size);
        }
        //CHECK COLLUSION FUNCTION
    this.checkCollusion = function(player) {
        if (this.pos.x >= player.pos.x && this.pos.x <= player.pos.x + player.size &&
            this.pos.y >= player.pos.y && this.pos.y <= player.pos.y + player.size ||
            this.pos.x + this.size >= player.pos.x && this.pos.x + this.size <= player.pos.x + player.size &&
            this.pos.y + this.size <= player.pos.y + player.size && this.pos.y >= player.pos.y) {
            return true;
        } else {
            return false;
        }
    }
}

function BadCube(x, y) {
    this.random = random(-5, -12);
    this.pos = createVector(x, y);
    this.vel = createVector(0, this.random);
    this.acc = createVector(0, 0);
    this.size = 20;
    this.color = '#fc5185';
    //APPLY GRAVITY ON CUBES
    this.applyForce = function(force) {
            this.acc.add(force);
        }
        //MAKE CUBES JUMP UP AND DOWN
    this.update = function() {
        this.vel.add(this.acc);
        this.pos.add(this.vel);
        this.acc.mult(0);
    }
    this.show = function() {
            fill(this.color);
            rect(this.pos.x, this.pos.y, this.size, this.size);
        }
        //CHECK COLLUSION FUNCTION
    this.checkCollusion = function(player) {
        if (this.pos.x >= player.pos.x && this.pos.x <= player.pos.x + player.size &&
            this.pos.y >= player.pos.y && this.pos.y <= player.pos.y + player.size ||
            this.pos.x + this.size >= player.pos.x && this.pos.x + this.size <= player.pos.x + player.size &&
            this.pos.y + this.size <= player.pos.y + player.size && this.pos.y >= player.pos.y) {
            return true;
        } else {
            return false;
        }
    }
}

function Platform(x, y, w, h) {
    this.pos = createVector(x, y);
    this.width = w;
    this.height = h;

    this.show = () => {
        fill(50);
        rect(this.pos.x, this.pos.y, this.width, this.height);
    }
}

function Live(x, y) {
    this.x = x;
    this.y = y;
    this.size = 15;
    this.color = '#fbd46d';

    this.display = function() {
        fill(this.color);
        rect(this.x, this.y, this.size, this.size);
    }
}