mirror of
https://github.com/photonstorm/phaser
synced 2025-02-17 06:28:30 +00:00
debug#renderShapeConvex fixed, fix in p2 physics body creation #446
This commit is contained in:
photonstorm
parent
1d3616f52c
commit
aac31bdaa4
4 changed files with 112 additions and 97 deletions
|
|
@ -1,5 +1,6 @@
|
|||
|
||||
var game = new Phaser.Game(800, 600, Phaser.AUTO, 'phaser-example', { preload: preload, create: create, update: update, render: render });
|
||||
// var game = new Phaser.Game(800, 600, Phaser.AUTO, 'phaser-example', { preload: preload, create: create, update: update, render: render });
|
||||
var game = new Phaser.Game(800, 600, Phaser.CANVAS, 'phaser-example', { preload: preload, create: create, update: update, render: render });
|
||||
|
||||
function preload() {
|
||||
|
||||
|
|
@ -36,6 +37,7 @@ function create() {
|
|||
cannon = game.add.sprite(50, 500, 'arrow');
|
||||
cannon.name = 'ship';
|
||||
cannon.physicsEnabled = true;
|
||||
cannon.body.setCircle(32);
|
||||
|
||||
playerGroup = game.physics.createCollisionGroup();
|
||||
bulletGroup = game.physics.createCollisionGroup();
|
||||
|
|
@ -129,4 +131,6 @@ function update() {
|
|||
|
||||
function render() {
|
||||
|
||||
game.debug.renderPhysicsBody(cannon.body);
|
||||
|
||||
}
|
||||
|
|
|
|||
|
|
@ -22,23 +22,25 @@ function create() {
|
|||
|
||||
game.stage.backgroundColor = '#2d2d2d';
|
||||
|
||||
map = game.add.tilemap('map');
|
||||
// map = game.add.tilemap('map');
|
||||
|
||||
map.addTilesetImage('ground_1x1');
|
||||
map.addTilesetImage('tiles2');
|
||||
// map.addTilesetImage('ground_1x1');
|
||||
// map.addTilesetImage('tiles2');
|
||||
|
||||
map.setCollisionBetween(1, 12);
|
||||
// map.setCollisionBetween(1, 12);
|
||||
|
||||
layer = map.createLayer('Tile Layer 1');
|
||||
// layer = map.createLayer('Tile Layer 1');
|
||||
|
||||
layer.resizeWorld();
|
||||
// layer.resizeWorld();
|
||||
|
||||
dump = map.generateCollisionData(layer);
|
||||
// dump = map.generateCollisionData(layer);
|
||||
|
||||
ship = game.add.sprite(200, 200, 'ship');
|
||||
ship.physicsEnabled = true;
|
||||
// We do this because our ship is shaped like a triangle, not a square :)
|
||||
ship.body.addPolygon({}, 29, 23 , 0, 23 , 14, 1);
|
||||
// ship.body.setCircle(32);
|
||||
// ship.body.setCircle(32, 20, 20);
|
||||
|
||||
game.camera.follow(ship);
|
||||
|
||||
|
|
@ -74,11 +76,11 @@ function update() {
|
|||
|
||||
function render() {
|
||||
|
||||
for (var i = 0, len = dump.length; i < len; i++)
|
||||
{
|
||||
// for (var i = 0, len = dump.length; i < len; i++)
|
||||
// {
|
||||
// game.debug.renderPhysicsBody(dump[i]);
|
||||
}
|
||||
// }
|
||||
|
||||
// game.debug.renderPhysicsBody(ship.body);
|
||||
game.debug.renderPhysicsBody(ship.body);
|
||||
|
||||
}
|
||||
|
|
|
|||
|
|
@ -872,8 +872,8 @@ Phaser.Physics.Body.prototype = {
|
|||
// Now process them into p2 values
|
||||
for (var p = 0; p < path.length; p++)
|
||||
{
|
||||
path[p][0] = this.px2p(path[p][0]);
|
||||
path[p][1] = this.px2p(path[p][1]);
|
||||
path[p][0] = this.px2pi(path[p][0]);
|
||||
path[p][1] = this.px2pi(path[p][1]);
|
||||
}
|
||||
|
||||
// console.log('addPolygon PATH POST');
|
||||
|
|
|
|||
|
|
@ -77,7 +77,7 @@ Phaser.Utils.Debug.prototype = {
|
|||
*/
|
||||
start: function (x, y, color, columnWidth) {
|
||||
|
||||
if (this.context == null)
|
||||
if (this.context === null)
|
||||
{
|
||||
return;
|
||||
}
|
||||
|
|
@ -122,7 +122,7 @@ Phaser.Utils.Debug.prototype = {
|
|||
*/
|
||||
line: function (text, x, y) {
|
||||
|
||||
if (this.context == null)
|
||||
if (this.context === null)
|
||||
{
|
||||
return;
|
||||
}
|
||||
|
|
@ -149,7 +149,7 @@ Phaser.Utils.Debug.prototype = {
|
|||
*/
|
||||
splitline: function (text) {
|
||||
|
||||
if (this.context == null)
|
||||
if (this.context === null)
|
||||
{
|
||||
return;
|
||||
}
|
||||
|
|
@ -174,46 +174,6 @@ Phaser.Utils.Debug.prototype = {
|
|||
|
||||
},
|
||||
|
||||
/**
|
||||
* Visually renders a QuadTree to the display.
|
||||
* @method Phaser.Utils.Debug#renderQuadTree
|
||||
* @param {Phaser.QuadTree} quadtree - The quadtree to render.
|
||||
* @param {string} color - The color of the lines in the quadtree.
|
||||
*/
|
||||
renderQuadTree: function (quadtree, color) {
|
||||
|
||||
color = color || 'rgba(255,0,0,0.3)';
|
||||
|
||||
this.start();
|
||||
|
||||
var bounds = quadtree.bounds;
|
||||
|
||||
if (quadtree.nodes.length === 0)
|
||||
{
|
||||
this.context.strokeStyle = color;
|
||||
this.context.strokeRect(bounds.x, bounds.y, bounds.width, bounds.height);
|
||||
this.renderText(quadtree.ID + ' / ' + quadtree.objects.length, bounds.x + 4, bounds.y + 16, 'rgb(0,200,0)', '12px Courier');
|
||||
|
||||
this.context.strokeStyle = 'rgb(0,255,0)';
|
||||
|
||||
// children
|
||||
for (var i = 0; i < quadtree.objects.length; i++)
|
||||
{
|
||||
this.context.strokeRect(quadtree.objects[i].x, quadtree.objects[i].y, quadtree.objects[i].width, quadtree.objects[i].height);
|
||||
}
|
||||
}
|
||||
else
|
||||
{
|
||||
for (var i = 0; i < quadtree.nodes.length; i++)
|
||||
{
|
||||
this.renderQuadTree(quadtree.nodes[i]);
|
||||
}
|
||||
}
|
||||
|
||||
this.stop();
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* Render Sound information, including decoded state, duration, volume and more.
|
||||
* @method Phaser.Utils.Debug#renderSoundInfo
|
||||
|
|
@ -224,7 +184,7 @@ Phaser.Utils.Debug.prototype = {
|
|||
*/
|
||||
renderSoundInfo: function (sound, x, y, color) {
|
||||
|
||||
if (this.context == null)
|
||||
if (this.context === null)
|
||||
{
|
||||
return;
|
||||
}
|
||||
|
|
@ -261,7 +221,7 @@ Phaser.Utils.Debug.prototype = {
|
|||
*/
|
||||
renderCameraInfo: function (camera, x, y, color) {
|
||||
|
||||
if (this.context == null)
|
||||
if (this.context === null)
|
||||
{
|
||||
return;
|
||||
}
|
||||
|
|
@ -288,7 +248,7 @@ Phaser.Utils.Debug.prototype = {
|
|||
*/
|
||||
renderPointer: function (pointer, hideIfUp, downColor, upColor, color) {
|
||||
|
||||
if (this.context == null || pointer == null)
|
||||
if (this.context === null || pointer == null)
|
||||
{
|
||||
return;
|
||||
}
|
||||
|
|
@ -347,6 +307,11 @@ Phaser.Utils.Debug.prototype = {
|
|||
*/
|
||||
renderSpriteInputInfo: function (sprite, x, y, color) {
|
||||
|
||||
if (this.context === null)
|
||||
{
|
||||
return;
|
||||
}
|
||||
|
||||
color = color || 'rgb(255,255,255)';
|
||||
|
||||
this.start(x, y, color);
|
||||
|
|
@ -368,7 +333,7 @@ Phaser.Utils.Debug.prototype = {
|
|||
*/
|
||||
renderInputInfo: function (x, y, color) {
|
||||
|
||||
if (this.context == null)
|
||||
if (this.context === null)
|
||||
{
|
||||
return;
|
||||
}
|
||||
|
|
@ -395,7 +360,7 @@ Phaser.Utils.Debug.prototype = {
|
|||
*/
|
||||
renderSpriteInfo: function (sprite, x, y, color) {
|
||||
|
||||
if (this.context == null)
|
||||
if (this.context === null)
|
||||
{
|
||||
return;
|
||||
}
|
||||
|
|
@ -442,7 +407,7 @@ Phaser.Utils.Debug.prototype = {
|
|||
*/
|
||||
renderSpriteCoords: function (sprite, x, y, color) {
|
||||
|
||||
if (this.context == null)
|
||||
if (this.context === null)
|
||||
{
|
||||
return;
|
||||
}
|
||||
|
|
@ -472,7 +437,7 @@ Phaser.Utils.Debug.prototype = {
|
|||
*/
|
||||
renderLine: function (line, color) {
|
||||
|
||||
if (this.context == null)
|
||||
if (this.context === null)
|
||||
{
|
||||
return;
|
||||
}
|
||||
|
|
@ -500,7 +465,7 @@ Phaser.Utils.Debug.prototype = {
|
|||
*/
|
||||
renderLineInfo: function (line, x, y, color) {
|
||||
|
||||
if (this.context == null)
|
||||
if (this.context === null)
|
||||
{
|
||||
return;
|
||||
}
|
||||
|
|
@ -525,7 +490,7 @@ Phaser.Utils.Debug.prototype = {
|
|||
*/
|
||||
renderPointInfo: function (point, x, y, color) {
|
||||
|
||||
if (this.context == null)
|
||||
if (this.context === null)
|
||||
{
|
||||
return;
|
||||
}
|
||||
|
|
@ -547,7 +512,7 @@ Phaser.Utils.Debug.prototype = {
|
|||
*/
|
||||
renderPixel: function (x, y, color) {
|
||||
|
||||
if (this.context == null)
|
||||
if (this.context === null)
|
||||
{
|
||||
return;
|
||||
}
|
||||
|
|
@ -569,7 +534,7 @@ Phaser.Utils.Debug.prototype = {
|
|||
*/
|
||||
renderPoint: function (point, color) {
|
||||
|
||||
if (this.context == null)
|
||||
if (this.context === null)
|
||||
{
|
||||
return;
|
||||
}
|
||||
|
|
@ -592,7 +557,7 @@ Phaser.Utils.Debug.prototype = {
|
|||
*/
|
||||
renderRectangle: function (rect, color, filled) {
|
||||
|
||||
if (this.context == null)
|
||||
if (this.context === null)
|
||||
{
|
||||
return;
|
||||
}
|
||||
|
|
@ -626,7 +591,7 @@ Phaser.Utils.Debug.prototype = {
|
|||
*/
|
||||
renderCircle: function (circle, color) {
|
||||
|
||||
if (this.context == null)
|
||||
if (this.context === null)
|
||||
{
|
||||
return;
|
||||
}
|
||||
|
|
@ -654,7 +619,7 @@ Phaser.Utils.Debug.prototype = {
|
|||
*/
|
||||
renderText: function (text, x, y, color, font) {
|
||||
|
||||
if (this.context == null)
|
||||
if (this.context === null)
|
||||
{
|
||||
return;
|
||||
}
|
||||
|
|
@ -680,6 +645,11 @@ Phaser.Utils.Debug.prototype = {
|
|||
*/
|
||||
renderBodyInfo: function (sprite, x, y, color) {
|
||||
|
||||
if (this.context === null)
|
||||
{
|
||||
return;
|
||||
}
|
||||
|
||||
color = color || 'rgb(255,255,255)';
|
||||
|
||||
this.start(x, y, color, 210);
|
||||
|
|
@ -698,12 +668,12 @@ Phaser.Utils.Debug.prototype = {
|
|||
|
||||
/**
|
||||
* @method Phaser.Utils.Debug#renderPhysicsBody
|
||||
* @param {Phaser.Body} body - The Phaser.Body instance to render all shapes from.
|
||||
* @param {Phaser.Physics.Body} body - The Phaser.Physics.Body instance to render all shapes from.
|
||||
* @param {string} [color='rgb(255,255,255)'] - The color the polygon is stroked in.
|
||||
*/
|
||||
renderPhysicsBody: function (body, color, context) {
|
||||
renderPhysicsBody: function (body, color) {
|
||||
|
||||
if (this.context === null && context === null)
|
||||
if (this.context === null)
|
||||
{
|
||||
return;
|
||||
}
|
||||
|
|
@ -717,8 +687,8 @@ Phaser.Utils.Debug.prototype = {
|
|||
var shapeAngles = body.data.shapeAngles;
|
||||
|
||||
var i = shapes.length;
|
||||
var x = this.game.math.p2px(body.data.position[0]) - this.game.camera.view.x;
|
||||
var y = this.game.math.p2px(body.data.position[1]) - this.game.camera.view.y;
|
||||
var x = this.game.math.p2pxi(body.data.position[0]) - this.game.camera.view.x;
|
||||
var y = this.game.math.p2pxi(body.data.position[1]) - this.game.camera.view.y;
|
||||
var angle = body.data.angle;
|
||||
|
||||
while (i--)
|
||||
|
|
@ -731,11 +701,14 @@ Phaser.Utils.Debug.prototype = {
|
|||
{
|
||||
this.renderShapeLine(x, y, angle, shapes[i], shapeOffsets[i], shapeAngles[i]);
|
||||
}
|
||||
// else if (shapes[i] instanceof p2.Convex)
|
||||
else
|
||||
else if (shapes[i] instanceof p2.Convex)
|
||||
{
|
||||
this.renderShapeConvex(x, y, angle, shapes[i], shapeOffsets[i], shapeAngles[i]);
|
||||
}
|
||||
else if (shapes[i] instanceof p2.Circle)
|
||||
{
|
||||
this.renderShapeCircle(x, y, angle, shapes[i], shapeOffsets[i], shapeAngles[i]);
|
||||
}
|
||||
}
|
||||
|
||||
this.stop();
|
||||
|
|
@ -743,11 +716,15 @@ Phaser.Utils.Debug.prototype = {
|
|||
},
|
||||
|
||||
/**
|
||||
* @method Phaser.Utils.Debug#renderShape
|
||||
* Renders a p2.Rectangle shape. Do not call this directly - instead use Debug.renderPhysicsBody.
|
||||
*
|
||||
* @method Phaser.Utils.Debug#renderShapeRectangle
|
||||
* @param {number} x - The x coordinate of the Shape to translate to.
|
||||
* @param {number} y - The y coordinate of the Shape to translate to.
|
||||
* @param {number} bodyAngle - The angle of the Body to rotate to.
|
||||
* @param {p2.Shape} shape - The shape to render.
|
||||
* @param {number} x - The x coordinate of the Body to translate to.
|
||||
* @param {number} y - The y coordinate of the Body to translate to.
|
||||
* @param {number} angle - The angle of the Body to rotate to.
|
||||
* @param {array} offset - The shape offset vector.
|
||||
* @param {number} angle - The shape angle.
|
||||
*/
|
||||
renderShapeRectangle: function (x, y, bodyAngle, shape, offset, angle) {
|
||||
|
||||
|
|
@ -757,14 +734,14 @@ Phaser.Utils.Debug.prototype = {
|
|||
|
||||
this.context.beginPath();
|
||||
this.context.save();
|
||||
this.context.translate(x + this.game.math.p2px(offset[0]), y + this.game.math.p2px(offset[1]));
|
||||
this.context.translate(x + this.game.math.p2pxi(offset[0]), y + this.game.math.p2pxi(offset[1]));
|
||||
this.context.rotate(bodyAngle + angle);
|
||||
|
||||
this.context.moveTo(this.game.math.p2px(points[0][0]), this.game.math.p2px(points[0][1]));
|
||||
this.context.moveTo(this.game.math.p2pxi(points[0][0]), this.game.math.p2pxi(points[0][1]));
|
||||
|
||||
for (var i = 1; i < points.length; i++)
|
||||
{
|
||||
this.context.lineTo(this.game.math.p2px(points[i][0]), this.game.math.p2px(points[i][1]));
|
||||
this.context.lineTo(this.game.math.p2pxi(points[i][0]), this.game.math.p2pxi(points[i][1]));
|
||||
}
|
||||
|
||||
this.context.closePath();
|
||||
|
|
@ -774,12 +751,15 @@ Phaser.Utils.Debug.prototype = {
|
|||
},
|
||||
|
||||
/**
|
||||
* @method Phaser.Utils.Debug#renderShape
|
||||
* @param {number} x - The x coordinate of the Body to translate to.
|
||||
* @param {number} y - The y coordinate of the Body to translate to.
|
||||
* Renders a p2.Line shape. Do not call this directly - instead use Debug.renderPhysicsBody.
|
||||
*
|
||||
* @method Phaser.Utils.Debug#renderShapeLine
|
||||
* @param {number} x - The x coordinate of the Shape to translate to.
|
||||
* @param {number} y - The y coordinate of the Shape to translate to.
|
||||
* @param {number} bodyAngle - The angle of the Body to rotate to.
|
||||
* @param {p2.Shape} shape - The shape to render.
|
||||
* @param {number} offset -
|
||||
* @param {number} angle -
|
||||
* @param {array} offset - The shape offset vector.
|
||||
* @param {number} angle - The shape angle.
|
||||
*/
|
||||
renderShapeLine: function (x, y, bodyAngle, shape, offset, angle) {
|
||||
|
||||
|
|
@ -797,11 +777,15 @@ Phaser.Utils.Debug.prototype = {
|
|||
},
|
||||
|
||||
/**
|
||||
* @method Phaser.Utils.Debug#renderShape
|
||||
* Renders a convex shape. Do not call this directly - instead use Debug.renderPhysicsBody.
|
||||
*
|
||||
* @method Phaser.Utils.Debug#renderShapeConvex
|
||||
* @param {number} x - The x coordinate of the Shape to translate to.
|
||||
* @param {number} y - The y coordinate of the Shape to translate to.
|
||||
* @param {number} bodyAngle - The angle of the Body to rotate to.
|
||||
* @param {p2.Shape} shape - The shape to render.
|
||||
* @param {number} x - The x coordinate of the Body to translate to.
|
||||
* @param {number} y - The y coordinate of the Body to translate to.
|
||||
* @param {number} angle - The angle of the Body to rotate to.
|
||||
* @param {array} offset - The shape offset vector.
|
||||
* @param {number} angle - The shape angle.
|
||||
*/
|
||||
renderShapeConvex: function (x, y, bodyAngle, shape, offset, angle) {
|
||||
|
||||
|
|
@ -809,16 +793,41 @@ Phaser.Utils.Debug.prototype = {
|
|||
|
||||
this.context.beginPath();
|
||||
this.context.save();
|
||||
this.context.translate(x + this.game.math.p2px(offset[0]), y + this.game.math.p2px(offset[1]));
|
||||
this.context.translate(x + this.game.math.p2pxi(offset[0]), y + this.game.math.p2pxi(offset[1]));
|
||||
this.context.rotate(bodyAngle + angle);
|
||||
|
||||
this.context.moveTo(this.game.math.p2px(points[0][0]), this.game.math.p2px(points[0][1]));
|
||||
this.context.moveTo(this.game.math.p2pxi(points[0][0]), this.game.math.p2pxi(points[0][1]));
|
||||
|
||||
for (var i = 1; i < points.length; i++)
|
||||
{
|
||||
this.context.lineTo(this.game.math.p2px(points[i][0]), this.game.math.p2px(points[i][1]));
|
||||
this.context.lineTo(this.game.math.p2pxi(points[i][0]), this.game.math.p2pxi(points[i][1]));
|
||||
}
|
||||
|
||||
// this.context.arc(0, 0, this.game.math.p2px(shape.radius) , 0, Math.PI * 2);
|
||||
|
||||
this.context.closePath();
|
||||
this.context.stroke();
|
||||
this.context.restore();
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* Renders a p2.Circle shape. Do not call this directly - instead use Debug.renderPhysicsBody.
|
||||
*
|
||||
* @method Phaser.Utils.Debug#renderShapeCircle
|
||||
* @param {number} x - The x coordinate of the Shape to translate to.
|
||||
* @param {number} y - The y coordinate of the Shape to translate to.
|
||||
* @param {number} bodyAngle - The angle of the Body to rotate to.
|
||||
* @param {p2.Shape} shape - The shape to render.
|
||||
* @param {array} offset - The shape offset vector.
|
||||
* @param {number} angle - The shape angle.
|
||||
*/
|
||||
renderShapeCircle: function (x, y, bodyAngle, shape, offset, angle) {
|
||||
|
||||
this.context.beginPath();
|
||||
this.context.save();
|
||||
this.context.translate(x + this.game.math.p2pxi(offset[0]), y + this.game.math.p2pxi(offset[1]));
|
||||
this.context.arc(0, 0, this.game.math.p2px(shape.radius) , 0, Math.PI * 2);
|
||||
this.context.closePath();
|
||||
this.context.stroke();
|
||||
this.context.restore();
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue