Помогите с созданием коллизии

[Arr0w_]

Здресте, у меня есть что-то похожее на платформер, нужно сдлеать коллизию игрока с платформами.

function Game(window) {
    var width = window.innerWidth - 20;
    var height = window.innerHeight - 20;

    var canvas = document.getElementById("game")
    canvas.setAttribute("width", width+"px")
    canvas.setAttribute("height", height+"px")
    var context = canvas.getContext("2d");

    var player = new Player();
    var platforms = new Platforms();

    this.draw = function() {
//        console.log('Game.draw:');
	context.clearRect(0, 0, width, height)
        platforms.draw(context);
        player.draw(context);
    }

    function on_tick(obj) {
        var player_changed = player.on_tick();
            obj.draw();
    }

    this.start = function() {
        platforms.load();
        this.timer_id = setInterval(on_tick, 10, this);
        this.draw();
    }

    window.onkeyup = function(event) {
//        console.log('Game.on_key_up:', event.key);
        if (event.key == 'ArrowRight') {
            player.stop();
        }
        if (event.key == 'ArrowLeft') {
            player.stop();
        }
        if(event.key == 'ArrowUp'){
            player.stop();
        }
        return false;
    }
    
    window.onkeydown = function(event) {
//        console.log('Game.on_key_down:', event.key);
        if (event.key == 'ArrowRight') {
            player.start_normal();
        }
        if (event.key == 'ArrowLeft') {
            player.start_reverse();
        }
        if(event.key == 'ArrowUp'){
            player.start_up();
        }
        return false;
    }
}

function Brick(width, height, src) {
    this.width = width;
    this.height = height;
    this.image = new Image(width, height);
    this.image.src = src
}

function Platforms() {
    var data = [];
    var objects = { 'brick' : new Brick(20, 20, 'images/brick.png')};
    
    this.draw = function(context) {
//        console.log('Platforms.draw:');
        for(i=0; i<data.length; i++) {
            var platform = data[i];
//            console.log('platform:', platform);
            var p_object = objects[platform.type];
	    var x_start = platform.x;
	    var y_start = platform.y;
	    var x_number = platform.width / p_object.width;
	    var y_number = platform.height / p_object.height;
//
	    for(k=0; k<x_number; k++) {
		for(l=0; l<y_number; l++) {
		    context.drawImage(p_object.image, x_start + p_object.width * k, y_start + p_object.height * l, p_object.width, p_object.height);
		}
	    }
        }
    }

    this.load = function() {
        data = [
	    {x: 50, y: 450, width: 1000, height: 10, type: "brick", shm: false},
	    {x: 200, y: 350, width: 100, height: 10, type: "brick", shm: false}
        ];
    }
}

function Player() {
    var width = 24;
    var height = 40;
    var x = 0.0;
    var y = 0.0;
    var reverse = false;
    var velocity_x = 5.0;
    var velocity_y = 0.0;
    var runned = false;
    var fly = false;
    var jump =false;
    var setting_jump=0;
    var on_jump = false;
//
    var image_normal = new Image(width, height);
    image_normal.src = 'images/hero_normal.png';
//
    var image_reverse = new Image(width, height);
    image_reverse.src = 'images/hero_reverse.png';

    this.draw = function(context) {
//        console.log('Player.draw:');
        image = reverse ? image_reverse : image_normal;
	context.drawImage(image, x, y, width, height);
    }

    this.on_tick = function() {
        var changed = false;
        if (runned) {
            var old_x = Math.round(x);
            var old_y = Math.round(y);
            var v_x = reverse ? -velocity_x : velocity_x;
            var v_y = reverse ? -velocity_y : velocity_y;
            x += v_x; y += v_y;
//        console.log('old_x:', old_x, 'old_y:', old_y, 'x:', Math.round(x), 'y:', Math.round(y));
            if ((Math.round(x) != old_x) || (Math.round(y) != old_y)) {
                changed = true;
            }
        }
        if(fly){
            y+=4;
        }
        if (x>=50&&x<=1050&&y>=410&&y<=420) { //затычка
            fly=false;
        }
        else{
            fly=true;
        }
        if (jump||on_jump) {
            setting_jump+=1;
            on_jump=true;
        }
        if (setting_jump>0) {
            y-=10;
            setting_jump+=1;
            if(setting_jump>40){
                setting_jump=0;
                jump=false;
                on_jump=false;
            }

        }

        
        return changed;
    }
    
    this.start_normal = function() {
        reverse = false;
        runned = true;
    }

    this.start_reverse = function() {
        reverse = true;
        runned = true;
    }

    this.stop = function() {
        runned = false;
        jump = false;
    }
    this.start_up = function()
    {
        if(x>=50&&x<=1050&&y>=410&&y<=420){
        jump=true
        }
    }

    /*this.colision=function{
        for(int i=0;i<this.platforms..length;i++)
        if()
    }*/

}

PS. До этого она была сделана так

var resultforloop = false;
	for(i=0;i<this.platforms[level].length;i++) {
		if(this.detectCollision(player, this.platforms[level][i])) {
			resultforloop = true;
			player.collided = true;
			
			if(player.y + player.height - this.platforms[level][i].y < 10) {
				if(this.platforms[level][i].shm == true) {
						if(this.platforms[level][i].shm_info.shm_in == "x") {
						if(this.platforms[level][i].shm_info.moving_positive == true) player.x  += 0.5;
						else player.x  -= 0.5;

Но препод заставил переписать код.
Сессия через 2 недели хз что делать.