El sistema de detección de colisiones de Javascript no ignora las colisiones bloqueadas
Tengo problemas durante el desarrollo de un minijuego usandoEaselJS con mi sistema de detección de colisiones y necesito la ayuda de alguien. El problema ocurre cuando el héroe (un mapa de bits circular) colisiona con un objeto y hay otro objeto detrás del primero, el héroe choca con ambos objetos, incluso si la segunda colisión está bloqueada. Aquí hay una explicación de la imagen:
La causa del problema es realmente simple, incluso si el problema en sí no lo es:
Este sistema de detección de colisión se basa en la posición futura del círculo (y no en su posición real), luego, si la siguiente posición del círculo se cruza con un rectángulo, rebotará. El problema es que, si la posición futura intersecta dos rectángulos, el círculo rebotará en ambos rectángulos, incluso si el movimiento real del círculo está bloqueado por otro rectángulo y no puede alcanzar el segundo.
Actualizar: Tenga en cuenta que este problema solo ocurre cuando se mantiene presionada la flecha hacia arriba debido al orden de creación de rect.
Aquí está el código de JavaScript relevante:
rects.forEach(function (rect) { // Affect all rects
// Collision detection:
// (This MUST BE after every change in xvel/yvel)
// Next circle position calculation:
var nextposx = circle.x + event.delta / 1000 * xvel * 20,
nextposy = circle.y + event.delta / 1000 * yvel * 20;
// Collision between objects (Rect and Circle):
if (nextposy + height(circle) > rect.y &&
nextposx + width(circle) > rect.x &&
nextposx < rect.x + rect.width &&
nextposy < rect.y + rect.height) {
if (circle.y + height(circle) < rect.y) {
cls("top");
}
if (circle.x + width(circle) < rect.x) {
cls("left");
}
if (circle.x > rect.x + rect.width) {
cls("right");
}
if (circle.y > rect.y + rect.height) {
cls("bottom");
}
}
// Stage collision:
if (nextposy < 0) { // Collided with TOP of stage. Trust me.
cls("bottom"); // Inverted collision side is proposital!
}
if (nextposx < 0) {
cls("right");
}
if (nextposx + width(circle) > stage.canvas.width) {
cls("left");
}
if (nextposy + height(circle) > stage.canvas.height) {
cls("top");
}
});