phys

var COMPONENT_IDS = 0;

function component(width, height, color, x, y, type) {
    this.type = type;
    this.id = COMPONENT_IDS++;
    this.CollidingWithColletion = {};
    this.score = 0;
    this.width = width;
    this.height = height;
    this.speedX = 0;
    this.speedY = 0;
    this.x = x;
    this.oldx = this.x;
    this.oldy = this.y;
    this.clip = true;
    this.y = y;
    this.gravity = 0;
    this.update = function () {
        ctx = myGameArea.context;
        if (this.type == "text") {
            ctx.font = this.width + " " + this.height;
            ctx.fillStyle = color;
            ctx.fillText(this.text, this.x, this.y);
        } else {
            ctx.fillStyle = color;
            ctx.fillRect(this.x, this.y, this.width, this.height);
        }
    }
    this.logic = function () {}
    this.newPos = function () {
        //this.gravitySpeed += this.gravity;
        this.oldx = this.x;
        this.oldy = this.y;
        this.x += this.speedX;
        this.y += this.speedY;
        this.hitBoundaries();
    }
    this.hitBoundaries = function () {
        var maxy = myGameArea.canvas.height - this.height;
        var maxx = myGameArea.canvas.width - this.width;
        var miny = 0
        var minx = 0
        if (this.y > maxy) {
            this.y = maxy;
            this.speedY = 0;
        } else if (this.y < miny) {
            this.y = miny
            this.speedY = 0;

            //if this would be object collision force needs to be applied to object
            //objects can have deceleration variable that multiplies plr speed 0 is rigid unmovable 0.5 slows, 2 is slippery
        }
        if (this.x > maxx) {
            this.x = maxx;
            this.speedX = 0;
        } else if (this.x < minx) {
            this.x = minx
            this.speedX = 0;
            //if this would be object collision force needs to be applied to object
            //objects can have deceleration variable that multiplies plr speed 0 is rigid unmovable 0.5 slows, 2 is slippery
        }


    }
    this.crashWith = function (otherobj) {
        // make direction of movement remove uncertainty if speed is large so object overshoots
        let goingDown = this.speedY > 0
        let goingUp = this.speedY < 0
        let goingRight = this.speedX > 0
        let goingLeft = this.speedX < 0

        const o = otherobj;
        const myx = this.x;
        const myy = this.y;
        const ox = o.x;
        const oy = o.y;
        const myoldleft = this.oldx;
        const myoldright = this.oldx + (this.width);
        const myoldtop = this.oldy;
        const myoldbottom = this.oldy + (this.width);
        const myleft = this.x;
        const myright = this.x + (this.width);
        const mytop = this.y;
        const mybottom = this.y + (this.height);
        const moldy = this.oldy;

        const otherleft = o.x;
        const otherright = o.x + (o.width);
        const othertop = o.y;
        const otherbottom = o.y + (o.height);
        crash = true;

        let fromTop = (mybottom < othertop)
        let fromBottom = (mytop > otherbottom)
        let fromRight = (myright < otherleft)
        let fromLeft = (myleft > otherright)

        let wasfromTop = (myoldbottom < othertop)
        let wasfromBottom = (myoldtop > otherbottom)
        let wasfromRight = (myoldright < otherleft)
        let wasfromLeft = (myoldleft > otherright)


        // what if object spped is so large that next calculated position is over this constraints?
        let colTop = wasfromTop && goingDown && !fromTop && !fromRight && !fromLeft
        if (colTop) {
            console.log('top')
            this.speedY = 0
        }
        let colBottom = (mytop > otherbottom)
        let colRight = (myright < otherleft)
        let colLeft = (myleft > otherright)


        if (!fromTop || !fromBottom || !fromRight || !fromLeft) {
            crash = false;
            document.body.style.backgroundColor = ""

        } else {

            crash = true;
            this.CollidingWithColletion[otherobj.id] = otherobj
            document.body.style.backgroundColor = "blue"
        }
        bubu.innerText = JSON.stringify({
            moldy,
            myoldbottom,
            wasfromTop,
            goingDown,
            colTop,
            fromBottom,
            fromTop,
            fromLeft,
            fromRight
        }, null, 2)
        return crash;
    }
    this.crashReaction = function (otherobj) {}
}