/** * @author Richard Davey * @copyright 2014 Photon Storm Ltd. * @license {@link https://github.com/photonstorm/phaser/blob/master/license.txt|MIT License} */ /** * Creates a new `Graphics` object. * * @class Phaser.Graphics * @constructor * @extends PIXI.Graphics * @param {Phaser.Game} game Current game instance. * @param {number} x - X position of the new graphics object. * @param {number} y - Y position of the new graphics object. */ Phaser.Graphics = function (game, x, y) { x = x || 0; y = y || 0; /** * @property {Phaser.Game} game - A reference to the currently running Game. */ this.game = game; /** * @property {boolean} exists - If exists = false then the Text isn't updated by the core game loop. * @default */ this.exists = true; /** * @property {string} name - The user defined name given to this object. * @default */ this.name = ''; /** * @property {number} type - The const type of this object. * @default */ this.type = Phaser.GRAPHICS; /** * @property {number} z - The z-depth value of this object within its Group (remember the World is a Group as well). No two objects in a Group can have the same z value. */ this.z = 0; /** * @property {Phaser.Point} world - The world coordinates of this Sprite. This differs from the x/y coordinates which are relative to the Sprites container. */ this.world = new Phaser.Point(x, y); /** * @property {Phaser.Point} cameraOffset - If this object is fixedToCamera then this stores the x/y offset that its drawn at, from the top-left of the camera view. */ this.cameraOffset = new Phaser.Point(); PIXI.Graphics.call(this); this.position.set(x, y); /** * @property {Phaser.Point} previousPosition - The position the Sprite was in at the last update. * @readOnly */ this.previousPosition = new Phaser.Point(x, y); /** * @property {number} previousRotation - The rotation angle the Sprite was in at the last update (in radians) * @readOnly */ this.previousRotation = 0; /** * @property {number} renderOrderID - The render order ID. This is used internally by the renderer and input manager and should not be modified. * @readOnly */ this.renderOrderID = 0; /** * A Sprite that is fixed to the camera uses its x/y coordinates as offsets from the top left of the camera. These are stored in Sprite.cameraOffset. * Note that the cameraOffset values are in addition to any parent in the display list. * So if this Sprite was in a Group that has x: 200, then this will be added to the cameraOffset.x * @property {boolean} fixedToCamera */ this.fixedToCamera = false; /** * @property {boolean} destroyPhase - As a Sprite runs through its destroy method this flag is set to true, and can be checked in any sub-systems it is being destroyed from. * @readOnly */ this.destroyPhase = false; }; Phaser.Graphics.prototype = Object.create(PIXI.Graphics.prototype); Phaser.Graphics.prototype.constructor = Phaser.Graphics; /** * Automatically called by World.preUpdate. * @method Phaser.Graphics.prototype.preUpdate */ Phaser.Graphics.prototype.preUpdate = function () { this.previousPosition.set(this.world.x, this.world.y); this.previousRotation = this.rotation; if (!this.exists || !this.parent.exists) { this.renderOrderID = -1; return false; } if (this.autoCull) { // Won't get rendered but will still get its transform updated this.renderable = this.game.world.camera.screenView.intersects(this.getBounds()); } this.world.setTo(this.game.camera.x + this.worldTransform.tx, this.game.camera.y + this.worldTransform.ty); if (this.visible) { this.renderOrderID = this.game.stage.currentRenderOrderID++; } return true; }; /** * Override and use this function in your own custom objects to handle any update requirements you may have. * * @method Phaser.Graphics#update * @memberof Phaser.Graphics */ Phaser.Graphics.prototype.update = function() { }; /** * Automatically called by World.postUpdate. * @method Phaser.Graphics.prototype.postUpdate */ Phaser.Graphics.prototype.postUpdate = function () { if (this.fixedToCamera) { this.position.x = (this.game.camera.view.x + this.cameraOffset.x) / this.game.camera.scale.x; this.position.y = (this.game.camera.view.y + this.cameraOffset.y) / this.game.camera.scale.y; } }; /** * Destroy this Graphics instance. * * @method Phaser.Graphics.prototype.destroy * @param {boolean} [destroyChildren=true] - Should every child of this object have its destroy method called? */ Phaser.Graphics.prototype.destroy = function(destroyChildren) { if (this.game === null || this.destroyPhase) { return; } if (typeof destroyChildren === 'undefined') { destroyChildren = true; } this.destroyPhase = false; this.clear(); if (this.parent) { if (this.parent instanceof Phaser.Group) { this.parent.remove(this); } else { this.parent.removeChild(this); } } var i = this.children.length; if (destroyChildren) { while (i--) { this.children[i].destroy(destroyChildren); } } else { while (i--) { this.removeChild(this.children[i]); } } this.exists = false; this.visible = false; this.game = null; this.destroyPhase = true; }; /* * Draws a circle. * * @method Phaser.Graphics.prototype.drawCircle * @param {Number} x - The X coordinate of the center of the circle. * @param {Number} y - The Y coordinate of the center of the circle. * @param {Number} diameter - The diameter of the circle. * @return {Phaser.Graphics} This Graphics object. */ Phaser.Graphics.prototype.drawCircle = function(x, y, diameter) { this.drawShape(new Phaser.Circle(x, y, diameter)); return this; }; /* * Draws a single {Phaser.Polygon} triangle from a {Phaser.Point} array * * @method Phaser.Graphics.prototype.drawTriangle * @param {Array} points - An array of Phaser.Points that make up the three vertices of this triangle * @param {boolean} [cull=false] - Should we check if the triangle is back-facing */ Phaser.Graphics.prototype.drawTriangle = function(points, cull) { if (typeof cull === 'undefined') { cull = false; } var triangle = new Phaser.Polygon(points); if (cull) { var cameraToFace = new Phaser.Point(this.game.camera.x - points[0].x, this.game.camera.y - points[0].y); var ab = new Phaser.Point(points[1].x - points[0].x, points[1].y - points[0].y); var cb = new Phaser.Point(points[1].x - points[2].x, points[1].y - points[2].y); var faceNormal = cb.cross(ab); if (cameraToFace.dot(faceNormal) > 0) { this.drawPolygon(triangle); } } else { this.drawPolygon(triangle); } }; /* * Draws {Phaser.Polygon} triangles * * @method Phaser.Graphics.prototype.drawTriangles * @param {Array|Array} vertices - An array of Phaser.Points or numbers that make up the vertices of the triangles * @param {Array} {indices=null} - An array of numbers that describe what order to draw the vertices in * @param {boolean} [cull=false] - Should we check if the triangle is back-facing */ Phaser.Graphics.prototype.drawTriangles = function(vertices, indices, cull) { if (typeof cull === 'undefined') { cull = false; } var point1 = new Phaser.Point(); var point2 = new Phaser.Point(); var point3 = new Phaser.Point(); var points = []; var i; if (!indices) { if (vertices[0] instanceof Phaser.Point) { for (i = 0; i < vertices.length / 3; i++) { this.drawTriangle([vertices[i * 3], vertices[i * 3 + 1], vertices[i * 3 + 2]], cull); } } else { for (i = 0; i < vertices.length / 6; i++) { point1.x = vertices[i * 6 + 0]; point1.y = vertices[i * 6 + 1]; point2.x = vertices[i * 6 + 2]; point2.y = vertices[i * 6 + 3]; point3.x = vertices[i * 6 + 4]; point3.y = vertices[i * 6 + 5]; this.drawTriangle([point1, point2, point3], cull); } } } else { if (vertices[0] instanceof Phaser.Point) { for (i = 0; i < indices.length /3; i++) { points.push(vertices[indices[i * 3 ]]); points.push(vertices[indices[i * 3 + 1]]); points.push(vertices[indices[i * 3 + 2]]); if (points.length === 3) { this.drawTriangle(points, cull); points = []; } } } else { for (i = 0; i < indices.length; i++) { point1.x = vertices[indices[i] * 2]; point1.y = vertices[indices[i] * 2 + 1]; points.push(point1.copyTo({})); if (points.length === 3) { this.drawTriangle(points, cull); points = []; } } } } }; /** * Indicates the rotation of the Graphics, in degrees, from its original orientation. Values from 0 to 180 represent clockwise rotation; values from 0 to -180 represent counterclockwise rotation. * Values outside this range are added to or subtracted from 360 to obtain a value within the range. For example, the statement player.angle = 450 is the same as player.angle = 90. * If you wish to work in radians instead of degrees use the property Sprite.rotation instead. * * @name Phaser.Graphics#angle * @property {number} angle - Gets or sets the angle of rotation in degrees. */ Object.defineProperty(Phaser.Graphics.prototype, 'angle', { get: function() { return Phaser.Math.radToDeg(this.rotation); }, set: function(value) { this.rotation = Phaser.Math.degToRad(value); } });