diff --git a/README.md b/README.md index e45f50012..ee1ca03d4 100644 --- a/README.md +++ b/README.md @@ -16,7 +16,7 @@ Thousands of developers worldwide use it. From indies and multi-national digital * **Read:** Subscribe to the [Newsletter](https://confirmsubscription.com/h/r/369DE48E3E86AF1E) and grab our [Phaser Books](http://phaser.io/shop) * **Chat:** [#phaserio IRC channel](http://www.html5gamedevs.com/topic/4470-official-phaserio-irc-channel-phaserio-on-freenode/) on freenode * **Extend:** With [Phaser Plugins](https://github.com/photonstorm/phaser-plugins) -* **Be awesome:** Support our work via [Gratipay](https://gratipay.com/photonstorm/) +* **Be awesome:** Support our work by buying our [books](http://phaser.io/shop/books) and [plugins](http://phaser.io/shop/plugins) ![div](http://www.phaser.io/images/github/div.png) @@ -39,25 +39,11 @@ Thousands of developers worldwide use it. From indies and multi-national digital
-> 26th March 2015 +> 15th July 2015 -Phaser 2.3.0 marks the second release in 2015 and easily one of our most significant for a while. In terms of API changes they're actually quite minimal, but under the hood we've taken Phaser for a serious workout. +To be written. -We've traditionally had something of a 'kitchen sink' issue with Phaser. As we thought of great new features to give you we just added them in. And like too much of a good thing they contributed to an ever growing file size. - -So two of the biggest changes 2.3.0 has is an internal shift to using Game Object components, and allowing you to exclude features in your own custom builds. The new build system lets you selectively exclude features from being bundled in: for example if your game doesn't need Gamepad or Keyboard support you can now tell Phaser to skip those parts entirely. - -[This tutorial](http://phaser.io/tutorials/creating-custom-phaser-builds) explains the process in detail. But the end result is that thanks to these changes we've both managed to remove thousands of lines of code and let you decide what Phaser contains. The minimum build size is now just 83KB minified and gzipped and that's still including both the WebGL and Canvas renderers. - -Even though we've been cutting down on size we still managed to pack a whole load of great new features in. For example the new spacial sorting added to Arcade Physics allows for incredible speed increases when dealing with densely populated game worlds. The Loader has received a complete overhaul - now offering full parallel asset loading, sync points and more! The Tilemap system was upgraded to support new Tiled 0.11 editor features. Audio has been also been enhanced, with better marker and loop handling. See the Change Log for all the details. - -Your games will run faster, have a smaller footprint, and load faster than ever. - -But it's not just Phaser that has been updated - we also finally released the [new Phaser web site](http://phaser.io)! For the past few years it was a huge "wall of text", with hundreds of links filling up the single page site. Now it's all changed! with a much more attractive layout and structure. We've got a healthy and constantly updating [news section](http://phaser.io/news), the [examples](http://phaser.io/examples) have a great new visual showcase and there's even a [Sandbox](http://phaser.io/sandbox) to play in. - -It was a lot of hard work but we're super-happy with the result - and judging by our page hits, which are going off the charts, you are too :) We'll be sure to keep enhancing it over the coming months, especially as Phaser 3 development ramps up. - -That's all for now. I hope you enjoy Phaser 2.3.0, the new site, the new features and the New Year. Happy coding everyone! See you on the forums. +That's all for now. I hope you enjoy Phaser 2.4.0. Happy coding everyone! See you on the forums. Cheers, @@ -91,15 +77,15 @@ Install via [npm](https://www.npmjs.com) [jsDelivr](http://www.jsdelivr.com/#!phaser) is a "super-fast CDN for developers". Include the following in your html: -`` +`` or the minified version: -`` +`` [cdnjs.com](https://cdnjs.com/libraries/phaser) also offers a free CDN service. They have all versions of Phaser and even the custom builds: -`` +`` ### Phaser Sandbox @@ -231,7 +217,7 @@ All Phaser development is now taking place on the Phaser 3 project. The Phaser 2 ## Phaser 3 -We're now several months in to development of Phaser 3. We've been working hard on creating a brand new and extremely powerful renderer. Progress reports are posted to the web site and [Phaser 3 repo](https://github.com/photonstorm/phaser3). +We're now a good way in to development of Phaser 3. We've been working hard on creating a brand new and extremely powerful renderer. Progress reports are posted to the [web site](http://phaser.io/labs) and [Phaser 3 repo](https://github.com/photonstorm/phaser3). There is still plenty of time to add your suggestions and feedback in [this forum thread](http://www.html5gamedevs.com/topic/7949-the-phaser-3-wishlist-thread/). @@ -331,6 +317,7 @@ Version 2.4 - "Katar" - in dev * All Game Objects have a new boolean property called `pendingDestroy`. If you set this to `true` then the object will automatically destroy itself in the *next* logic update, rather than immediately. This is useful for cases when you wish to destroy an object from within one of its own callbacks, such as with buttons or other input events (thanks @alamboley #1748) * BitmapData.generateTexture will take a snapshot of the BitmapDatas canvas at that moment in time and convert it into an Image, which is then stored in the Phaser image Cache based on the key given. You can then use the new texture for any future sprites or texture based objects. * All Signals now have the ability to carry extra custom arguments with them, which are passed on to the callback you define after any internal arguments. For example a Phaser.Key has an onDown signal. When dispatched onDown sends a reference to the Key as the first and only argument. But you can now set the callback like this: `fireKey.onDown.add(shoot, this, 0, 'lazer', 64)`. So when the onDown signal is dispatched internally the callback (`shoot` in this case) will receive 3 arguments: the Key reference that is raised internally and the string 'lazer' and value 64, which were the custom arguments provided when setting-up the callback. +* Group.moveAll allows you to move all of the children of a Group into another Group. ### Updates @@ -382,6 +369,7 @@ Version 2.4 - "Katar" - in dev * RandomDataGenerator.weightedPick has been tweaked slightly to allow for a more even distribution of weights. It still favors the earlier array elements, but will accurately include 'distance' elements as well (thanks @gingerbeardman #1751) * BitmapData.clear has 4 new optional parameters: x, y, width and height, that define the area to be cleared. If left undefined it works exactly the same as before and clears the entire canvas. * Added Phaser.Keyboard.COMMA and Phaser.Keyboard.PERIOD to the consts list. +* Canvas.setSmoothingEnabled only applies the value of the property exists, which avoids the Chrome webkit prefix deprecation warnings. ### Bug Fixes @@ -434,6 +422,7 @@ Version 2.4 - "Katar" - in dev * Rope.segments used the wrong vertices property, causing a runtime error. * Debug.ropeSegments didn't take the scale of the Rope object into consideration, causing incorrect debug rendering. * If a Sound was muted, or had its volume changed while it was still decoding (i.e. before it started playback) then the mute and/or volume were ignored and the sound would play anyway (thanks @brianbunch #1872) +* Group.addMultiple if given a Group.children array as the first parameter would fail as the original group length was decreased out of line with the children being added. Group.addMultiple now checks if the children argument is a Phaser.Group instance, and if so it uses Group.moveAll instead on it (thanks @AnderbergE #1898) ### Deprecated diff --git a/build/custom/phaser-arcade-physics.js b/build/custom/phaser-arcade-physics.js index 142c10892..2021b0cbe 100644 --- a/build/custom/phaser-arcade-physics.js +++ b/build/custom/phaser-arcade-physics.js @@ -7,7 +7,7 @@ * * Phaser - http://phaser.io * -* v2.4.0 "Katar" - Built: Tue May 19 2015 14:19:52 +* v2.4.0 "Katar" - Built: Fri Jul 10 2015 17:25:45 * * By Richard Davey http://www.photonstorm.com @photonstorm * @@ -1753,7 +1753,7 @@ PIXI.Sprite.prototype._renderWebGL = function(renderSession, matrix) } else { - renderSession.spriteBatch.render(this, wt); + renderSession.spriteBatch.render(this); // Render children! for (var i = 0; i < this.children.length; i++) @@ -2083,588 +2083,6 @@ PIXI.SpriteBatch.prototype._renderCanvas = function(renderSession) }; -/** - * @author Mat Groves http://matgroves.com/ @Doormat23 - * Modified by Tom Slezakowski http://www.tomslezakowski.com @TomSlezakowski (24/03/2014) - Added dropShadowColor. - */ - -/** - * A Text Object will create a line or multiple lines of text. To split a line you can use '\n' in your text string, - * or add a wordWrap property set to true and and wordWrapWidth property with a value in the style object. - * - * @class Text - * @extends Sprite - * @constructor - * @param text {String} The copy that you would like the text to display - * @param [style] {Object} The style parameters - * @param [style.font] {String} default 'bold 20px Arial' The style and size of the font - * @param [style.fill='black'] {String|Number} A canvas fillstyle that will be used on the text e.g 'red', '#00FF00' - * @param [style.align='left'] {String} Alignment for multiline text ('left', 'center' or 'right'), does not affect single line text - * @param [style.stroke] {String|Number} A canvas fillstyle that will be used on the text stroke e.g 'blue', '#FCFF00' - * @param [style.strokeThickness=0] {Number} A number that represents the thickness of the stroke. Default is 0 (no stroke) - * @param [style.wordWrap=false] {Boolean} Indicates if word wrap should be used - * @param [style.wordWrapWidth=100] {Number} The width at which text will wrap, it needs wordWrap to be set to true - * @param [style.dropShadow=false] {Boolean} Set a drop shadow for the text - * @param [style.dropShadowColor='#000000'] {String} A fill style to be used on the dropshadow e.g 'red', '#00FF00' - * @param [style.dropShadowAngle=Math.PI/4] {Number} Set a angle of the drop shadow - * @param [style.dropShadowDistance=5] {Number} Set a distance of the drop shadow - */ -PIXI.Text = function(text, style) -{ - /** - * The canvas element that everything is drawn to - * - * @property canvas - * @type HTMLCanvasElement - */ - this.canvas = document.createElement('canvas'); - - /** - * The canvas 2d context that everything is drawn with - * @property context - * @type HTMLCanvasElement - */ - this.context = this.canvas.getContext('2d'); - - /** - * The resolution of the canvas. - * @property resolution - * @type Number - */ - this.resolution = 1; - - PIXI.Sprite.call(this, PIXI.Texture.fromCanvas(this.canvas)); - - this.setText(text); - this.setStyle(style); -}; - -// constructor -PIXI.Text.prototype = Object.create(PIXI.Sprite.prototype); -PIXI.Text.prototype.constructor = PIXI.Text; - -/** - * The width of the Text, setting this will actually modify the scale to achieve the value set - * - * @property width - * @type Number - */ -Object.defineProperty(PIXI.Text.prototype, 'width', { - get: function() { - - if(this.dirty) - { - this.updateText(); - this.dirty = false; - } - - - return this.scale.x * this.texture.frame.width; - }, - set: function(value) { - this.scale.x = value / this.texture.frame.width; - this._width = value; - } -}); - -/** - * The height of the Text, setting this will actually modify the scale to achieve the value set - * - * @property height - * @type Number - */ -Object.defineProperty(PIXI.Text.prototype, 'height', { - get: function() { - - if(this.dirty) - { - this.updateText(); - this.dirty = false; - } - - - return this.scale.y * this.texture.frame.height; - }, - set: function(value) { - this.scale.y = value / this.texture.frame.height; - this._height = value; - } -}); - -/** - * Set the copy for the text object. To split a line you can use '\n'. - * - * @method setText - * @param text {String} The copy that you would like the text to display - */ -PIXI.Text.prototype.setText = function(text) -{ - this.text = text.toString() || ' '; - this.dirty = true; -}; - -/** - * Updates texture size based on canvas size - * - * @method updateTexture - * @private - */ -PIXI.Text.prototype.updateTexture = function() -{ - this.texture.baseTexture.width = this.canvas.width; - this.texture.baseTexture.height = this.canvas.height; - this.texture.crop.width = this.texture.frame.width = this.canvas.width; - this.texture.crop.height = this.texture.frame.height = this.canvas.height; - - this._width = this.canvas.width; - this._height = this.canvas.height; - - // update the dirty base textures - this.texture.baseTexture.dirty(); -}; - -/** -* Renders the object using the WebGL renderer -* -* @method _renderWebGL -* @param renderSession {RenderSession} -* @private -*/ -PIXI.Text.prototype._renderWebGL = function(renderSession) -{ - if(this.dirty) - { - this.resolution = renderSession.resolution; - - this.updateText(); - this.dirty = false; - } - - PIXI.Sprite.prototype._renderWebGL.call(this, renderSession); -}; - -/** -* Renders the object using the Canvas renderer -* -* @method _renderCanvas -* @param renderSession {RenderSession} -* @private -*/ -PIXI.Text.prototype._renderCanvas = function(renderSession) -{ - if(this.dirty) - { - this.resolution = renderSession.resolution; - - this.updateText(); - this.dirty = false; - } - - PIXI.Sprite.prototype._renderCanvas.call(this, renderSession); -}; - -/** -* Calculates the ascent, descent and fontSize of a given fontStyle -* -* @method determineFontProperties -* @param fontStyle {Object} -* @private -*/ -PIXI.Text.prototype.determineFontProperties = function(fontStyle) -{ - var properties = PIXI.Text.fontPropertiesCache[fontStyle]; - - if (!properties) - { - properties = {}; - - var canvas = PIXI.Text.fontPropertiesCanvas; - var context = PIXI.Text.fontPropertiesContext; - - context.font = fontStyle; - - var width = Math.ceil(context.measureText('|MÉq').width); - var baseline = Math.ceil(context.measureText('|MÉq').width); - var height = 2 * baseline; - - baseline = baseline * 1.4 | 0; - - canvas.width = width; - canvas.height = height; - - context.fillStyle = '#f00'; - context.fillRect(0, 0, width, height); - - context.font = fontStyle; - - context.textBaseline = 'alphabetic'; - context.fillStyle = '#000'; - context.fillText('|MÉq', 0, baseline); - - if (!context.getImageData(0, 0, width, height)) - { - properties.ascent = baseline; - properties.descent = baseline + 6; - properties.fontSize = properties.ascent + properties.descent; - - PIXI.Text.fontPropertiesCache[fontStyle] = properties; - - return properties; - } - - var imagedata = context.getImageData(0, 0, width, height).data; - var pixels = imagedata.length; - var line = width * 4; - - var i, j; - - var idx = 0; - var stop = false; - - // ascent. scan from top to bottom until we find a non red pixel - for (i = 0; i < baseline; i++) - { - for (j = 0; j < line; j += 4) - { - if (imagedata[idx + j] !== 255) - { - stop = true; - break; - } - } - - if (!stop) - { - idx += line; - } - else - { - break; - } - } - - properties.ascent = baseline - i; - - idx = pixels - line; - stop = false; - - // descent. scan from bottom to top until we find a non red pixel - for (i = height; i > baseline; i--) - { - for (j = 0; j < line; j += 4) - { - if (imagedata[idx + j] !== 255) - { - stop = true; - break; - } - } - - if (!stop) - { - idx -= line; - } - else - { - break; - } - } - - properties.descent = i - baseline; - //TODO might need a tweak. kind of a temp fix! - properties.descent += 6; - properties.fontSize = properties.ascent + properties.descent; - - PIXI.Text.fontPropertiesCache[fontStyle] = properties; - } - - return properties; -}; - -/** -* Returns the bounds of the Text as a rectangle. The bounds calculation takes the worldTransform into account. -* -* @method getBounds -* @param matrix {Matrix} the transformation matrix of the Text -* @return {Rectangle} the framing rectangle -*/ -PIXI.Text.prototype.getBounds = function(matrix) -{ - if(this.dirty) - { - this.updateText(); - this.dirty = false; - } - - return PIXI.Sprite.prototype.getBounds.call(this, matrix); -}; - -PIXI.Text.fontPropertiesCache = {}; -PIXI.Text.fontPropertiesCanvas = document.createElement('canvas'); -PIXI.Text.fontPropertiesContext = PIXI.Text.fontPropertiesCanvas.getContext('2d'); - -/** - * @author Mat Groves http://matgroves.com/ @Doormat23 - */ - -/** - * A BitmapText object will create a line or multiple lines of text using bitmap font. To split a line you can use '\n', '\r' or '\r\n' in your string. - * You can generate the fnt files using - * http://www.angelcode.com/products/bmfont/ for windows or - * http://www.bmglyph.com/ for mac. - * - * @class BitmapText - * @extends DisplayObjectContainer - * @constructor - * @param text {String} The copy that you would like the text to display - * @param style {Object} The style parameters - * @param style.font {String} The size (optional) and bitmap font id (required) eq 'Arial' or '20px Arial' (must have loaded previously) - * @param [style.align='left'] {String} Alignment for multiline text ('left', 'center' or 'right'), does not affect single line text - */ -PIXI.BitmapText = function(text, style) -{ - PIXI.DisplayObjectContainer.call(this); - - /** - * [read-only] The width of the overall text, different from fontSize, - * which is defined in the style object - * - * @property textWidth - * @type Number - * @readOnly - */ - this.textWidth = 0; - - /** - * [read-only] The height of the overall text, different from fontSize, - * which is defined in the style object - * - * @property textHeight - * @type Number - * @readOnly - */ - this.textHeight = 0; - - /** - * The max width of this bitmap text in pixels. If the text provided is longer than the value provided, line breaks will be - * automatically inserted in the last whitespace. Disable by setting value to 0. - * - * @property maxWidth - * @type Number - */ - this.maxWidth = 0; - - /** - * @property anchor - * @type Point - */ - this.anchor = new Phaser.Point(0, 0); - - /** - * @property _prevAnchor - * @type Point - */ - this._prevAnchor = new Phaser.Point(0, 0); - - /** - * @property _pool - * @type Array - * @private - */ - this._pool = []; - - this.setText(text); - this.setStyle(style); - this.updateText(); - - /** - * The dirty state of this object. - * @property dirty - * @type Boolean - */ - this.dirty = false; -}; - -// constructor -PIXI.BitmapText.prototype = Object.create(PIXI.DisplayObjectContainer.prototype); -PIXI.BitmapText.prototype.constructor = PIXI.BitmapText; - -/** - * Set the text string to be rendered. - * - * @method setText - * @param text {String} The text that you would like displayed - */ -PIXI.BitmapText.prototype.setText = function(text) -{ - this.text = text || ' '; - this.dirty = true; -}; - -/** - * Set the style of the text - * style.font {String} The size (optional) and bitmap font id (required) eq 'Arial' or '20px Arial' (must have loaded previously) - * [style.align='left'] {String} Alignment for multiline text ('left', 'center' or 'right'), does not affect single lines of text - * - * @method setStyle - * @param style {Object} The style parameters, contained as properties of an object - */ -PIXI.BitmapText.prototype.setStyle = function(style) -{ - style = style || {}; - style.align = style.align || 'left'; - this.style = style; - - var font = style.font.split(' '); - this.fontName = font[font.length - 1]; - this.fontSize = font.length >= 2 ? parseInt(font[font.length - 2], 10) : PIXI.BitmapText.fonts[this.fontName].size; - - this.dirty = true; - this.tint = style.tint; -}; - -/** - * Renders text and updates it when needed - * - * @method updateText - * @private - */ -PIXI.BitmapText.prototype.updateText = function() -{ - var data = PIXI.BitmapText.fonts[this.fontName]; - var pos = new PIXI.Point(); - var prevCharCode = null; - var chars = []; - var maxLineWidth = 0; - var lineWidths = []; - var line = 0; - var scale = this.fontSize / data.size; - var lastSpace = 0; - - for (var i = 0; i < this.text.length; i++) - { - var charCode = this.text.charCodeAt(i); - lastSpace = /(\s)/.test(this.text.charAt(i)) ? i : lastSpace; - - if (/(?:\r\n|\r|\n)/.test(this.text.charAt(i))) - { - lineWidths.push(pos.x); - maxLineWidth = Math.max(maxLineWidth, pos.x); - line++; - - pos.x = 0; - pos.y += data.lineHeight; - prevCharCode = null; - continue; - } - - if (lastSpace !== -1 && this.maxWidth > 0 && pos.x * scale > this.maxWidth) - { - chars.splice(lastSpace, i - lastSpace); - i = lastSpace; - lastSpace = -1; - - lineWidths.push(lastLineWidth); - maxLineWidth = Math.max(maxLineWidth, lastLineWidth); - line++; - - pos.x = 0; - pos.y += data.lineHeight; - prevCharCode = null; - continue; - } - - var charData = data.chars[charCode]; - - if(!charData) continue; - - if(prevCharCode && charData.kerning[prevCharCode]) - { - pos.x += charData.kerning[prevCharCode]; - } - - chars.push({texture:charData.texture, line: line, charCode: charCode, position: new PIXI.Point(pos.x + charData.xOffset, pos.y + charData.yOffset)}); - pos.x += charData.xAdvance; - - prevCharCode = charCode; - } - - lineWidths.push(pos.x); - maxLineWidth = Math.max(maxLineWidth, pos.x); - - var lineAlignOffsets = []; - - for (i = 0; i <= line; i++) - { - var alignOffset = 0; - - if (this.style.align === 'right') - { - alignOffset = maxLineWidth - lineWidths[i]; - } - else if (this.style.align === 'center') - { - alignOffset = (maxLineWidth - lineWidths[i]) / 2; - } - - lineAlignOffsets.push(alignOffset); - } - - var lenChildren = this.children.length; - var lenChars = chars.length; - var tint = this.tint || 0xFFFFFF; - - this.textWidth = maxLineWidth * scale; - this.textHeight = (pos.y + data.lineHeight) * scale; - - var ax = this.textWidth * this.anchor.x; - var ay = this.textHeight * this.anchor.y; - - for (i = 0; i < lenChars; i++) - { - var c = i < lenChildren ? this.children[i] : this._pool.pop(); // get old child if have. if not - take from pool. - - if (c) c.setTexture(chars[i].texture); // check if got one before. - else c = new PIXI.Sprite(chars[i].texture); // if no create new one. - - c.position.x = ((chars[i].position.x + lineAlignOffsets[chars[i].line]) * scale) - ax; - c.position.y = (chars[i].position.y * scale) - ay; - - c.scale.x = c.scale.y = scale; - c.tint = tint; - if (!c.parent) this.addChild(c); - } - - // Remove unnecessary children and put them into the pool - while (this.children.length > lenChars) - { - var child = this.getChildAt(this.children.length - 1); - this._pool.push(child); - this.removeChild(child); - } - -}; - -/** - * Updates the transform of this object - * - * @method updateTransform - * @private - */ -PIXI.BitmapText.prototype.updateTransform = function() -{ - if (this.dirty || !this.anchor.equals(this._prevAnchor)) - { - this.updateText(); - this.dirty = false; - this._prevAnchor.copyFrom(this.anchor); - } - - PIXI.DisplayObjectContainer.prototype.updateTransform.call(this); -}; - -PIXI.BitmapText.fonts = {}; - /** * @author Mat Groves http://matgroves.com/ @Doormat23 */ @@ -6411,7 +5829,7 @@ PIXI.WebGLSpriteBatch.prototype.renderTilingSprite = function(sprite) // Get the sprites current alpha and tint and combine them into a single color var tint = sprite.tint; - var color = (tint >> 16) + (tint & 0xff00) + ((tint & 0xff) << 16) + (sprite.alpha * 255 << 24); + var color = (tint >> 16) + (tint & 0xff00) + ((tint & 0xff) << 16) + (sprite.worldAlpha * 255 << 24); var positions = this.positions; var colors = this.colors; @@ -8070,7 +7488,6 @@ PIXI.CanvasRenderer = function(width, height, options) */ this.autoResize = options.autoResize || false; - /** * The width of the canvas view * @@ -8146,7 +7563,6 @@ PIXI.CanvasRenderer = function(width, height, options) /** * If true Pixi will Math.floor() x/y values when rendering, stopping pixel interpolation. * Handy for crisp pixel art and speed on legacy devices. - * */ roundPixels: false }; @@ -9212,12 +8628,11 @@ PIXI.Graphics.prototype.drawRect = function(x, y, width, height) /** * @method drawRoundedRect - * * @param x {Number} The X coord of the top-left of the rectangle * @param y {Number} The Y coord of the top-left of the rectangle * @param width {Number} The width of the rectangle * @param height {Number} The height of the rectangle - * @param radius {Number} Radius of the rectangle corners + * @param radius {Number} Radius of the rectangle corners. In WebGL this must be a value between 0 and 9. */ PIXI.Graphics.prototype.drawRoundedRect = function(x, y, width, height, radius) { @@ -9226,15 +8641,15 @@ PIXI.Graphics.prototype.drawRoundedRect = function(x, y, width, height, radius) return this; }; -/* -* 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 {Graphics} This Graphics object. -*/ +/** + * Draws a circle. + * + * @method drawCircle + * @param x {Number} The X coordinate of the center of the circle + * @param y {Number} The Y coordinate of the center of the circle + * @param diameter {Number} The diameter of the circle + * @return {Graphics} + */ PIXI.Graphics.prototype.drawCircle = function(x, y, diameter) { this.drawShape(new PIXI.Circle(x, y, diameter)); @@ -9826,8 +9241,9 @@ PIXI.Graphics.prototype.drawShape = function(shape) this.currentPath = null; // Handle mixed-type polygons - if (shape instanceof PIXI.Polygon) + if (shape instanceof Phaser.Polygon) { + shape = shape.clone(); shape.flatten(); } @@ -10710,6 +10126,15 @@ PIXI.TilingSprite = function(texture, width, height) * @default 0xFFFFFF */ this.tint = 0xFFFFFF; + + /** + * If enabled a green rectangle will be drawn behind the generated tiling texture, allowing you to visually + * debug the texture being used. + * + * @property textureDebug + * @type Boolean + */ + this.textureDebug = false; /** * The blend mode to be applied to the sprite @@ -10838,6 +10263,7 @@ PIXI.TilingSprite.prototype._renderWebGL = function(renderSession) } renderSession.spriteBatch.start(); + }; /** @@ -11008,9 +10434,11 @@ PIXI.TilingSprite.prototype.generateTilingTexture = function(forcePowerOfTwo) this.tilingTexture.needsUpdate = true; } - // Debug - this.canvasBuffer.context.strokeStyle = 'rgb(0,255,0)'; - this.canvasBuffer.context.strokeRect(0, 0, targetWidth, targetHeight); + if (this.textureDebug) + { + this.canvasBuffer.context.strokeStyle = '#00ff00'; + this.canvasBuffer.context.strokeRect(0, 0, targetWidth, targetHeight); + } this.canvasBuffer.context.drawImage(texture.baseTexture.source, texture.crop.x, @@ -12022,7 +11450,7 @@ PIXI.RenderTexture.prototype.clear = function() */ PIXI.RenderTexture.prototype.renderWebGL = function(displayObject, matrix, clear) { - if (!this.valid) + if (!this.valid || displayObject.alpha === 0) { return; } @@ -12031,9 +11459,6 @@ PIXI.RenderTexture.prototype.renderWebGL = function(displayObject, matrix, clear matrix.translate(0, this.projection.y * 2); matrix.scale(1, -1); - // Set worldAlpha to ensure that the object is renderer at full opacity - displayObject.worldAlpha = 1; - // Time to update all the children of the displayObject with the new matrix. for (var i = 0; i < displayObject.children.length; i++) { @@ -12071,14 +11496,11 @@ PIXI.RenderTexture.prototype.renderWebGL = function(displayObject, matrix, clear */ PIXI.RenderTexture.prototype.renderCanvas = function(displayObject, matrix, clear) { - if (!this.valid) + if (!this.valid || displayObject.alpha === 0) { return; } - // setWorld Alpha to ensure that the object is rendered at full opacity - displayObject.worldAlpha = 1; - // Time to update all the children of the displayObject with the new matrix (what new matrix? there isn't one!) for (var i = 0; i < displayObject.children.length; i++) { @@ -12317,7 +11739,8 @@ var Phaser = Phaser || { VIDEO: 28, /** - * Various blend modes supported by pixi. IMPORTANT - The WebGL renderer only supports the NORMAL, ADD, MULTIPLY and SCREEN blend modes. + * Various blend modes supported by Pixi. + * IMPORTANT: The WebGL renderer only supports the NORMAL, ADD, MULTIPLY and SCREEN blend modes. * * @property {Object} blendModes * @property {Number} blendModes.NORMAL @@ -12360,7 +11783,7 @@ var Phaser = Phaser || { }, /** - * The scale modes that are supported by pixi. + * The scale modes that are supported by Pixi. * * The DEFAULT scale mode affects the default scaling mode of future operations. * It can be re-assigned to either LINEAR or NEAREST, depending upon suitability. @@ -12636,45 +12059,6 @@ Phaser.Utils = { return (Math.random() < 0.5) ? choice1 : choice2; }, - /** - * Transposes the elements of the given matrix (array of arrays). - * - * @method Phaser.Utils.transposeArray - * @param {Array} array - The matrix to transpose. - * @return {Array} A new transposed matrix - * @deprecated 2.2.0 - Use Phaser.ArrayUtils.transposeMatrix - */ - transposeArray: function (array) { - return Phaser.ArrayUtils.transposeMatrix(array); - }, - - /** - * Rotates the given matrix (array of arrays). - * - * Based on the routine from {@link http://jsfiddle.net/MrPolywhirl/NH42z/}. - * - * @method Phaser.Utils.rotateArray - * @param {Array} matrix - The array to rotate; this matrix _may_ be altered. - * @param {number|string} direction - The amount to rotate: the roation in degrees (90, -90, 270, -270, 180) or a string command ('rotateLeft', 'rotateRight' or 'rotate180'). - * @return {Array} The rotated matrix. The source matrix should be discarded for the returned matrix. - * @deprecated 2.2.0 - Use Phaser.ArrayUtils.rotateMatrix - */ - rotateArray: function (matrix, direction) { - return Phaser.ArrayUtils.rotateMatrix(matrix, direction); - }, - - /** - * A standard Fisher-Yates Array shuffle implementation. - * - * @method Phaser.Utils.shuffle - * @param {any[]} array - The array to shuffle. - * @return {any[]} The shuffled array. - * @deprecated 2.2.0 - User Phaser.ArrayUtils.shuffle - */ - shuffle: function (array) { - return Phaser.ArrayUtils.shuffle(array); - }, - /** * Get a unit dimension from a string. * @@ -12719,13 +12103,13 @@ Phaser.Utils = { }, /** - * Javascript string pad http://www.webtoolkit.info/. + * JavaScript string pad http://www.webtoolkit.info/. * * @method Phaser.Utils.pad * @param {string} str - The target string. - * @param {number} len - The number of characters to be added. - * @param {number} pad - The string to pad it out with (defaults to a space). - * @param {number} [dir=3] The direction dir = 1 (left), 2 (right), 3 (both). + * @param {integer} [len=0] - The number of characters to be added. + * @param {string} [pad=" "] - The string to pad it out with (defaults to a space). + * @param {integer} [dir=3] The direction dir = 1 (left), 2 (right), 3 (both). * @return {string} The padded string */ pad: function (str, len, pad, dir) { @@ -12798,6 +12182,7 @@ Phaser.Utils = { /** * This is a slightly modified version of http://api.jquery.com/jQuery.extend/ + * * @method Phaser.Utils.extend * @param {boolean} deep - Perform a deep copy? * @param {object} target - The target object to copy to. @@ -13049,6 +12434,31 @@ Phaser.Circle.prototype = { }, + /** + * Returns a uniformly distributed random point from anywhere within this Circle. + * + * @method Phaser.Circle#random + * @param {Phaser.Point|object} [out] - A Phaser.Point, or any object with public x/y properties, that the values will be set in. + * If no object is provided a new Phaser.Point object will be created. In high performance areas avoid this by re-using an existing object. + * @return {Phaser.Point} An object containing the random point in its `x` and `y` properties. + */ + random: function (out) { + + if (typeof out === 'undefined') { out = new Phaser.Point(); } + + var t = 2 * Math.PI * Math.random(); + var u = Math.random() + Math.random(); + var r = (u > 1) ? 2 - u : u; + var x = r * Math.cos(t); + var y = r * Math.sin(t); + + out.x = this.x + (x * this.radius); + out.y = this.y + (y * this.radius); + + return out; + + }, + /** * Returns the framing rectangle of the circle as a Phaser.Rectangle object. * @@ -13666,6 +13076,7 @@ Phaser.Ellipse.prototype = { /** * Return true if the given x/y coordinates are within this Ellipse object. + * * @method Phaser.Ellipse#contains * @param {number} x - The X value of the coordinate to test. * @param {number} y - The Y value of the coordinate to test. @@ -13677,6 +13088,31 @@ Phaser.Ellipse.prototype = { }, + /** + * Returns a uniformly distributed random point from anywhere within this Ellipse. + * + * @method Phaser.Ellipse#random + * @param {Phaser.Point|object} [out] - A Phaser.Point, or any object with public x/y properties, that the values will be set in. + * If no object is provided a new Phaser.Point object will be created. In high performance areas avoid this by re-using an existing object. + * @return {Phaser.Point} An object containing the random point in its `x` and `y` properties. + */ + random: function (out) { + + if (typeof out === 'undefined') { out = new Phaser.Point(); } + + var p = Math.random() * Math.PI * 2; + var r = Math.random(); + + out.x = Math.sqrt(r) * Math.cos(p); + out.y = Math.sqrt(r) * Math.sin(p); + + out.x = this.x + (out.x * this.width / 2.0); + out.y = this.y + (out.y * this.height / 2.0); + + return out; + + }, + /** * Returns a string representation of this object. * @method Phaser.Ellipse#toString @@ -13932,6 +13368,30 @@ Phaser.Line.prototype = { }, + /** + * Rotates the line by the amount specified in `angle`. + * + * Rotation takes place from the center of the line. + * + * If you wish to rotate from either end see Line.start.rotate or Line.end.rotate. + * + * @method Phaser.Line#rotate + * @param {number} angle - The angle in radians (unless asDegrees is true) to rotate the line by. + * @param {boolean} [asDegrees=false] - Is the given angle in radians (false) or degrees (true)? + * @return {Phaser.Line} This line object + */ + rotate: function (angle, asDegrees) { + + var x = this.start.x; + var y = this.start.y; + + this.start.rotate(this.end.x, this.end.y, angle, asDegrees, this.length); + this.end.rotate(x, y, angle, asDegrees, this.length); + + return this; + + }, + /** * Checks for intersection between this line and another Line. * If asSegment is true it will check for segment intersection. If asSegment is false it will check for line intersection. @@ -13996,6 +13456,27 @@ Phaser.Line.prototype = { }, + /** + * Picks a random point from anywhere on the Line segment and returns it. + * + * @method Phaser.Line#random + * @param {Phaser.Point|object} [out] - A Phaser.Point, or any object with public x/y properties, that the values will be set in. + * If no object is provided a new Phaser.Point object will be created. In high performance areas avoid this by re-using an object. + * @return {Phaser.Point} An object containing the random point in its `x` and `y` properties. + */ + random: function (out) { + + if (typeof out === 'undefined') { out = new Phaser.Point(); } + + var t = Math.random(); + + out.x = this.start.x + t * (this.end.x - this.start.x); + out.y = this.start.y + t * (this.end.y - this.start.y); + + return out; + + }, + /** * Using Bresenham's line algorithm this will return an array of all coordinates on this line. * The start and end points are rounded before this runs as the algorithm works on integers. @@ -14841,7 +14322,7 @@ Phaser.Point.prototype = { /** * Sets the `x` and `y` values of this Point object to the given values. * If you omit the `y` value then the `x` value will be applied to both, for example: - * `Point.setTo(2)` is the same as `Point.setTo(2, 2)` + * `Point.set(2)` is the same as `Point.set(2, 2)` * * @method Phaser.Point#set * @param {number} x - The horizontal value of this point. @@ -15062,7 +14543,7 @@ Phaser.Point.prototype = { * @param {number} x - The x coordinate of the anchor point. * @param {number} y - The y coordinate of the anchor point. * @param {number} angle - The angle in radians (unless asDegrees is true) to rotate the Point to. - * @param {boolean} asDegrees - Is the given rotation in radians (false) or degrees (true)? + * @param {boolean} [asDegrees=false] - Is the given angle in radians (false) or degrees (true)? * @param {number} [distance] - An optional distance constraint between the Point and the anchor. * @return {Phaser.Point} The modified point object. */ @@ -15539,36 +15020,44 @@ Phaser.Point.normalize = function (a, out) { }; /** -* Rotates a Point around the x/y coordinates given to the desired angle. +* Rotates a Point object, or any object with exposed x/y properties, around the given coordinates by +* the angle specified. If the angle between the point and coordinates was 45 deg and the angle argument +* is 45 deg then the resulting angle will be 90 deg, as the angle argument is added to the current angle. +* +* The distance allows you to specify a distance constraint for the rotation between the point and the +* coordinates. If none is given the distance between the two is calculated and used. * * @method Phaser.Point.rotate * @param {Phaser.Point} a - The Point object to rotate. * @param {number} x - The x coordinate of the anchor point * @param {number} y - The y coordinate of the anchor point -* @param {number} angle - The angle in radians (unless asDegrees is true) to rotate the Point to. -* @param {boolean} [asDegrees=false] - Is the given rotation in radians (false) or degrees (true)? +* @param {number} angle - The angle in radians (unless asDegrees is true) to rotate the Point by. +* @param {boolean} [asDegrees=false] - Is the given angle in radians (false) or degrees (true)? * @param {number} [distance] - An optional distance constraint between the Point and the anchor. * @return {Phaser.Point} The modified point object. */ Phaser.Point.rotate = function (a, x, y, angle, asDegrees, distance) { - asDegrees = asDegrees || false; - distance = distance || null; + if (typeof asDegrees === 'undefined') { asDegrees = false; } + if (typeof distance === 'undefined') { distance = null; } if (asDegrees) { angle = Phaser.Math.degToRad(angle); } - // Get distance from origin (cx/cy) to this point if (distance === null) { + // Get distance from origin (cx/cy) to this point distance = Math.sqrt(((x - a.x) * (x - a.x)) + ((y - a.y) * (y - a.y))); } - var requiredAngle = angle + Math.atan2(a.y - y, a.x - x); + var t = angle + Math.atan2(a.y - y, a.x - x); - return a.setTo(x + distance * Math.cos(requiredAngle), y + distance * Math.sin(requiredAngle)); + a.x = x + distance * Math.cos(t); + a.y = y + distance * Math.sin(t); + + return a; }; @@ -16182,6 +15671,24 @@ Phaser.Rectangle.prototype = { }, + /** + * Resize the Rectangle by providing a new width and height. + * The x and y positions remain unchanged. + * + * @method Phaser.Rectangle#resize + * @param {number} width - The width of the Rectangle. Should always be either zero or a positive value. + * @param {number} height - The height of the Rectangle. Should always be either zero or a positive value. + * @return {Phaser.Rectangle} This Rectangle object + */ + resize: function (width, height) { + + this.width = width; + this.height = height; + + return this; + + }, + /** * Returns a new Rectangle object with the same values for the x, y, width, and height properties as the original Rectangle object. * @method Phaser.Rectangle#clone @@ -16290,6 +15797,25 @@ Phaser.Rectangle.prototype = { }, + /** + * Returns a uniformly distributed random point from anywhere within this Rectangle. + * + * @method Phaser.Rectangle#random + * @param {Phaser.Point|object} [out] - A Phaser.Point, or any object with public x/y properties, that the values will be set in. + * If no object is provided a new Phaser.Point object will be created. In high performance areas avoid this by re-using an existing object. + * @return {Phaser.Point} An object containing the random point in its `x` and `y` properties. + */ + random: function (out) { + + if (typeof out === 'undefined') { out = new Phaser.Point(); } + + out.x = this.randomX; + out.y = this.randomY; + + return out; + + }, + /** * Returns a string representation of this object. * @method Phaser.Rectangle#toString @@ -17064,12 +16590,6 @@ Phaser.Camera = function (game, id, x, y, width, height) { */ this.view = new Phaser.Rectangle(x, y, width, height); - /** - * @property {Phaser.Rectangle} screenView - Used by Sprites to work out Camera culling. - * @deprecated No longer used for camera culling. Uses Camera.view instead. - */ - this.screenView = new Phaser.Rectangle(x, y, width, height); - /** * The Camera is bound to this Rectangle and cannot move outside of it. By default it is enabled and set to the size of the World. * The Rectangle can be located anywhere in the world and updated as often as you like. If you don't wish the Camera to be bound @@ -17541,6 +17061,247 @@ Object.defineProperty(Phaser.Camera.prototype, "height", { * @license {@link https://github.com/photonstorm/phaser/blob/master/license.txt|MIT License} */ +/** +* +* TODO: Gradient generator +* TODO: Look at sfxr for audio gen +* TODO: Dither support +* TODO: Sprite Sheet generator +* +* @class Phaser.Create +* @constructor +* @param {Phaser.Game} game - Game reference to the currently running game. + */ +Phaser.Create = function (game) { + + /** + * @property {Phaser.Game} game - A reference to the currently running Game. + */ + this.game = game; + + this.bmd = game.make.bitmapData(); + + this.canvas = this.bmd.canvas; + this.ctx = this.bmd.context; + + // http://androidarts.com/palette/16pal.htm + + // { 0: '#000', 1: '#', 2: '#', 3: '#', 4: '#', 5: '#', 6: '#', 7: '#', 8: '#', 9: '#', A: '#', B: '#', C: '#', D: '#', E: '#', F: '#' } + + this.palettes = [ + { 0: '#000', 1: '#9D9D9D', 2: '#FFF', 3: '#BE2633', 4: '#E06F8B', 5: '#493C2B', 6: '#A46422', 7: '#EB8931', 8: '#F7E26B', 9: '#2F484E', A: '#44891A', B: '#A3CE27', C: '#1B2632', D: '#005784', E: '#31A2F2', F: '#B2DCEF' }, + { 0: '#000', 1: '#191028', 2: '#46af45', 3: '#a1d685', 4: '#453e78', 5: '#7664fe', 6: '#833129', 7: '#9ec2e8', 8: '#dc534b', 9: '#e18d79', A: '#d6b97b', B: '#e9d8a1', C: '#216c4b', D: '#d365c8', E: '#afaab9', F: '#f5f4eb' }, + { 0: '#000', 1: '#2234d1', 2: '#0c7e45', 3: '#44aacc', 4: '#8a3622', 5: '#5c2e78', 6: '#aa5c3d', 7: '#b5b5b5', 8: '#5e606e', 9: '#4c81fb', A: '#6cd947', B: '#7be2f9', C: '#eb8a60', D: '#e23d69', E: '#ffd93f', F: '#fff' }, + { 0: '#000', 1: '#fff', 2: '#8b4131', 3: '#7bbdc5', 4: '#8b41ac', 5: '#6aac41', 6: '#3931a4', 7: '#d5de73', 8: '#945a20', 9: '#5a4100', A: '#bd736a', B: '#525252', C: '#838383', D: '#acee8b', E: '#7b73de', F: '#acacac' }, + { 0: '#000', 1: '#191028', 2: '#46af45', 3: '#a1d685', 4: '#453e78', 5: '#7664fe', 6: '#833129', 7: '#9ec2e8', 8: '#dc534b', 9: '#e18d79', A: '#d6b97b', B: '#e9d8a1', C: '#216c4b', D: '#d365c8', E: '#afaab9', F: '#fff' } + ]; + +}; + +Phaser.Create.PALETTE_ARNE = 0; +Phaser.Create.PALETTE_JMP = 1; +Phaser.Create.PALETTE_CGA = 2; +Phaser.Create.PALETTE_C64 = 3; +Phaser.Create.PALETTE_JAPANESE_MACHINE = 4; + +Phaser.Create.prototype = { + + texture: function (key, data, pixelWidth, pixelHeight, palette) { + + if (typeof pixelWidth === 'undefined') { pixelWidth = 8; } + if (typeof pixelHeight === 'undefined') { pixelHeight = pixelWidth; } + if (typeof palette === 'undefined') { palette = 0; } + + var w = data[0].length * pixelWidth; + var h = data.length * pixelHeight; + + this.bmd.resize(w, h); + this.bmd.clear(); + + // Draw it + for (var y = 0; y < data.length; y++) + { + var row = data[y]; + + for (var x = 0; x < row.length; x++) + { + var d = row[x]; + + if (d !== '.' && d !== ' ') + { + this.ctx.fillStyle = this.palettes[palette][d]; + this.ctx.fillRect(x * pixelWidth, y * pixelHeight, pixelWidth, pixelHeight); + } + } + } + + return this.bmd.generateTexture(key); + + }, + + grid: function (key, width, height, cellWidth, cellHeight, color) { + + this.bmd.resize(width, height); + + this.ctx.fillStyle = color; + + for (var y = 0; y < height; y += cellHeight) + { + this.ctx.fillRect(0, y, width, 1); + } + + for (var x = 0; x < width; x += cellWidth) + { + this.ctx.fillRect(x, 0, 1, height); + } + + return this.bmd.generateTexture(key); + + } + +}; + +Phaser.Create.prototype.constructor = Phaser.Create; + +/* + * RIFFWAVE.js v0.03 - Audio encoder for HTML5