var Phaser; (function (Phaser) { (function (FX) { /// /** * Phaser - FX - Camera - Flash * * The camera is filled with the given color and returns to normal at the given duration. */ (function (Camera) { var Flash = (function () { function Flash(game) { this._fxFlashComplete = null; this._fxFlashDuration = 0; this._fxFlashAlpha = 0; this._game = game; } Flash.prototype.start = /** * The camera is filled with this color and returns to normal at the given duration. * * @param Color The color you want to use in 0xRRGGBB format, i.e. 0xffffff for white. * @param Duration How long it takes for the flash to fade. * @param OnComplete An optional function you want to run when the flash finishes. Set to null for no callback. * @param Force Force an already running flash effect to reset. */ function (color, duration, onComplete, force) { if (typeof color === "undefined") { color = 0xffffff; } if (typeof duration === "undefined") { duration = 1; } if (typeof onComplete === "undefined") { onComplete = null; } if (typeof force === "undefined") { force = false; } if(force === false && this._fxFlashAlpha > 0) { // You can't flash again unless you force it return; } if(duration <= 0) { duration = 1; } var red = color >> 16 & 0xFF; var green = color >> 8 & 0xFF; var blue = color & 0xFF; this._fxFlashColor = 'rgba(' + red + ',' + green + ',' + blue + ','; this._fxFlashDuration = duration; this._fxFlashAlpha = 1; this._fxFlashComplete = onComplete; }; Flash.prototype.postUpdate = function () { // Update the Flash effect if(this._fxFlashAlpha > 0) { this._fxFlashAlpha -= this._game.time.elapsed / this._fxFlashDuration; if(this._game.math.roundTo(this._fxFlashAlpha, -2) <= 0) { this._fxFlashAlpha = 0; if(this._fxFlashComplete !== null) { this._fxFlashComplete(); } } } }; Flash.prototype.postRender = function (camera, cameraX, cameraY, cameraWidth, cameraHeight) { if(this._fxFlashAlpha > 0) { this._game.stage.context.fillStyle = this._fxFlashColor + this._fxFlashAlpha + ')'; this._game.stage.context.fillRect(cameraX, cameraY, cameraWidth, cameraHeight); } }; return Flash; })(); Camera.Flash = Flash; })(FX.Camera || (FX.Camera = {})); var Camera = FX.Camera; })(Phaser.FX || (Phaser.FX = {})); var FX = Phaser.FX; })(Phaser || (Phaser = {})); var Phaser; (function (Phaser) { (function (FX) { /// /** * Phaser - FX - Camera - Border * * Creates a border around a camera. */ (function (Camera) { var Border = (function () { function Border(game, parent) { /** * Whether render border of this camera or not. (default is false) * @type {boolean} */ this.showBorder = false; /** * Color of border of this camera. (in css color string) * @type {string} */ this.borderColor = 'rgb(255,255,255)'; this._game = game; this._parent = parent; } Border.prototype.start = /** * You can name the function that starts the effect whatever you like, but we used 'start' in our effects. */ function () { }; Border.prototype.postRender = /** * Post-render is called during the objects render cycle, after the children/image data has been rendered. * It happens directly BEFORE a canvas context.restore has happened if added to a Camera. */ function (camera, cameraX, cameraY, cameraWidth, cameraHeight) { if(this.showBorder == true) { this._game.stage.context.strokeStyle = this.borderColor; this._game.stage.context.lineWidth = 1; this._game.stage.context.rect(camera.scaledX, camera.scaledY, camera.worldView.width, camera.worldView.height); this._game.stage.context.stroke(); } }; return Border; })(); Camera.Border = Border; })(FX.Camera || (FX.Camera = {})); var Camera = FX.Camera; })(Phaser.FX || (Phaser.FX = {})); var FX = Phaser.FX; })(Phaser || (Phaser = {})); var Phaser; (function (Phaser) { (function (FX) { /// /** * Phaser - FX - Camera - Template * * A Template FX file you can use to create your own Camera FX. * If you don't use any of the methods below (i.e. preUpdate, render, etc) then DELETE THEM to avoid un-necessary calls by the FXManager. */ (function (Camera) { var Template = (function () { function Template(game, parent) { this._game = game; this._parent = parent; } Template.prototype.start = /** * You can name the function that starts the effect whatever you like, but we used 'start' in our effects. */ function () { }; Template.prototype.preUpdate = /** * Pre-update is called at the start of the objects update cycle, before any other updates have taken place. */ function () { }; Template.prototype.postUpdate = /** * Post-update is called at the end of the objects update cycle, after other update logic has taken place. */ function () { }; Template.prototype.preRender = /** * Pre-render is called at the start of the object render cycle, before any transforms have taken place. * It happens directly AFTER a canvas context.save has happened if added to a Camera. */ function (camera, cameraX, cameraY, cameraWidth, cameraHeight) { }; Template.prototype.render = /** * render is called during the objects render cycle, right after all transforms have finished, but before any children/image data is rendered. */ function (camera, cameraX, cameraY, cameraWidth, cameraHeight) { }; Template.prototype.postRender = /** * Post-render is called during the objects render cycle, after the children/image data has been rendered. * It happens directly BEFORE a canvas context.restore has happened if added to a Camera. */ function (camera, cameraX, cameraY, cameraWidth, cameraHeight) { }; return Template; })(); Camera.Template = Template; })(FX.Camera || (FX.Camera = {})); var Camera = FX.Camera; })(Phaser.FX || (Phaser.FX = {})); var FX = Phaser.FX; })(Phaser || (Phaser = {})); var Phaser; (function (Phaser) { (function (FX) { /// /** * Phaser - FX - Camera - Mirror * * Creates a mirror effect for a camera. * Can mirror the camera image horizontally, vertically or both with an optional fill color overlay. */ (function (Camera) { var Mirror = (function () { function Mirror(game, parent) { this._mirrorColor = null; this.flipX = false; this.flipY = true; this.cls = false; this._game = game; this._parent = parent; this._canvas = document.createElement('canvas'); this._canvas.width = parent.width; this._canvas.height = parent.height; this._context = this._canvas.getContext('2d'); } Mirror.prototype.start = /** * This is the rectangular region to grab from the Camera used in the Mirror effect * It is rendered to the Stage at Mirror.x/y (note the use of Stage coordinates, not World coordinates) */ function (x, y, region, fillColor) { if (typeof fillColor === "undefined") { fillColor = 'rgba(0, 0, 100, 0.5)'; } this.x = x; this.y = y; this._mirrorX = region.x; this._mirrorY = region.y; this._mirrorWidth = region.width; this._mirrorHeight = region.height; if(fillColor) { this._mirrorColor = fillColor; this._context.fillStyle = this._mirrorColor; } }; Mirror.prototype.postRender = /** * Post-render is called during the objects render cycle, after the children/image data has been rendered. * It happens directly BEFORE a canvas context.restore has happened if added to a Camera. */ function (camera, cameraX, cameraY, cameraWidth, cameraHeight) { //if (this.cls) //{ // this._context.clearRect(0, 0, this._mirrorWidth, this._mirrorHeight); //} this._sx = cameraX + this._mirrorX; this._sy = cameraY + this._mirrorY; if(this.flipX == true && this.flipY == false) { this._sx = 0; } else if(this.flipY == true && this.flipX == false) { this._sy = 0; } this._context.drawImage(this._game.stage.canvas, // Source Image this._sx, // Source X (location within the source image) this._sy, // Source Y this._mirrorWidth, // Source Width this._mirrorHeight, // Source Height 0, // Destination X (where on the canvas it'll be drawn) 0, // Destination Y this._mirrorWidth, // Destination Width (always same as Source Width unless scaled) this._mirrorHeight); // Destination Height (always same as Source Height unless scaled) if(this._mirrorColor) { this._context.fillRect(0, 0, this._mirrorWidth, this._mirrorHeight); } if(this.flipX && this.flipY) { this._game.stage.context.transform(-1, 0, 0, -1, this._mirrorWidth, this._mirrorHeight); this._game.stage.context.drawImage(this._canvas, -this.x, -this.y); } else if(this.flipX) { this._game.stage.context.transform(-1, 0, 0, 1, this._mirrorWidth, 0); this._game.stage.context.drawImage(this._canvas, -this.x, this.y); } else if(this.flipY) { this._game.stage.context.transform(1, 0, 0, -1, 0, this._mirrorHeight); this._game.stage.context.drawImage(this._canvas, this.x, -this.y); } }; return Mirror; })(); Camera.Mirror = Mirror; })(FX.Camera || (FX.Camera = {})); var Camera = FX.Camera; })(Phaser.FX || (Phaser.FX = {})); var FX = Phaser.FX; })(Phaser || (Phaser = {})); var Phaser; (function (Phaser) { (function (FX) { /// /** * Phaser - FX - Camera - Shadow * * Creates a drop-shadow effect on the camera window. */ (function (Camera) { var Shadow = (function () { function Shadow(game, parent) { /** * Render camera shadow or not. (default is false) * @type {boolean} */ this.showShadow = false; /** * Color of shadow, in css color string. * @type {string} */ this.shadowColor = 'rgb(0,0,0)'; /** * Blur factor of shadow. * @type {number} */ this.shadowBlur = 10; /** * Offset of the shadow from camera's position. * @type {Point} */ this.shadowOffset = new Phaser.Point(4, 4); this._game = game; this._parent = parent; } Shadow.prototype.start = /** * You can name the function that starts the effect whatever you like, but we used 'start' in our effects. */ function () { }; Shadow.prototype.preRender = /** * Pre-render is called at the start of the object render cycle, before any transforms have taken place. * It happens directly AFTER a canvas context.save has happened if added to a Camera. */ function (camera, cameraX, cameraY, cameraWidth, cameraHeight) { // Shadow if(this.showShadow == true) { this._game.stage.context.shadowColor = this.shadowColor; this._game.stage.context.shadowBlur = this.shadowBlur; this._game.stage.context.shadowOffsetX = this.shadowOffset.x; this._game.stage.context.shadowOffsetY = this.shadowOffset.y; } }; Shadow.prototype.render = /** * render is called during the objects render cycle, right after all transforms have finished, but before any children/image data is rendered. */ function (camera, cameraX, cameraY, cameraWidth, cameraHeight) { // Shadow off if(this.showShadow == true) { this._game.stage.context.shadowBlur = 0; this._game.stage.context.shadowOffsetX = 0; this._game.stage.context.shadowOffsetY = 0; } }; return Shadow; })(); Camera.Shadow = Shadow; })(FX.Camera || (FX.Camera = {})); var Camera = FX.Camera; })(Phaser.FX || (Phaser.FX = {})); var FX = Phaser.FX; })(Phaser || (Phaser = {})); var Phaser; (function (Phaser) { (function (FX) { /// /** * Phaser - FX - Camera - Scanlines * * Give your game that classic retro feel! */ (function (Camera) { var Scanlines = (function () { function Scanlines(game, parent) { this.spacing = 4; this.color = 'rgba(0, 0, 0, 0.3)'; this._game = game; this._parent = parent; } Scanlines.prototype.postRender = function (camera, cameraX, cameraY, cameraWidth, cameraHeight) { this._game.stage.context.fillStyle = this.color; for(var y = cameraY; y < cameraHeight; y += this.spacing) { this._game.stage.context.fillRect(cameraX, y, cameraWidth, 1); } }; return Scanlines; })(); Camera.Scanlines = Scanlines; })(FX.Camera || (FX.Camera = {})); var Camera = FX.Camera; })(Phaser.FX || (Phaser.FX = {})); var FX = Phaser.FX; })(Phaser || (Phaser = {})); var Phaser; (function (Phaser) { (function (FX) { /// /** * Phaser - FX - Camera - Shake * * A simple camera shake effect. */ (function (Camera) { var Shake = (function () { function Shake(game, camera) { this._fxShakeIntensity = 0; this._fxShakeDuration = 0; this._fxShakeComplete = null; this._fxShakeOffset = new Phaser.Point(0, 0); this._fxShakeDirection = 0; this._fxShakePrevX = 0; this._fxShakePrevY = 0; this._game = game; this._parent = camera; } Shake.SHAKE_BOTH_AXES = 0; Shake.SHAKE_HORIZONTAL_ONLY = 1; Shake.SHAKE_VERTICAL_ONLY = 2; Shake.prototype.start = /** * A simple camera shake effect. * * @param Intensity Percentage of screen size representing the maximum distance that the screen can move while shaking. * @param Duration The length in seconds that the shaking effect should last. * @param OnComplete A function you want to run when the shake effect finishes. * @param Force Force the effect to reset (default = true, unlike flash() and fade()!). * @param Direction Whether to shake on both axes, just up and down, or just side to side (use class constants SHAKE_BOTH_AXES, SHAKE_VERTICAL_ONLY, or SHAKE_HORIZONTAL_ONLY). */ function (intensity, duration, onComplete, force, direction) { if (typeof intensity === "undefined") { intensity = 0.05; } if (typeof duration === "undefined") { duration = 0.5; } if (typeof onComplete === "undefined") { onComplete = null; } if (typeof force === "undefined") { force = true; } if (typeof direction === "undefined") { direction = Shake.SHAKE_BOTH_AXES; } if(!force && ((this._fxShakeOffset.x != 0) || (this._fxShakeOffset.y != 0))) { return; } // If a shake is not already running we need to store the offsets here if(this._fxShakeOffset.x == 0 && this._fxShakeOffset.y == 0) { this._fxShakePrevX = this._parent.x; this._fxShakePrevY = this._parent.y; } this._fxShakeIntensity = intensity; this._fxShakeDuration = duration; this._fxShakeComplete = onComplete; this._fxShakeDirection = direction; this._fxShakeOffset.setTo(0, 0); }; Shake.prototype.postUpdate = function () { // Update the "shake" special effect if(this._fxShakeDuration > 0) { this._fxShakeDuration -= this._game.time.elapsed; if(this._game.math.roundTo(this._fxShakeDuration, -2) <= 0) { this._fxShakeDuration = 0; this._fxShakeOffset.setTo(0, 0); this._parent.x = this._fxShakePrevX; this._parent.y = this._fxShakePrevY; if(this._fxShakeComplete != null) { this._fxShakeComplete(); } } else { if((this._fxShakeDirection == Shake.SHAKE_BOTH_AXES) || (this._fxShakeDirection == Shake.SHAKE_HORIZONTAL_ONLY)) { //this._fxShakeOffset.x = ((this._game.math.random() * this._fxShakeIntensity * this.worldView.width * 2 - this._fxShakeIntensity * this.worldView.width) * this._zoom; this._fxShakeOffset.x = (this._game.math.random() * this._fxShakeIntensity * this._parent.worldView.width * 2 - this._fxShakeIntensity * this._parent.worldView.width); } if((this._fxShakeDirection == Shake.SHAKE_BOTH_AXES) || (this._fxShakeDirection == Shake.SHAKE_VERTICAL_ONLY)) { //this._fxShakeOffset.y = (this._game.math.random() * this._fxShakeIntensity * this.worldView.height * 2 - this._fxShakeIntensity * this.worldView.height) * this._zoom; this._fxShakeOffset.y = (this._game.math.random() * this._fxShakeIntensity * this._parent.worldView.height * 2 - this._fxShakeIntensity * this._parent.worldView.height); } } } }; Shake.prototype.preRender = function (camera, cameraX, cameraY, cameraWidth, cameraHeight) { if((this._fxShakeOffset.x != 0) || (this._fxShakeOffset.y != 0)) { this._parent.x = this._fxShakePrevX + this._fxShakeOffset.x; this._parent.y = this._fxShakePrevY + this._fxShakeOffset.y; } }; return Shake; })(); Camera.Shake = Shake; })(FX.Camera || (FX.Camera = {})); var Camera = FX.Camera; })(Phaser.FX || (Phaser.FX = {})); var FX = Phaser.FX; })(Phaser || (Phaser = {})); var Phaser; (function (Phaser) { (function (FX) { /// /** * Phaser - FX - Camera - Fade * * The camera is filled with the given color and returns to normal at the given duration. */ (function (Camera) { var Fade = (function () { function Fade(game) { this._fxFadeComplete = null; this._fxFadeDuration = 0; this._fxFadeAlpha = 0; this._game = game; } Fade.prototype.start = /** * The camera is gradually filled with this color. * * @param Color The color you want to use in 0xRRGGBB format, i.e. 0xffffff for white. * @param Duration How long it takes for the flash to fade. * @param OnComplete An optional function you want to run when the flash finishes. Set to null for no callback. * @param Force Force an already running flash effect to reset. */ function (color, duration, onComplete, force) { if (typeof color === "undefined") { color = 0x000000; } if (typeof duration === "undefined") { duration = 1; } if (typeof onComplete === "undefined") { onComplete = null; } if (typeof force === "undefined") { force = false; } if(force === false && this._fxFadeAlpha > 0) { // You can't fade again unless you force it return; } if(duration <= 0) { duration = 1; } var red = color >> 16 & 0xFF; var green = color >> 8 & 0xFF; var blue = color & 0xFF; this._fxFadeColor = 'rgba(' + red + ',' + green + ',' + blue + ','; this._fxFadeDuration = duration; this._fxFadeAlpha = 0.01; this._fxFadeComplete = onComplete; }; Fade.prototype.postUpdate = function () { // Update the Fade effect if(this._fxFadeAlpha > 0) { this._fxFadeAlpha += this._game.time.elapsed / this._fxFadeDuration; if(this._game.math.roundTo(this._fxFadeAlpha, -2) >= 1) { this._fxFadeAlpha = 1; if(this._fxFadeComplete !== null) { this._fxFadeComplete(); } } } }; Fade.prototype.postRender = function (camera, cameraX, cameraY, cameraWidth, cameraHeight) { // "Fade" FX if(this._fxFadeAlpha > 0) { this._game.stage.context.fillStyle = this._fxFadeColor + this._fxFadeAlpha + ')'; this._game.stage.context.fillRect(cameraX, cameraY, cameraWidth, cameraHeight); } }; return Fade; })(); Camera.Fade = Fade; })(FX.Camera || (FX.Camera = {})); var Camera = FX.Camera; })(Phaser.FX || (Phaser.FX = {})); var FX = Phaser.FX; })(Phaser || (Phaser = {}));