Presice overlap

[SteppingRazor]

Hi,

I'm making a chess prototype. I'm having trouble with overlap. To make it simple, first I wanted to display a board and a pawn outside the board. The pawn is drag able. I wanted to achieve something like this: if the pawn is dragged on (so in other words if it overlaps) tile number 1 it will stay on this position, if not it will go back to the original position. It kinda works. But the problem is it accepts also the position slightly outside of a tile. How can I make this work properly? Also how (in elegant way) can I put the pawn into the center of the tile when the pawn overlaps the tile.

 

Code snippet:

onDraggingStart = (sprite: Phaser.Sprite, pointer: Phaser.Pointer) => {        this.game.canvas.style.cursor = "grabbing";        this.savePosition();    }onDraggingStop = (sprite: Phaser.Sprite, pointer: Phaser.Pointer) => {        this.game.canvas.style.cursor = "grab";        if (!this.checkOverlap(sprite, this.board.children[0])) {            this.position.x = this.positionX; // it does not overlap -> go back to the original x            this.position.y = this.positionY; // go back to the original y        }    }// the problem is with this functioncheckOverlap = (spriteA, spriteB) => {        var boundsA = spriteA.getBounds();        var boundsB = spriteB.getBounds();        return Phaser.Rectangle.intersects(boundsA, boundsB);}

Here is the screen shot of the original position:

http://imgur.com/3pppLjC

And accepted (but wrong) position:

http://imgur.com/SL0PyZ0

 

EDIT:

OK, I found how can i center the sprite after release. It can be done by this line of code:

this.input.enableSnap(64, 64, false, true, 7.5, 5);

But still, I'm looking for an answer how to get more precise overlap. How can I accept changing position only if whole pawn is released inside the tile, not just piece of it?

Edited December 19, 2015 by SteppingRazor

[Gyutang]

How about boundsA.containsRect(boundsB) instead of intersects?

[SteppingRazor]

Works like charm, thanks.