Skip to content

Commit

Permalink
Update all metatiles to add the top ladder image
Browse files Browse the repository at this point in the history
Fix problem with ladder
  • Loading branch information
DblK committed Mar 29, 2013
1 parent b786bc9 commit ec15bf7
Show file tree
Hide file tree
Showing 7 changed files with 77 additions and 66 deletions.
1 change: 1 addition & 0 deletions media/metatiles.txt
Original file line number Diff line number Diff line change
Expand Up @@ -7,4 +7,5 @@ type, platform : can jump through it, and walk on it
type, lslope : slope tile, bottom left to top right
type, rslope : slope tile, top right to bottom left
type, ladder : ladder tile, can be climb
type, topladder : ladder top tile, can be climb and walk on top of it
type, breakable : breakable tile
Binary file modified media/metatiles16x16.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified media/metatiles32x32.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified media/metatiles64x64.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
126 changes: 68 additions & 58 deletions src/entity/entity.js
Original file line number Diff line number Diff line change
Expand Up @@ -487,6 +487,14 @@
* @name me.ObjectEntity#onladder
*/
this.onladder = false;
/**
* equal true if the entity can go down on a ladder<br>
* (!) READ ONLY property

This comment has been minimized.

Copy link
@parasyte

parasyte Mar 29, 2013

Please use @readonly here. That will mark the property as read-only in the JSDoc output. :D

* @public
* @type Boolean
* @name me.ObjectEntity#disableTopLadderCollision
*/
this.disableTopLadderCollision = false;

// to enable collision detection
this.collidable = settings.collidable || false;
Expand Down Expand Up @@ -659,6 +667,7 @@
if (this.onladder) {
this.vel.y = (up) ? -this.accel.x * me.timer.tick
: this.accel.x * me.timer.tick;
this.disableTopLadderCollision = !up;
return true;
}
return false;
Expand Down Expand Up @@ -847,85 +856,86 @@
updateMovement : function() {

this.computeVelocity(this.vel);

// Adjust position only on collidable object
if (this.collidable) {

This comment has been minimized.

Copy link
@parasyte

parasyte Mar 29, 2013

WOW! This was broken all this time? 😑

// check for collision
var collision = this.collisionMap.checkCollision(this.collisionBox, this.vel);

// check for collision
var collision = this.collisionMap.checkCollision(this.collisionBox, this.vel);

// update some flags
this.onslope = collision.yprop.isSlope || collision.xprop.isSlope;
// clear the ladder flag
this.onladder = false;

// update some flags
this.onslope = collision.yprop.isSlope || collision.xprop.isSlope;
// clear the ladder flag
this.onladder = false;


// y collision
if (collision.y) {

// going down, collision with the floor
this.onladder = collision.yprop.isLadder;
// y collision
if (collision.y) {
// going down, collision with the floor
this.onladder = collision.yprop.isLadder || collision.yprop.isTopLadder;

if (collision.y > 0) {
if (collision.yprop.isSolid || (collision.yprop.isPlatform && (this.collisionBox.bottom - 1 <= collision.ytile.pos.y))) {
// adjust position to the corresponding tile
this.pos.y = ~~this.pos.y;
this.vel.y = (this.falling) ?collision.ytile.pos.y - this.collisionBox.bottom: 0 ;
this.falling = false;
}
else if (collision.yprop.isSlope && !this.jumping) {
// we stop falling
this.checkSlope(collision.ytile, collision.yprop.isLeftSlope);
this.falling = false;
}
else if (collision.yprop.isBreakable) {
if (this.canBreakTile) {
// remove the tile
me.game.currentLevel.clearTile(collision.ytile.col, collision.ytile.row);
if (this.onTileBreak)
this.onTileBreak();
}
else {
if (collision.y > 0) {
if (collision.yprop.isSolid || (collision.yprop.isPlatform && (this.collisionBox.bottom - 1 <= collision.ytile.pos.y)) || (collision.yprop.isTopLadder && !this.disableTopLadderCollision)) {

This comment has been minimized.

Copy link
@parasyte

parasyte Mar 29, 2013

This line is getting too long. I would suggest breaking it into multiple lines.

// adjust position to the corresponding tile
this.pos.y = ~~this.pos.y;
this.vel.y = (this.falling) ?collision.ytile.pos.y - this.collisionBox.bottom: 0;
this.vel.y = (this.falling) ?collision.ytile.pos.y - this.collisionBox.bottom: 0 ;
this.falling = false;
}
else if (collision.yprop.isSlope && !this.jumping) {
// we stop falling
this.checkSlope(collision.ytile, collision.yprop.isLeftSlope);
this.falling = false;
}
else if (collision.yprop.isBreakable) {
if (this.canBreakTile) {
// remove the tile
me.game.currentLevel.clearTile(collision.ytile.col, collision.ytile.row);
if (this.onTileBreak)
this.onTileBreak();
}
else {
// adjust position to the corresponding tile
this.pos.y = ~~this.pos.y;
this.vel.y = (this.falling) ?collision.ytile.pos.y - this.collisionBox.bottom: 0;
this.falling = false;
}
}
}
}
// going up, collision with ceiling
else if (collision.y < 0) {
if (!collision.yprop.isPlatform && !collision.yprop.isLadder) {
this.falling = true;
// cancel the y velocity
this.vel.y = 0;
// going up, collision with ceiling
else if (collision.y < 0) {
if (!collision.yprop.isPlatform && !collision.yprop.isLadder && !collision.yprop.isTopLadder) {
this.falling = true;
// cancel the y velocity
this.vel.y = 0;
}
}
}
}

// x collision
if (collision.x) {
// x collision
if (collision.x) {

this.onladder = collision.xprop.isLadder ;
this.onladder = collision.xprop.isLadder || collision.yprop.isTopLadder;

if (collision.xprop.isSlope && !this.jumping) {
this.checkSlope(collision.xtile, collision.xprop.isLeftSlope);
this.falling = false;
} else {
// can walk through the platform & ladder
if (!collision.xprop.isPlatform && !collision.xprop.isLadder) {
if (collision.xprop.isBreakable && this.canBreakTile) {
// remove the tile
me.game.currentLevel.clearTile(collision.xtile.col, collision.xtile.row);
if (this.onTileBreak) {
this.onTileBreak();
if (collision.xprop.isSlope && !this.jumping) {
this.checkSlope(collision.xtile, collision.xprop.isLeftSlope);
this.falling = false;
} else {
// can walk through the platform & ladder
if (!collision.xprop.isPlatform && !collision.xprop.isLadder && !collision.xprop.isTopLadder) {
if (collision.xprop.isBreakable && this.canBreakTile) {
// remove the tile
me.game.currentLevel.clearTile(collision.xtile.col, collision.xtile.row);
if (this.onTileBreak) {
this.onTileBreak();
}
} else {
this.vel.x = 0;
}
} else {
this.vel.x = 0;
}
}
}
}


// update player position
this.pos.add(this.vel);

Expand Down
14 changes: 6 additions & 8 deletions src/level/TMXLayer.js
Original file line number Diff line number Diff line change
Expand Up @@ -669,17 +669,15 @@

// check for y movement
// left, y corner
if ( pv.y != 0 ) {
res.ytile = this.getTile((pv.x < 0) ? ~~obj.left : Math.ceil(obj.right - 1), y);
res.ytile = this.getTile((pv.x < 0) ? ~~obj.left : Math.ceil(obj.right - 1), y);
if (res.ytile && this.tileset.isTileCollidable(res.ytile.tileId)) {
res.y = pv.y || 1;
res.yprop = this.tileset.getTileProperties(res.ytile.tileId);
} else { // right, y corner
res.ytile = this.getTile((pv.x < 0) ? Math.ceil(obj.right - 1) : ~~obj.left, y);
if (res.ytile && this.tileset.isTileCollidable(res.ytile.tileId)) {
res.y = pv.y || 1;
res.yprop = this.tileset.getTileProperties(res.ytile.tileId);
} else { // right, y corner
res.ytile = this.getTile((pv.x < 0) ? Math.ceil(obj.right - 1) : ~~obj.left, y);
if (res.ytile && this.tileset.isTileCollidable(res.ytile.tileId)) {
res.y = pv.y || 1;
res.yprop = this.tileset.getTileProperties(res.ytile.tileId);
}
}
}
// return the collide object
Expand Down
2 changes: 2 additions & 0 deletions src/level/TMXTileset.js
Original file line number Diff line number Diff line change
Expand Up @@ -108,6 +108,7 @@
L_SLOPE : "lslope",
R_SLOPE : "rslope",
LADDER : "ladder",
TOPLADDER : "topladder",
BREAKABLE : "breakable"
},

Expand Down Expand Up @@ -268,6 +269,7 @@
prop.isRightSlope = prop.type ? prop.type.toLowerCase() === this.type.R_SLOPE : false;
prop.isBreakable = prop.type ? prop.type.toLowerCase() === this.type.BREAKABLE : false;
prop.isLadder = prop.type ? prop.type.toLowerCase() === this.type.LADDER : false;
prop.isTopLadder = prop.type ? prop.type.toLowerCase() === this.type.TOPLADDER : false;
prop.isSlope = prop.isLeftSlope || prop.isRightSlope;

// ensure the collidable flag is correct
Expand Down

4 comments on commit ec15bf7

@melonjs
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thank you very very much, and using "?w=1", the commit is much more clear :)

Just one last question, why did you remove the test on '(pv.y != 0)' in TMXLayer ?
If y === 0, the following code will be executed for nothing ?

I can't wait now to see xrick2 running in my browser :)

@melonjs
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@parasyte (+1)

@DblK
Copy link
Owner Author

@DblK DblK commented on ec15bf7 Mar 29, 2013

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

After a deep analysis on the and other issue that I would like to work on, it seems to be related to my game and the collision detection system.
It solved my problem (I'm in the case of melonjs#50) with my tile but as suggested in issue melonjs#169, melonjs#103, melonjs#50 & melonjs#16, the collision detection system should be rewritten to take care as you suggest the collision rectangle box instead of only some point.
In conclusion just leave the two lines from TMXLayer that I deleted until someone (maybe me, who knows) will rewrite the collision process.

If you have any suggestion between the four issues I listed to do the fix, I'd like to read it and I will try to implement it.

@melonjs
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Well I have to catch a fight right now, but quickly and for tile based collision, what I had in mind was either rewriting it using chipmunk (not to name it) as each square can anyway be "converted" , OR used a better SAT approach, as nicely explained in the following article :

http://www.wildbunny.co.uk/blog/2011/12/14/how-to-make-a-2d-platform-game-part-2-collision-detection/

But ultimately I guess a combination of the two would probably be the best with chipmunk being optional through a plugin (still under discussion)

Please sign in to comment.