Ok, I got it working with the array. I hardcoded the pixel width/height and it worked. Lesson learned, dont take anything for granted. So now I have this:
var tileW = settings.tileSize.width || settings.tileSize[0];
var tileH = settings.tileSize.height || settings.tileSize[1];
var TileMap = require('pixelbox/TileMap');
console.log(tileW)
var mario = {
x: 60,
y: 60,
w: tileW,
h: tileH
};
var link = {
x: 100,
y: 100,
w: tileW,
h: tileH
}
var flipH = "";
var flipV = "";
function AABBcollision(rect1, rect2) {
if (rect1.x < (rect2.x * 8) + (8) &&
rect1.x + rect1.w > (rect2.x * 8) &&
rect1.y < (rect2.y * 8) + (8) &&
rect1.y + rect1.h > (rect2.y * 8)) {
return true
}
}
var walls = []
var map = getMap("mymap");
draw(map,0,0)
//walls = [map.find(4)]
print(walls.length);
exports.update = function () {
if (btn.right) {
mario.x += 1;
flipH = "";
}
if (btn.left) {
mario.x -= 1;
flipH = "flipH";
}
if (btn.up) {
mario.y -= 1;
flipV = "";
}
if (btn.down) {
mario.y += 1;
flipV = "flipV";
}
cls();
draw(map,0,0)
walls = [...map.find(3)];
print(walls.length);
//print(walls[0].x, 60, 50 )
//print(walls[0].y, 70, 50 )
sprite(153, mario.x, mario.y, flipH, flipV);
sprite(142, link.x, link.y);
var i;
for (i = 0; i < walls.length; i++) {
if (AABBcollision(mario, walls[i])==true){
print("Hello, Mario", 12, 10);
if (btn.down) {
mario.y -= 0;
mario.y = mario.y - 1
}
if (btn.up) {
mario.y += 1;
}
if (btn.left) {
mario.x += 1;
}
if (btn.right) {
mario.x -= 1;
}
}
}
}
The problem now is I would like the character to be able to move smoothly along the wall when hold down down/left, down/right etc...
At this point it looks like the character is going slightly into the wall a little making it impossible to move. What would be the best way to keep that from happening?