Jump to content

  • Log In with Google      Sign In   
  • Create Account


#Actualhdnine

Posted 22 October 2012 - 05:16 AM

The demo can be tested here (it also has a syntax highlighter)
http://www.wonderwor...y-and-friction/

Hey everyone,

I've yet again started a small game project where immediately i got stuck on the same subject as before, collision detection. I know that i'm not that good at math so i went with the approach i assumed as being correct. That is testing the player object against all tile objects on screen to see if there is a collision:

The syntax highlighter went mad on me so i pasted the code as text instead (it can however be viewed at the link above)

// If moving up
for(var index in Level.currentLayout) {
var obj = Level.currentLayout[index];

if(87 in Game.keys || Player.vel.y < 0 || Player.airborn) {
if(((Player.right >= obj.left && Player.right <= obj.right) || (Player.left <= obj.right && Player.left >= obj.left)) && (Player.top - distance >= obj.top && Player.top - distance <= obj.bottom)) {
Player.pos.y = obj.bottom + 1;
Player.collision.top = true;
break;
} else {
Player.collision.top = false;
}
}
}
// If moving left
for(var index in Level.currentLayout) {
var obj = Level.currentLayout[index];

if(65 in Game.keys || Player.vel.x < 0) {
if((Player.left - distance <= obj.right && Player.left - distance >= obj.left) && ((Player.bottom >= obj.top && Player.bottom <= obj.bottom) || (Player.top >= obj.top && Player.top <= obj.bottom))) {
Player.vel.x *= -1;
Player.collision.left = true;
break;
} else {
Player.collision.left = false;
}
}
}
// If moving down
for(var index in Level.currentLayout) {
var obj = Level.currentLayout[index];

if(((Player.right >= obj.left && Player.right <= obj.right) || (Player.left <= obj.right && Player.left >= obj.left)) && (Player.bottom + distance >= obj.top && Player.bottom + distance <= obj.bottom)) {
Player.pos.y = obj.top - Player.height - 1;
Player.collision.bottom = true;
Player.airborn = false;
break;
} else {
Player.collision.bottom = false;
Player.airborn = true;
}
}
// If moving right
for(var index in Level.currentLayout) {
var obj = Level.currentLayout[index];

if(68 in Game.keys || Player.vel.x > 0) {
if((Player.right + distance >= obj.left && Player.right + distance <= obj.right) && ((Player.bottom >= obj.top && Player.bottom <= obj.bottom) || (Player.top >= obj.top && Player.top <= obj.bottom))) {
Player.vel.x *= -1;
Player.collision.right = true;
break;
} else {
Player.collision.right = false;
}
}
}

It kinda works but i keep having this feeling that the code is just too complicated for a tile based 2D platform game, or, simply that it's badly written? Without physics it works really well but with it i get stuck on edges between tiles and on tiles. Alos, the gravity seems too slow but if i increase it, other things like the jumping starts to act up so i in turn have to increase that to compensate and all of a sudden everything gets messed up.

I have some code that generates the level tiles and displays them on canvas which works nicely. The problem is somewhere with the collision detection and since my math really suck, i have been reading and reading about different approaches and i just don't understand most of them.

I would really appreciate if someone could give me some input on a more correct way to handle this, preferably with example code or demo pages. Thanks a bunch!

Also: please add Javascript/Canvas to the Topic Prefix ^^

#2hdnine

Posted 22 October 2012 - 05:15 AM

The demo can be tested here (it also has a syntax highlighter)
http://www.wonderwor...y-and-friction/

Hey everyone,

I've yet again started a small game project where immediately i got stuck on the same subject as before, collision detection. I know that i'm not that good at math so i went with the approach i assumed as being correct. That is testing the player object against all tile objects on screen to see if there is a collision:

The syntax highlighter went mad on me so i pasted the code as text instead (it can however be viewed at the link above)

[source lang="jscript"]// If moving upfor(var index in Level.currentLayout) { var obj = Level.currentLayout[index]; if(87 in Game.keys || Player.vel.y < 0 || Player.airborn) { if(((Player.right >= obj.left && Player.right <= obj.right) || (Player.left <= obj.right && Player.left >= obj.left)) && (Player.top - distance >= obj.top && Player.top - distance <= obj.bottom)) { Player.pos.y = obj.bottom + 1; Player.collision.top = true; break; } else { Player.collision.top = false; } }}// If moving leftfor(var index in Level.currentLayout) { var obj = Level.currentLayout[index]; if(65 in Game.keys || Player.vel.x < 0) { if((Player.left - distance <= obj.right && Player.left - distance >= obj.left) && ((Player.bottom >= obj.top && Player.bottom <= obj.bottom) || (Player.top >= obj.top && Player.top <= obj.bottom))) { Player.vel.x *= -1; Player.collision.left = true; break; } else { Player.collision.left = false; } }}// If moving downfor(var index in Level.currentLayout) { var obj = Level.currentLayout[index]; if(((Player.right >= obj.left && Player.right <= obj.right) || (Player.left <= obj.right && Player.left >= obj.left)) && (Player.bottom + distance >= obj.top && Player.bottom + distance <= obj.bottom)) { Player.pos.y = obj.top - Player.height - 1; Player.collision.bottom = true; Player.airborn = false; break; } else { Player.collision.bottom = false; Player.airborn = true; }}// If moving rightfor(var index in Level.currentLayout) { var obj = Level.currentLayout[index]; if(68 in Game.keys || Player.vel.x > 0) { if((Player.right + distance >= obj.left && Player.right + distance <= obj.right) && ((Player.bottom >= obj.top && Player.bottom <= obj.bottom) || (Player.top >= obj.top && Player.top <= obj.bottom))) { Player.vel.x *= -1; Player.collision.right = true; break; } else { Player.collision.right = false; } }}[/source]

It kinda works but i keep having this feeling that the code is just too complicated for a tile based 2D platform game, or, simply that it's badly written? Without physics it works really well but with it i get stuck on edges between tiles and on tiles. Alos, the gravity seems too slow but if i increase it, other things like the jumping starts to act up so i in turn have to increase that to compensate and all of a sudden everything gets messed up.

I have some code that generates the level tiles and displays them on canvas which works nicely. The problem is somewhere with the collision detection and since my math really suck, i have been reading and reading about different approaches and i just don't understand most of them.

I would really appreciate if someone could give me some input on a more correct way to handle this, preferably with example code or demo pages. Thanks a bunch!

Also: please add Javascript/Canvas to the Topic Prefix ^^

#1hdnine

Posted 22 October 2012 - 05:14 AM

The demo can be tested here (it also has a syntax highlighter)
http://www.wonderwor...y-and-friction/

Hey everyone,

I've yet again started a small game project where immediately i got stuck on the same subject as before, collision detection. I know that i'm not that good at math so i went with the approach i assumed as being correct. That is testing the player object against all tile objects on screen to see if there is a collision:

The syntax highlighter went mad on me so i pasted the code as text instead (it can however be viewed at the link above)

// If moving up
for(var index in Level.currentLayout) {
var obj = Level.currentLayout[index];

if(87 in Game.keys || Player.vel.y < 0 || Player.airborn) {
if(((Player.right >= obj.left && Player.right <= obj.right) || (Player.left <= obj.right && Player.left >= obj.left)) && (Player.top - distance >= obj.top && Player.top - distance <= obj.bottom)) {
Player.pos.y = obj.bottom + 1;
Player.collision.top = true;
break;
} else {
Player.collision.top = false;
}
}
}
// If moving left
for(var index in Level.currentLayout) {
var obj = Level.currentLayout[index];

if(65 in Game.keys || Player.vel.x < 0) {
if((Player.left - distance <= obj.right && Player.left - distance >= obj.left) && ((Player.bottom >= obj.top && Player.bottom <= obj.bottom) || (Player.top >= obj.top && Player.top <= obj.bottom))) {
Player.vel.x *= -1;
Player.collision.left = true;
break;
} else {
Player.collision.left = false;
}
}
}
// If moving down
for(var index in Level.currentLayout) {
var obj = Level.currentLayout[index];

if(((Player.right >= obj.left && Player.right <= obj.right) || (Player.left <= obj.right && Player.left >= obj.left)) && (Player.bottom + distance >= obj.top && Player.bottom + distance <= obj.bottom)) {
Player.pos.y = obj.top - Player.height - 1;
Player.collision.bottom = true;
Player.airborn = false;
break;
} else {
Player.collision.bottom = false;
Player.airborn = true;
}
}
// If moving right
for(var index in Level.currentLayout) {
var obj = Level.currentLayout[index];

if(68 in Game.keys || Player.vel.x > 0) {
if((Player.right + distance >= obj.left && Player.right + distance <= obj.right) && ((Player.bottom >= obj.top && Player.bottom <= obj.bottom) || (Player.top >= obj.top && Player.top <= obj.bottom))) {
Player.vel.x *= -1;
Player.collision.right = true;
break;
} else {
Player.collision.right = false;
}
}
}

It kinda works but i keep having this feeling that the code is just too complicated for a tile based 2D platform game, or, simply that it's badly written? Without physics it works really well but with it i get stuck on edges between tiles and on tiles. Alos, the gravity seems too slow but if i increase it, other things like the jumping starts to act up so i in turn have to increase that to compensate and all of a sudden everything gets messed up.

I have some code that generates the level tiles and displays them on canvas which works nicely. The problem is somewhere with the collision detection and since my math really suck, i have been reading and reading about different approaches and i just don't understand most of them.

I would really appreciate if someone could give me some input on a more correct way to handle this, preferably with example code or demo pages. Thanks a bunch!

Also: please add Javascript/Canvas to the Topic Prefix ^^

PARTNERS