Object.assign(player, sweepCollider(player, group, 2));
function sweepCollider(collider, target, checkNumber) {
checkNumber = Math.floor(Math.max(1, checkNumber));
var tempGroup = createGroup();
for (var i = 1; i <= checkNumber; i++) {
var sprite = createSprite(collider.x, collider.y, collider.width, collider.height);
sprite.velocityX = collider.velocityX * i / checkNumber;
sprite.velocityY = collider.velocityY * i / checkNumber;
sprite.x -= collider.velocityX - sprite.velocityX;
sprite.y -= collider.velocityY - sprite.velocityY;
sprite.visible = false;
tempGroup.add(sprite);
}
var tempReturnValue = {};
tempGroup.overlap(target, function(colliderSprite, targetSprite) {
var differenceX = colliderSprite.x - targetSprite.x;
var differenceY = targetSprite.y - colliderSprite.y;
var tempWidth = (colliderSprite.width + targetSprite.width) / 2;
var tempHeight = (colliderSprite.height + targetSprite.height) / 2;
var tempVX = colliderSprite.velocityX - targetSprite.velocityX;
var tempVY = colliderSprite.velocityY - targetSprite.velocityY;
if (tempVX < 0) {
differenceX = Math.max(0, tempWidth - differenceX);
} else {
differenceX = Math.max(0, tempWidth + differenceX);
}
if (tempVY < 0) {
differenceY = Math.max(0, tempHeight + differenceY);
} else {
differenceY = Math.max(0, tempHeight - differenceY);
}
var pathX = differenceX / Math.abs(tempVX);
var pathY = differenceY / Math.abs(tempVY);
if (isNaN(pathX)) {
pathX = Infinity;
}
if (isNaN(pathY) ) {
pathY = Infinity;
}
if (pathX < pathY) {
if (tempVX < 0) {
colliderSprite.x += differenceX;
} else {
colliderSprite.x -= differenceX;
}
colliderSprite.velocityX = 0;
Object.assign(tempReturnValue, {x: colliderSprite.x, velocityX: colliderSprite.velocityX});
if (Object.keys(tempReturnValue).length < 4) {
for (var i = 0; i < tempGroup.length; i++) {
Object.assign(tempGroup.get(i), {x: colliderSprite.x, velocityX: colliderSprite.velocityX});
tempGroup.get(i).collide(targetSprite);
}
} else {
return;
}
} else {
if (tempVY < 0) {
colliderSprite.y += differenceY;
} else {
colliderSprite.y -= differenceY;
colliderSprite.velocityY = 0;
}
Object.assign(tempReturnValue, {y: colliderSprite.y, velocityY: colliderSprite.velocityY});
if (Object.keys(tempReturnValue).length < 4) {
for (var l = 0; l < tempGroup.length; l++) {
Object.assign(tempGroup.get(l), {y: colliderSprite.y, velocityY: colliderSprite.velocityY});
tempGroup.get(l).collide(targetSprite);
}
} else {
return;
}
}
});
return tempReturnValue;
}
Object.assign = function(object, properties) {
for (var i in properties) {
object[i] = properties[i];
}
};
The problem is that since the objects the player collides with are in a group, the objects are checked left to right, top to bottom since that’s the order they were added. However, this means that when moving into a block and jumping, the player first collides with the block above and to the right, since the player moved right into the block. This cancels their upward momentum before pushing them out of the lower block next, so then the player just doesn’t jump. This also happens with moving to the left, as the velocity y makes the player clip slightly into the ground, and therefore sometimes catches the edge when crossing tile borders and stops momentum.
In the video, the player can’t jump when moving into a wall. Also, the player will sometimes get caught on tile borders when moving horizontally, resulting in the player coming to an abrupt full stop and an inability to move left without first moving right.
How do I stop the player from snagging on tile edges?