platforms.forEach((platform) => {
if (
player.position.y + player.height <= platform.position.y &&
player.position.y + player.height + player.velocity.y >= platform.position.y &&
player.position.x + player.width >= platform.position.x &&
player.position.x <= platform.position.x + platform.width
){
player.velocity.y = 0
console.log("stop")
}
})

This is the platforms collisions. This detects where the player is if their position is touching the platform. This makes it so the player can stand on the platform while being able to go underneath it.

class Platform {
constructor({ x, y }) {
this.position = {
x,
y
}
this.width = 200
this.height = 20
}
draw() {
c.fillStyle = "blue"
c.fillRect(this.position.x, this.position.y, this.width, this.height)
}
}
const platforms = [
new Platform({
x: 200,
y:100,
}), new Platform({
x: 500,
y: 200,
}), new Platform({
x: -1,
y: 416,
}), new Platform({
x: 899,
y: 416,
})
]

This is the platform class. This defines a platform and raws them on the canvas. The constant "platforms" makes it so I can add new platforms