├── examples ├── img │ ├── daisy.png │ └── sparkle_21x23.png ├── styles.css ├── SpriteSheet_NoRenderer.html ├── Bitmap_Renderers.html ├── SpriteSheet_Renderers.html └── Cache_Renderers.html ├── README.md ├── src ├── renderers │ ├── RendererNullMtx.js │ ├── Renderer2DMtx.js │ ├── Renderer.js │ ├── RendererDOMMtxStr.js │ ├── Renderer2D.js │ ├── RendererSVGStr.js │ ├── RendererDOMStr.js │ ├── RendererDOMMtx.js │ ├── RendererSVGMtxStr.js │ ├── RendererSVGMtx.js │ ├── RendererSWF.js │ └── RendererWebGL.js └── geom │ └── glMatrix-0.9.5.min.js └── lib └── easeljs-NEXT.min.js /examples/img/daisy.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/CreateJS/EaselJSRenderers/HEAD/examples/img/daisy.png -------------------------------------------------------------------------------- /examples/img/sparkle_21x23.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/CreateJS/EaselJSRenderers/HEAD/examples/img/sparkle_21x23.png -------------------------------------------------------------------------------- /examples/styles.css: -------------------------------------------------------------------------------- 1 | body { 2 | background-color: #111; 3 | font-family: sans-serif; 4 | font-size: 14px; 5 | color: #CCC; 6 | } 7 | 8 | a:active, a:visited, a:link 9 | { 10 | color: #CCC; 11 | } 12 | 13 | a:hover 14 | { 15 | text-decoration:none; 16 | } 17 | 18 | .canvasHolder { 19 | width: 980px; 20 | border: solid 15px #222; 21 | } 22 | 23 | .description { 24 | background-color: #222; 25 | width: 980px; 26 | padding: 15px; 27 | margin-bottom:1px; 28 | } 29 | 30 | strong { 31 | color: #FFF; 32 | } -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | ##EASELJS DYNAMIC RENDERERS: 2 | 3 | This is an experiment that aims to provide runtime pluggable renderers for a subset EaselJS content. They allow you to create your content for EaselJS, then render it to a variety of surfaces (ex. Canvas, WebGL, HTML DOM) dynamically at runtime. It is really only intended as a proof of concept, and as a starting point for more complete renderers. 4 | 5 | If you are not familiar with EaselJS already, this is not the best place to start. 6 | 7 | Currently, most renderers support displaying Bitmap, BitmapAnimation, Container, and content that has had .cache() applied (ex. Shape, Text). 8 | 9 | Currently, these renderers have only been developed for and tested in Webkit browsers, as proofs of concept. There is a lot of room for improvement and optimization. For example, it should be possible to extend these renderers to support Text directly, as well as providing mouse & possibly touch interaction for all surfaces. Most renderers (WebGL in particular) would also benefit from sprite sheet generation to reduce texture count, most likely via SpriteSheetBuilder. 10 | 11 | ##Supported surfaces: 12 | 13 | **Null renderer:** 14 | * RendererNullMtx - no rendering. Useful for isolating calculation vs display costs. 15 | 16 | **Canvas 2D:** 17 | * Renderer2DMtx - uses the EaselJS matrix class avoiding save & restore. 18 | * Renderer2D - transformation based renderer using save & restore. 19 | 20 | **HTML DOM:** 21 | * RendererDOMMtx - uses the EaselJS matrix, persistent DOM elements & document fragments. 22 | * RendererDOMMtxStr - generates innerHTML on the surface div using matrix values. 23 | * RendererDOMStr - generates innerHTML on the surface div using transforms. 24 | 25 | **SVG:** 26 | * RendererSVGMtx - uses the EaselJS matrix, persistent SVG elements & document fragments. 27 | * RendererSVGMtxStr - generates SVG strings using matrix values. 28 | * RendererSVGStr - generates SVG strings using transforms. 29 | 30 | **WebGL:** 31 | * RendererWebGL - sample WebGL renderer. Lots of room for optimizations. 32 | 33 | **Flash:** 34 | * RendererSWF - very rough, outdated Flash renderer. Included for reference only. 35 | 36 | The renderers that are most stable, and would make the most sense to extend moving forward are: Renderer2DMtx, RendererDOMMtx, and RendererWebGL. -------------------------------------------------------------------------------- /src/renderers/RendererNullMtx.js: -------------------------------------------------------------------------------- 1 | /* 2 | * RendererNullMtx by Grant Skinner. Dec 5, 2010 3 | * Visit http://easeljs.com/ for documentation, updates and examples. 4 | * 5 | * 6 | * Copyright (c) 2010 Grant Skinner 7 | * 8 | * Permission is hereby granted, free of charge, to any person 9 | * obtaining a copy of this software and associated documentation 10 | * files (the "Software"), to deal in the Software without 11 | * restriction, including without limitation the rights to use, 12 | * copy, modify, merge, publish, distribute, sublicense, and/or sell 13 | * copies of the Software, and to permit persons to whom the 14 | * Software is furnished to do so, subject to the following 15 | * conditions: 16 | * 17 | * The above copyright notice and this permission notice shall be 18 | * included in all copies or substantial portions of the Software. 19 | * 20 | * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, 21 | * EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES 22 | * OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND 23 | * NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT 24 | * HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, 25 | * WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING 26 | * FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR 27 | * OTHER DEALINGS IN THE SOFTWARE. 28 | */ 29 | 30 | /** 31 | * The Easel Javascript library provides a retained graphics mode for canvas 32 | * including a full, hierarchical display list, a core interaction model, and 33 | * helper classes to make working with Canvas much easier. 34 | * @module EaselJS 35 | **/ 36 | 37 | (function(window) { 38 | 39 | /** 40 | * A stage is the root level Container for a display list. Each time its tick method is called, it will render its display 41 | * list to its target canvas. 42 | * @class Stage 43 | * @extends Container 44 | * @constructor 45 | * @param {HTMLCanvasElement} canvas The canvas the stage will render to. 46 | **/ 47 | var RendererNullMtx = function(root, surface) { 48 | this.initialize(root, surface); 49 | } 50 | var p = RendererNullMtx.prototype = new Renderer(); 51 | 52 | // static properties: 53 | 54 | // public properties: 55 | p.snapToPixel = true; 56 | p.skipCalculations = true; 57 | 58 | // constructor: 59 | 60 | // public methods: 61 | 62 | p.getSurface = function(width, height) { 63 | // return an empty div. 64 | if (this.surface == null) { 65 | this.surface = document.createElement("div"); 66 | this.surface.style.overflow = "hidden"; 67 | this.surface.style.position = "absolute"; 68 | this.surface.innerText = "NULL RENDERER SURFACE"+(this.skipCalculations ? " (NO CALCULATIONS)" : "") 69 | } 70 | if (width) { this.surface.style.pixelWidth = width; } 71 | if (height) { this.surface.style.pixelHeight = height; } 72 | return this.surface; 73 | } 74 | 75 | /** 76 | * Clears the target canvas. Useful if autoClear is set to false. 77 | * @method clear 78 | **/ 79 | p.clear = function() { 80 | // null renderer. 81 | } 82 | 83 | p.render = function(displayObject, surface) { 84 | displayObject = displayObject || this.root; 85 | surface = surface || this.surface; 86 | if (displayObject && surface) { 87 | this._render(displayObject, null); 88 | } 89 | } 90 | 91 | p._render = function(o,ctx,mtx) { 92 | if (this.skipCalculations || !o.isVisible()) { return; } 93 | 94 | if (mtx) { 95 | o._matrix.reinitialize(mtx.a,mtx.b,mtx.c,mtx.d,mtx.tx,mtx.ty,mtx.alpha,mtx.shadow,mtx.compositeOperation); 96 | } else { 97 | o._matrix.reinitialize(1,0,0,1,0,0); 98 | } 99 | mtx = o._matrix; 100 | mtx.appendTransform(o.x, o.y, o.scaleX, o.scaleY, o.rotation, o.skewX, o.skewY, o.regX, o.regY); 101 | 102 | // render the element: 103 | if (o instanceof Bitmap || o.cacheCanvas) { 104 | // null renderer. 105 | } else if (o instanceof Container) { 106 | var list = o.children.slice(0); 107 | for (var i=0,l=list.length; i 2 | 3 | 4 | 5 | Pluggable Renderers 6 | 7 | 8 | 9 | 10 | 14 | 15 | 16 | 124 | 125 | 126 | 127 |
128 | 129 | | 130 | 131 | Particles: 132 | 133 | 134 | 135 | 136 | 137 | 138 | 139 | 140 | 141 | 142 | 143 |
144 | 145 | 146 | 147 | 148 | 149 | -------------------------------------------------------------------------------- /src/renderers/Renderer.js: -------------------------------------------------------------------------------- 1 | /* 2 | * Renderer by Grant Skinner. Dec 5, 2010 3 | * Visit http://easeljs.com/ for documentation, updates and examples. 4 | * 5 | * 6 | * Copyright (c) 2010 Grant Skinner 7 | * 8 | * Permission is hereby granted, free of charge, to any person 9 | * obtaining a copy of this software and associated documentation 10 | * files (the "Software"), to deal in the Software without 11 | * restriction, including without limitation the rights to use, 12 | * copy, modify, merge, publish, distribute, sublicense, and/or sell 13 | * copies of the Software, and to permit persons to whom the 14 | * Software is furnished to do so, subject to the following 15 | * conditions: 16 | * 17 | * The above copyright notice and this permission notice shall be 18 | * included in all copies or substantial portions of the Software. 19 | * 20 | * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, 21 | * EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES 22 | * OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND 23 | * NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT 24 | * HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, 25 | * WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING 26 | * FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR 27 | * OTHER DEALINGS IN THE SOFTWARE. 28 | */ 29 | 30 | /** 31 | * The Easel Javascript library provides a retained graphics mode for canvas 32 | * including a full, hierarchical display list, a core interaction model, and 33 | * helper classes to make working with Canvas much easier. 34 | * @module EaselJS 35 | **/ 36 | 37 | (function(window) { 38 | 39 | /** 40 | * A stage is the root level Container for a display list. Each time its tick method is called, it will render its display 41 | * list to its target canvas. 42 | * @class Stage 43 | * @extends Container 44 | * @constructor 45 | * @param {HTMLCanvasElement} canvas The canvas the stage will render to. 46 | **/ 47 | var Renderer = function(root,surface) { 48 | this.initialize(root,surface); 49 | } 50 | var p = Renderer.prototype; 51 | 52 | // static properties: 53 | 54 | // public properties: 55 | p.root = null; 56 | p.surface = null; 57 | p.tickOnUpdate = true; 58 | 59 | // constructor: 60 | 61 | /** 62 | * Initialization method. 63 | * @method initialize 64 | * @param {DisplayObject} root 65 | * @protected 66 | **/ 67 | p.initialize = function(root,surface) { 68 | this.root = root; 69 | this.surface = surface; 70 | } 71 | 72 | // public methods: 73 | 74 | /** 75 | * If the current surface is null, this creates a new DOM object that will be used as the 76 | * display surface for this renderer. For example, for the WebGL renderer, this would return 77 | * a Canvas object with the specified dimensions. If a surface is already set, calling 78 | * createSurface will update the dimensions of the existing surface and return it. 79 | * @method createSurface 80 | * @param width The width of the surface to create (or to resize the current surface to) 81 | * @param height The height of the surface to create (or resize the current surface to) 82 | */ 83 | p.getSurface = function(width, height) {} 84 | 85 | /** 86 | * Clears the surface, ticks all display objects on the display list defined by root, and then renders root 87 | * to the current surface. Use the clear(), tickDisplayList(), and render() methods if you want 88 | * more control over the individual tasks. 89 | * @method update 90 | **/ 91 | p.update = function() { 92 | this.clear(); 93 | if (this.tickOnUpdate) { this.tickDisplayList(this.root, this.arguments); } 94 | this.render(this.root,this.surface); 95 | } 96 | 97 | /** 98 | * Calls the update method. Useful for adding the renderer as a listener to Ticker directly. 99 | * @property tick 100 | * @private 101 | * @type Function 102 | **/ 103 | p.tick = p.update; 104 | 105 | /** 106 | * Clears all graphics that are currently rendered to the surface. Useful if autoClear is set to false. 107 | * @method clear 108 | **/ 109 | p.clear = function() {} 110 | 111 | /** 112 | * Renders the specified displayObject to the specified surface. 113 | * @param displayObject The DisplayObject instance to render. Defaults to root. 114 | * @param surface The surface to render to. This must be the appropriate type for the renderer. Defaults to surface. 115 | */ 116 | p.render = function(displayObject, surface) {} 117 | 118 | p.tickDisplayList = function(displayObject, params) { 119 | if (!displayObject || !displayObject._tick) { return; } 120 | displayObject._tick((params && params.length ? params : null)); 121 | } 122 | 123 | window.Renderer = Renderer; 124 | }(window)); -------------------------------------------------------------------------------- /src/renderers/RendererDOMMtxStr.js: -------------------------------------------------------------------------------- 1 | /* 2 | * RendererDOMMtxStr by Grant Skinner. Dec 5, 2010 3 | * Visit http://easeljs.com/ for documentation, updates and examples. 4 | * 5 | * 6 | * Copyright (c) 2010 Grant Skinner 7 | * 8 | * Permission is hereby granted, free of charge, to any person 9 | * obtaining a copy of this software and associated documentation 10 | * files (the "Software"), to deal in the Software without 11 | * restriction, including without limitation the rights to use, 12 | * copy, modify, merge, publish, distribute, sublicense, and/or sell 13 | * copies of the Software, and to permit persons to whom the 14 | * Software is furnished to do so, subject to the following 15 | * conditions: 16 | * 17 | * The above copyright notice and this permission notice shall be 18 | * included in all copies or substantial portions of the Software. 19 | * 20 | * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, 21 | * EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES 22 | * OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND 23 | * NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT 24 | * HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, 25 | * WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING 26 | * FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR 27 | * OTHER DEALINGS IN THE SOFTWARE. 28 | */ 29 | 30 | /** 31 | * The Easel Javascript library provides a retained graphics mode for canvas 32 | * including a full, hierarchical display list, a core interaction model, and 33 | * helper classes to make working with Canvas much easier. 34 | * @module EaselJS 35 | **/ 36 | 37 | (function(window) { 38 | 39 | /** 40 | * A stage is the root level Container for a display list. Each time its tick method is called, it will render its display 41 | * list to its target canvas. 42 | * @class Stage 43 | * @extends Container 44 | * @constructor 45 | * @param {HTMLCanvasElement} canvas The canvas the stage will render to. 46 | **/ 47 | var RendererDOMMtxStr = function(root, surface) { 48 | this.initialize(root, surface); 49 | } 50 | var p = RendererDOMMtxStr.prototype = new Renderer(); 51 | 52 | // static properties: 53 | 54 | // public properties: 55 | p.snapToPixel = true; 56 | p._tmpZ = 0; 57 | 58 | // constructor: 59 | 60 | // public methods: 61 | 62 | p.getSurface = function(width, height) { 63 | if (this.surface == null) { 64 | this.surface = document.createElement("div"); 65 | this.surface.style.overflow = "hidden"; 66 | this.surface.style.position = "absolute"; 67 | } 68 | if (width) { this.surface.style.pixelWidth = width; } 69 | if (height) { this.surface.style.pixelHeight = height; } 70 | return this.surface; 71 | } 72 | 73 | /** 74 | * Clears the target canvas. Useful if autoClear is set to false. 75 | * @method clear 76 | **/ 77 | p.clear = function() { 78 | if (!this.surface) { return; } 79 | this.surface.innerHTML = ""; 80 | } 81 | 82 | p.render = function(displayObject, surface) { 83 | displayObject = displayObject || this.root; 84 | surface = surface || this.surface; 85 | this._tmpZ = 0; 86 | if (displayObject && surface) { 87 | surface.innerHTML += this._render(displayObject); 88 | } 89 | } 90 | 91 | p._render = function(o,mtx) { 92 | if (!o.isVisible()) { return ""; } 93 | 94 | if (mtx) { 95 | o._matrix.reinitialize(mtx.a,mtx.b,mtx.c,mtx.d,mtx.tx,mtx.ty,mtx.alpha,mtx.shadow,mtx.compositeOperation); 96 | } else { 97 | o._matrix.reinitialize(1,0,0,1,0,0); 98 | } 99 | mtx = o._matrix; 100 | mtx.appendTransform(o.x, o.y, o.scaleX, o.scaleY, o.rotation, o.skewX, o.skewY, o.regX, o.regY); 101 | 102 | var style = "position:absolute;z-index:"+(this._tmpZ++)+";"; 103 | style += "-webkit-transform:matrix("+mtx.a+","+mtx.b+","+mtx.c+","+mtx.d+","+mtx.tx+","+mtx.ty+") translateZ(0);"; 104 | if (o.alpha != 1) { style += "opacity:"+o.alpha+";" } 105 | 106 | // render the element: 107 | var tag = ""; 108 | if (o.cacheCanvas) { 109 | // not really possible when using strings. 110 | } else if (o instanceof Bitmap) { 111 | tag = ""; 112 | } else if (o instanceof Container) { 113 | var list = o.children.slice(0); 114 | for (var i=0,l=list.length; i"; 124 | } 125 | } 126 | return tag; 127 | 128 | } 129 | 130 | window.RendererDOMMtxStr = RendererDOMMtxStr; 131 | }(window)); -------------------------------------------------------------------------------- /src/renderers/Renderer2D.js: -------------------------------------------------------------------------------- 1 | /* 2 | * Renderer2D by Grant Skinner. Dec 5, 2010 3 | * Visit http://easeljs.com/ for documentation, updates and examples. 4 | * 5 | * 6 | * Copyright (c) 2010 Grant Skinner 7 | * 8 | * Permission is hereby granted, free of charge, to any person 9 | * obtaining a copy of this software and associated documentation 10 | * files (the "Software"), to deal in the Software without 11 | * restriction, including without limitation the rights to use, 12 | * copy, modify, merge, publish, distribute, sublicense, and/or sell 13 | * copies of the Software, and to permit persons to whom the 14 | * Software is furnished to do so, subject to the following 15 | * conditions: 16 | * 17 | * The above copyright notice and this permission notice shall be 18 | * included in all copies or substantial portions of the Software. 19 | * 20 | * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, 21 | * EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES 22 | * OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND 23 | * NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT 24 | * HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, 25 | * WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING 26 | * FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR 27 | * OTHER DEALINGS IN THE SOFTWARE. 28 | */ 29 | 30 | /** 31 | * The Easel Javascript library provides a retained graphics mode for canvas 32 | * including a full, hierarchical display list, a core interaction model, and 33 | * helper classes to make working with Canvas much easier. 34 | * @module EaselJS 35 | **/ 36 | 37 | (function(window) { 38 | 39 | /** 40 | * A stage is the root level Container for a display list. Each time its tick method is called, it will render its display 41 | * list to its target canvas. 42 | * @class Stage 43 | * @extends Container 44 | * @constructor 45 | * @param {HTMLCanvasElement} canvas The canvas the stage will render to. 46 | **/ 47 | var Renderer2D = function(root, surface) { 48 | this.initialize(root, surface); 49 | } 50 | var p = Renderer2D.prototype = new Renderer(); 51 | 52 | // static properties: 53 | 54 | // public properties: 55 | p.snapToPixel = true; 56 | 57 | // constructor: 58 | 59 | // public methods: 60 | 61 | p.getSurface = function(width, height) { 62 | if (this.surface == null) { 63 | this.surface = document.createElement("canvas"); 64 | } 65 | if (width) { this.surface.width = width; } 66 | if (height) { this.surface.height = height; } 67 | return this.surface; 68 | } 69 | 70 | /** 71 | * Clears the target canvas. Useful if autoClear is set to false. 72 | * @method clear 73 | **/ 74 | p.clear = function() { 75 | if (!this.surface) { return; } 76 | var ctx = this.surface.getContext("2d"); 77 | ctx.setTransform(1, 0, 0, 1, 0, 0); 78 | ctx.clearRect(0, 0, this.surface.width, this.surface.height); 79 | } 80 | 81 | p.render = function(displayObject, surface) { 82 | displayObject = displayObject || this.root; 83 | surface = surface || this.surface; 84 | if (displayObject && surface) { 85 | this._render(surface.getContext("2d"), displayObject); 86 | } 87 | } 88 | 89 | p._render = function(ctx,o) { 90 | if (!o.isVisible()) { return; } 91 | 92 | // handle the transform: 93 | var tx = o.x-o.regX; 94 | var ty = o.y-o.regY; 95 | var transform = (tx!=0 || ty!=0)|0; 96 | transform |= (o.scaleX!=1 || o.scaleY!=1)<<1; 97 | transform |= (o.rotation%360!=0)<<2; 98 | 99 | if (transform==1) { 100 | tx = tx+0.5|0; 101 | ty = ty+0.5|0; 102 | ctx.translate(tx,ty); 103 | } else if (transform > 1) { 104 | ctx.save(); 105 | ctx.translate(o.x,o.y); // TODO: confirm this is right vs tx/ty 106 | if (transform&4) { ctx.rotate(o.rotation&360/180*Math.PI); } 107 | if (transform&2) { ctx.scale(o.scaleX,o.scaleY); } // TODO: GDS: fix for scale = 0 108 | ctx.translate(-o.regX,-o.regY); 109 | } 110 | 111 | var a = ctx.globalAlpha; 112 | ctx.globalAlpha *= o.alpha; 113 | 114 | // render the element: 115 | if (o instanceof Bitmap || o.cacheCanvas) { 116 | ctx.drawImage(o.cacheCanvas || o.image, 0, 0); 117 | } else if (o instanceof Container) { 118 | var list = o.children.slice(0); 119 | for (var i=0,l=list.length; i 1) { 137 | ctx.restore(); 138 | } 139 | 140 | } 141 | 142 | window.Renderer2D = Renderer2D; 143 | }(window)); -------------------------------------------------------------------------------- /src/renderers/RendererSVGStr.js: -------------------------------------------------------------------------------- 1 | /* 2 | * RendererSVGStr by Grant Skinner. Dec 5, 2010 3 | * Visit http://easeljs.com/ for documentation, updates and examples. 4 | * 5 | * 6 | * Copyright (c) 2010 Grant Skinner 7 | * 8 | * Permission is hereby granted, free of charge, to any person 9 | * obtaining a copy of this software and associated documentation 10 | * files (the "Software"), to deal in the Software without 11 | * restriction, including without limitation the rights to use, 12 | * copy, modify, merge, publish, distribute, sublicense, and/or sell 13 | * copies of the Software, and to permit persons to whom the 14 | * Software is furnished to do so, subject to the following 15 | * conditions: 16 | * 17 | * The above copyright notice and this permission notice shall be 18 | * included in all copies or substantial portions of the Software. 19 | * 20 | * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, 21 | * EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES 22 | * OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND 23 | * NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT 24 | * HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, 25 | * WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING 26 | * FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR 27 | * OTHER DEALINGS IN THE SOFTWARE. 28 | */ 29 | 30 | /** 31 | * The Easel Javascript library provides a retained graphics mode for canvas 32 | * including a full, hierarchical display list, a core interaction model, and 33 | * helper classes to make working with Canvas much easier. 34 | * @module EaselJS 35 | **/ 36 | 37 | (function(window) { 38 | 39 | /** 40 | * A stage is the root level Container for a display list. Each time its tick method is called, it will render its display 41 | * list to its target canvas. 42 | * @class Stage 43 | * @extends Container 44 | * @constructor 45 | * @param {HTMLCanvasElement} canvas The canvas the stage will render to. 46 | **/ 47 | var RendererSVGStr = function(root, surface) { 48 | this.initialize(root, surface); 49 | } 50 | var p = RendererSVGStr.prototype = new Renderer(); 51 | 52 | // static properties: 53 | 54 | // public properties: 55 | p.snapToPixel = true; 56 | p.defs = ""; 57 | 58 | // constructor: 59 | 60 | // public methods: 61 | 62 | p.getSurface = function(width, height) { 63 | if (this.surface == null) { 64 | this.surface = document.createElement("div"); 65 | this.surface.style.overflow = "hidden"; 66 | this.surface.style.position = "absolute"; 67 | } 68 | if (width) { this.surface.style.pixelWidth = width; } 69 | if (height) { this.surface.style.pixelHeight = height; } 70 | return this.surface; 71 | } 72 | 73 | /** 74 | * Clears the target canvas. Useful if autoClear is set to false. 75 | * @method clear 76 | **/ 77 | p.clear = function() { 78 | if (!this.surface) { return; } 79 | this.surface.innerHTML = ""; 80 | } 81 | 82 | p.render = function(displayObject, surface) { 83 | displayObject = displayObject || this.root; 84 | surface = surface || this.surface; 85 | if (displayObject && surface) { 86 | this.defs = ""; 87 | var html = ""; 88 | var view = this._render(displayObject,0); 89 | html += ""+this.defs+""+view; 90 | //console.log(html); 91 | surface.innerHTML = html; 92 | } 93 | } 94 | 95 | p._render = function(o,mtx,z) { 96 | if (!o.isVisible()) { return ""; } 97 | 98 | var attr = "transform='"; 99 | if (o.x || o.y) { attr += " translate("+o.x+","+o.y+")"; } 100 | if (o.rotation%360!=0) { attr += " rotate("+o.rotation+")"; } 101 | if (o.scaleX!=1 || o.scaleY!=1) { attr += " scale("+o.scaleX+","+o.scaleY+")"; } 102 | if (o.regX || o.regY) { attr += " translate("+(-o.regX)+","+(-o.regY)+")"; } 103 | attr += "'"; 104 | if (o.alpha != 1) { attr += " opacity='"+o.alpha+"'"; } 105 | 106 | // render the element: 107 | var tag=""; 108 | if (o.cacheCanvas) { 109 | // not really possible when using strings. 110 | } else if (o instanceof Bitmap) { 111 | tag = ""; 112 | } else if (o instanceof Container) { 113 | tag = ""; 114 | var list = o.children.slice(0); 115 | for (var i=0,l=list.length; i" 124 | tag = ""; 125 | tag += ""; 128 | tag += ""; 129 | } 130 | } 131 | return tag; 132 | 133 | } 134 | 135 | window.RendererSVGStr = RendererSVGStr; 136 | }(window)); -------------------------------------------------------------------------------- /src/renderers/RendererDOMStr.js: -------------------------------------------------------------------------------- 1 | /* 2 | * RendererDOMStr by Grant Skinner. Dec 5, 2010 3 | * Visit http://easeljs.com/ for documentation, updates and examples. 4 | * 5 | * 6 | * Copyright (c) 2010 Grant Skinner 7 | * 8 | * Permission is hereby granted, free of charge, to any person 9 | * obtaining a copy of this software and associated documentation 10 | * files (the "Software"), to deal in the Software without 11 | * restriction, including without limitation the rights to use, 12 | * copy, modify, merge, publish, distribute, sublicense, and/or sell 13 | * copies of the Software, and to permit persons to whom the 14 | * Software is furnished to do so, subject to the following 15 | * conditions: 16 | * 17 | * The above copyright notice and this permission notice shall be 18 | * included in all copies or substantial portions of the Software. 19 | * 20 | * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, 21 | * EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES 22 | * OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND 23 | * NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT 24 | * HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, 25 | * WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING 26 | * FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR 27 | * OTHER DEALINGS IN THE SOFTWARE. 28 | */ 29 | 30 | /** 31 | * The Easel Javascript library provides a retained graphics mode for canvas 32 | * including a full, hierarchical display list, a core interaction model, and 33 | * helper classes to make working with Canvas much easier. 34 | * @module EaselJS 35 | **/ 36 | 37 | (function(window) { 38 | 39 | /** 40 | * A stage is the root level Container for a display list. Each time its tick method is called, it will render its display 41 | * list to its target canvas. 42 | * @class Stage 43 | * @extends Container 44 | * @constructor 45 | * @param {HTMLCanvasElement} canvas The canvas the stage will render to. 46 | **/ 47 | var RendererDOMStr = function(root, surface) { 48 | this.initialize(root, surface); 49 | } 50 | var p = RendererDOMStr.prototype = new Renderer(); 51 | 52 | // static properties: 53 | 54 | // public properties: 55 | p.snapToPixel = true; 56 | 57 | // constructor: 58 | 59 | // public methods: 60 | 61 | p.getSurface = function(width, height) { 62 | if (this.surface == null) { 63 | this.surface = document.createElement("div"); 64 | this.surface.style.overflow = "hidden"; 65 | this.surface.style.position = "absolute"; 66 | } 67 | if (width) { this.surface.style.pixelWidth = width; } 68 | if (height) { this.surface.style.pixelHeight = height; } 69 | return this.surface; 70 | } 71 | 72 | /** 73 | * Clears the target canvas. Useful if autoClear is set to false. 74 | * @method clear 75 | **/ 76 | p.clear = function() { 77 | if (!this.surface) { return; } 78 | this.surface.innerHTML = ""; 79 | } 80 | 81 | p.render = function(displayObject, surface) { 82 | displayObject = displayObject || this.root; 83 | surface = surface || this.surface; 84 | if (displayObject && surface) { 85 | surface.innerHTML += this._render(displayObject,0); 86 | } 87 | } 88 | 89 | p._render = function(o,z) { 90 | if (!o.isVisible()) { return ""; } 91 | 92 | // handle the transform: 93 | var tx = o.x-o.regX; 94 | var ty = o.y-o.regY; 95 | var transform = (tx!=0 || ty!=0)|0; 96 | transform |= (o.scaleX!=1 || o.scaleY!=1)<<1; 97 | transform |= (o.rotation%360!=0)<<2; 98 | 99 | var style = "position:absolute;z-index:"+z+";"; 100 | if (o.alpha != 1) { style += "opacity:"+o.alpha+";" } 101 | if (transform==1) { 102 | tx = tx+0.5|0; 103 | ty = ty+0.5|0; 104 | style += "left:"+tx+"px;top:"+ty+"px;"; 105 | } else if (transform > 1) { 106 | if (o.regX || o.regY) { style += "-webkit-transform-origin:"+o.regX+"px "+o.regY+"px;"; } 107 | style += "-webkit-transform:"; 108 | if (o.x || o.y) { style += " translate("+tx+"px,"+ty+"px)"; } 109 | if (transform&4) { style += " rotate("+o.rotation+"deg)"; } 110 | if (transform&2) { style += " scale("+o.scaleX+","+o.scaleY+")"; } 111 | style += ";"; 112 | } 113 | 114 | // render the element: 115 | var tag = ""; 116 | if (o.cacheCanvas) { 117 | // not really possible when using strings. 118 | } else if (o instanceof Bitmap) { 119 | tag = ""; 120 | } else if (o instanceof Container) { 121 | tag = "
"; 122 | var list = o.children.slice(0); 123 | for (var i=0,l=list.length; i
"; 134 | } 135 | } 136 | return tag; 137 | 138 | } 139 | 140 | window.RendererDOMStr = RendererDOMStr; 141 | }(window)); -------------------------------------------------------------------------------- /src/renderers/RendererDOMMtx.js: -------------------------------------------------------------------------------- 1 | /* 2 | * RendererDOMMtx by Grant Skinner. Dec 5, 2010 3 | * Visit http://easeljs.com/ for documentation, updates and examples. 4 | * 5 | * 6 | * Copyright (c) 2010 Grant Skinner 7 | * 8 | * Permission is hereby granted, free of charge, to any person 9 | * obtaining a copy of this software and associated documentation 10 | * files (the "Software"), to deal in the Software without 11 | * restriction, including without limitation the rights to use, 12 | * copy, modify, merge, publish, distribute, sublicense, and/or sell 13 | * copies of the Software, and to permit persons to whom the 14 | * Software is furnished to do so, subject to the following 15 | * conditions: 16 | * 17 | * The above copyright notice and this permission notice shall be 18 | * included in all copies or substantial portions of the Software. 19 | * 20 | * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, 21 | * EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES 22 | * OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND 23 | * NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT 24 | * HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, 25 | * WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING 26 | * FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR 27 | * OTHER DEALINGS IN THE SOFTWARE. 28 | */ 29 | 30 | /** 31 | * The Easel Javascript library provides a retained graphics mode for canvas 32 | * including a full, hierarchical display list, a core interaction model, and 33 | * helper classes to make working with Canvas much easier. 34 | * @module EaselJS 35 | **/ 36 | 37 | (function(window) { 38 | 39 | /** 40 | * A stage is the root level Container for a display list. Each time its tick method is called, it will render its display 41 | * list to its target canvas. 42 | * @class Stage 43 | * @extends Container 44 | * @constructor 45 | * @param {HTMLCanvasElement} canvas The canvas the stage will render to. 46 | **/ 47 | var RendererDOMMtx = function(root, surface) { 48 | this.initialize(root, surface); 49 | } 50 | var p = RendererDOMMtx.prototype = new Renderer(); 51 | 52 | // static properties: 53 | 54 | // public properties: 55 | p.snapToPixel = true; 56 | p._tmpZ = 0; 57 | 58 | // constructor: 59 | 60 | // public methods: 61 | 62 | p.getSurface = function(width, height) { 63 | if (this.surface == null) { 64 | this.surface = document.createElement("div"); 65 | this.surface.style.overflow = "hidden"; 66 | this.surface.style.position = "absolute"; 67 | } 68 | if (width) { this.surface.style.pixelWidth = width; } 69 | if (height) { this.surface.style.pixelHeight = height; } 70 | return this.surface; 71 | } 72 | 73 | /** 74 | * Clears the target canvas. Useful if autoClear is set to false. 75 | * @method clear 76 | **/ 77 | p.clear = function() { 78 | if (!this.surface) { return; } 79 | this.surface.innerHTML = ""; 80 | } 81 | 82 | p.render = function(displayObject, surface) { 83 | displayObject = displayObject || this.root; 84 | surface = surface || this.surface; 85 | this._tmpZ = 0; 86 | if (displayObject && surface) { 87 | var docFrag = document.createDocumentFragment(); 88 | surface.innerHTML = ""; 89 | this._render(displayObject,null,docFrag); 90 | surface.appendChild(docFrag); 91 | } 92 | } 93 | 94 | p._render = function(o,mtx,docFrag) { 95 | if (!o.isVisible()) { return ""; } 96 | 97 | if (mtx) { 98 | o._matrix.reinitialize(mtx.a,mtx.b,mtx.c,mtx.d,mtx.tx,mtx.ty,mtx.alpha,mtx.shadow,mtx.compositeOperation); 99 | } else { 100 | o._matrix.reinitialize(1,0,0,1,0,0); 101 | } 102 | mtx = o._matrix; 103 | mtx.appendTransform(o.x, o.y, o.scaleX, o.scaleY, o.rotation, o.skewX, o.skewY, o.regX, o.regY); 104 | 105 | // render the element: 106 | var node = o.__node; 107 | var style; 108 | if (o.cacheCanvas) { 109 | node = o.cacheCanvas; 110 | style = node.style; 111 | } else if (o instanceof Bitmap) { 112 | if (!node) { 113 | node = o.__node = document.createElement("img"); 114 | node.src = o.image.src; 115 | } 116 | //if (node.src != o.image.src) { node.src = o.image.src; } // seems to have a negative impact on perf. 117 | style = node.style; 118 | } else if (o instanceof Container) { 119 | var list = o.children.slice(0); 120 | for (var i=0,l=list.length; i"; 92 | var view = this._render(displayObject,0); 93 | html += ""+this._defs+""+view; 94 | //console.log(html); 95 | surface.innerHTML = html; 96 | } 97 | } 98 | 99 | p._render = function(o,mtx,z) { 100 | if (!o.isVisible()) { return ""; } 101 | 102 | if (mtx) { 103 | o._matrix.reinitialize(mtx.a,mtx.b,mtx.c,mtx.d,mtx.tx,mtx.ty,mtx.alpha,mtx.shadow,mtx.compositeOperation); 104 | } else { 105 | o._matrix.reinitialize(1,0,0,1,0,0); 106 | } 107 | mtx = o._matrix; 108 | mtx.appendTransform(o.x, o.y, o.scaleX, o.scaleY, o.rotation, o.skewX, o.skewY, o.regX, o.regY); 109 | 110 | // render the element: 111 | var tag = ""; 112 | if (o.cacheCanvas) { 113 | // not really possible when using strings. 114 | } else if (o instanceof Bitmap) { 115 | tag = ""; 119 | } else { 120 | tag += " transform='matrix("+[mtx.a,mtx.b,mtx.c,mtx.d,mtx.tx,mtx.ty].join(",")+")'/>"; 121 | } 122 | } else if (o instanceof Container) { 123 | var list = o.children.slice(0); 124 | for (var i=0,l=list.length; i" 136 | } 137 | 138 | tag += " 2 | 3 | 4 | 5 | Pluggable Renderers 6 | 7 | 20 | 21 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 147 | 148 | 149 | 150 |
151 | 152 | | 153 | 154 | 172 | Particles: 173 | 174 | 175 | 176 | 177 | 178 | 179 | 180 | 181 | 182 | 183 | 184 |
185 |
186 | 187 |
188 | 189 | 190 | -------------------------------------------------------------------------------- /examples/SpriteSheet_Renderers.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Pluggable Renderers 6 | 7 | 8 | 9 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 143 | 144 | 145 | 146 |
147 | 148 | | 149 | 150 | 168 | Particles: 169 | 170 | 171 | 172 | 173 | 174 | 175 | 176 | 177 | 178 | 179 | 180 |
181 |
182 | 183 |
184 | 185 | 186 | -------------------------------------------------------------------------------- /src/renderers/RendererSVGMtx.js: -------------------------------------------------------------------------------- 1 | /* 2 | * RendererSVGMtx by Grant Skinner. Dec 5, 2010 3 | * Visit http://easeljs.com/ for documentation, updates and examples. 4 | * 5 | * 6 | * Copyright (c) 2010 Grant Skinner 7 | * 8 | * Permission is hereby granted, free of charge, to any person 9 | * obtaining a copy of this software and associated documentation 10 | * files (the "Software"), to deal in the Software without 11 | * restriction, including without limitation the rights to use, 12 | * copy, modify, merge, publish, distribute, sublicense, and/or sell 13 | * copies of the Software, and to permit persons to whom the 14 | * Software is furnished to do so, subject to the following 15 | * conditions: 16 | * 17 | * The above copyright notice and this permission notice shall be 18 | * included in all copies or substantial portions of the Software. 19 | * 20 | * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, 21 | * EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES 22 | * OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND 23 | * NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT 24 | * HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, 25 | * WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING 26 | * FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR 27 | * OTHER DEALINGS IN THE SOFTWARE. 28 | */ 29 | 30 | /** 31 | * The Easel Javascript library provides a retained graphics mode for canvas 32 | * including a full, hierarchical display list, a core interaction model, and 33 | * helper classes to make working with Canvas much easier. 34 | * @module EaselJS 35 | **/ 36 | 37 | (function(window) { 38 | 39 | /** 40 | * A stage is the root level Container for a display list. Each time its tick method is called, it will render its display 41 | * list to its target canvas. 42 | * @class Stage 43 | * @extends Container 44 | * @constructor 45 | * @param {HTMLCanvasElement} canvas The canvas the stage will render to. 46 | **/ 47 | var RendererSVGMtx = function(root, surface) { 48 | this.initialize(root, surface); 49 | } 50 | var p = RendererSVGMtx.prototype = new Renderer(); 51 | 52 | // static properties: 53 | 54 | // public properties: 55 | p.snapToPixel = true; 56 | p._tmpZ = 0; 57 | p._defs = null; 58 | p._clipPaths = {}; 59 | p._nextClipID = 0; 60 | 61 | p.svgns = "http://www.w3.org/2000/svg"; 62 | p.xlinkns = "http://www.w3.org/1999/xlink"; 63 | 64 | // constructor: 65 | 66 | // public methods: 67 | 68 | p.getSurface = function(width, height) { 69 | if (this.surface == null) { 70 | this.surface = document.createElementNS(this.svgns, "svg:svg"); 71 | this.surface.style.overflow = "hidden"; 72 | this.surface.style.position = "absolute"; 73 | } 74 | if (width) { this.surface.setAttribute("width",width); } 75 | if (height) { this.surface.setAttribute("height",height); } 76 | return this.surface; 77 | } 78 | 79 | /** 80 | * Clears the target canvas. Useful if autoClear is set to false. 81 | * @method clear 82 | **/ 83 | p.clear = function() { 84 | if (!this.surface) { return; } 85 | while (this.surface.firstChild) { this.surface.removeChild(this.surface.firstChild); } 86 | this._clipPaths = {}; 87 | } 88 | 89 | p.render = function(displayObject, surface) { 90 | displayObject = displayObject || this.root; 91 | surface = surface || this.surface; 92 | this._tmpZ = 0; 93 | if (displayObject && surface) { 94 | this.clear(); 95 | this._defs = document.createElementNS(this.svgns,"defs"); 96 | this.surface.appendChild(this._defs); 97 | this._render(displayObject,null,surface); 98 | } 99 | } 100 | 101 | p._render = function(o,mtx,svg) { 102 | if (!o.isVisible()) { return ""; } 103 | 104 | if (mtx) { 105 | o._matrix.reinitialize(mtx.a,mtx.b,mtx.c,mtx.d,mtx.tx,mtx.ty,mtx.alpha,mtx.shadow,mtx.compositeOperation); 106 | } else { 107 | o._matrix.reinitialize(1,0,0,1,0,0); 108 | } 109 | mtx = o._matrix; 110 | mtx.appendTransform(o.x, o.y, o.scaleX, o.scaleY, o.rotation, o.skewX, o.skewY, o.regX, o.regY); 111 | 112 | // render the element: 113 | var node = o.__node; 114 | var style; 115 | if (o.cacheCanvas) { 116 | // not really supported by SVG, would need to use toDataURL() which is very costly! 117 | } else if (o instanceof Bitmap) { 118 | if (!node) { 119 | node = o.__node = document.createElementNS(this.svgns,"image"); 120 | node.setAttributeNS(this.xlinkns,"xlink:href",o.image.src); 121 | node.setAttribute("width",o.image.width); 122 | node.setAttribute("height",o.image.height); 123 | } 124 | //if (node.src != o.image.src) { node.src = o.image.src; } // seems to have a negative impact on perf. 125 | style = node.style; 126 | } else if (o instanceof Container) { 127 | var list = o.children.slice(0); 128 | for (var i=0,l=list.length; i 2 | 3 | 4 | 5 | Pluggable Renderers 6 | 7 | 8 | 9 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 125 | 126 | 127 | 128 |
129 | 130 | | 131 | 132 | 150 | Particles: 151 | 152 | 153 | 154 | 155 | 156 | 157 | 158 | 159 | 160 | 161 | 162 |
163 |
164 | This example shows using .cache() to create dynamic content that can be rendered by the renderers. 165 |

166 | This is only supported by Canvas 2D, WebGL, and the DOM element renderers. 167 |

168 | It runs fairly slowly, because of all the tiny unique textures being generated each frame. 169 |

170 | In a production scenario, you would want to generate and cache dynamic content once, ideally combining it using SpriteSheetBuilder. 171 |

172 | Safari 6 also exhibits a heisenbug, where only a limited number of particles will display unless you open the dev console. 173 |
174 | 175 | 176 | -------------------------------------------------------------------------------- /src/renderers/RendererSWF.js: -------------------------------------------------------------------------------- 1 | /* 2 | * Renderer2D by Grant Skinner. Dec 5, 2010 3 | * Visit http://easeljs.com/ for documentation, updates and examples. 4 | * 5 | * 6 | * Copyright (c) 2010 Grant Skinner 7 | * 8 | * Permission is hereby granted, free of charge, to any person 9 | * obtaining a copy of this software and associated documentation 10 | * files (the "Software"), to deal in the Software without 11 | * restriction, including without limitation the rights to use, 12 | * copy, modify, merge, publish, distribute, sublicense, and/or sell 13 | * copies of the Software, and to permit persons to whom the 14 | * Software is furnished to do so, subject to the following 15 | * conditions: 16 | * 17 | * The above copyright notice and this permission notice shall be 18 | * included in all copies or substantial portions of the Software. 19 | * 20 | * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, 21 | * EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES 22 | * OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND 23 | * NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT 24 | * HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, 25 | * WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING 26 | * FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR 27 | * OTHER DEALINGS IN THE SOFTWARE. 28 | */ 29 | 30 | /** 31 | * The Easel Javascript library provides a retained graphics mode for canvas 32 | * including a full, hierarchical display list, a core interaction model, and 33 | * helper classes to make working with Canvas much easier. 34 | * @module EaselJS 35 | **/ 36 | 37 | (function(window) { 38 | 39 | /** 40 | * A stage is the root level Container for a display list. Each time its tick method is called, it will render its display 41 | * list to its target canvas. 42 | * @class Stage 43 | * @extends Container 44 | * @constructor 45 | * @param {HTMLCanvasElement} canvas The canvas the stage will render to. 46 | **/ 47 | var RendererSWF = function(root, surface) { 48 | this.initialize(root, surface); 49 | } 50 | var p = RendererSWF.prototype = new Renderer(); 51 | // public properties: 52 | p.snapToPixel = true; 53 | p.swf; 54 | p.idByData = {}; 55 | p.renderBuffer = {}; 56 | p.currentId = 0; 57 | p.dataByImage = {}; 58 | 59 | p.idList = [] 60 | p.matrixList = []; 61 | p.dataList = []; 62 | 63 | // constructor: 64 | 65 | // public methods: 66 | 67 | p.getSurface = function(width, height) { 68 | var swf = "RendererCPU.swf"; 69 | //var swf = "RendererGPU.swf"; 70 | var wmode = "direct"; 71 | if (this.surface == null) { 72 | this.surface = document.createElement("div"); 73 | this.surface.innerHTML = ''; 74 | } 75 | if (width) { this.surface.style.pixelWidth = width; } 76 | if (height) { this.surface.style.pixelHeight = height; } 77 | 78 | return this.surface; 79 | } 80 | 81 | /** 82 | * Clears the target canvas. Useful if autoClear is set to false. 83 | * @method clear 84 | **/ 85 | p.clear = function() { 86 | if(p.swf){ 87 | //p.swf.clear(); 88 | } 89 | } 90 | 91 | p.render = function(displayObject, surface) { 92 | if(!p.swf){ 93 | p.swf = document.getElementById("SWFRenderer"); 94 | } 95 | //Check if external interface is ready... 96 | if(!p.swf.renderBatch){ return; } 97 | 98 | displayObject = displayObject || this.root; 99 | surface = surface || this.surface; 100 | if (displayObject && surface) { 101 | //Clear buffered render values 102 | p.idList.length = 0; 103 | p.dataList.length = 0; 104 | p.matrixList.length = 0; 105 | 106 | //Start recursion 107 | this._render(p.swf, displayObject); 108 | } 109 | 110 | if(p.swf.renderBatch){ 111 | p.renderBuffer.id = p.idList.join(","); 112 | p.renderBuffer.data = p.dataList.join(","); 113 | p.renderBuffer.matrix = p.matrixList.join(","); 114 | 115 | p.swf.renderBatch(p.renderBuffer); 116 | } 117 | } 118 | 119 | p._render = function(ctx,o,mtx) { 120 | 121 | if (!o.isVisible()) { return; } 122 | 123 | if (mtx) { 124 | o._matrix.reinitialize(mtx.a,mtx.b,mtx.c,mtx.d,mtx.tx,mtx.ty,mtx.alpha,mtx.shadow,mtx.compositeOperation); 125 | } else { 126 | o._matrix.reinitialize(1,0,0,1,0,0); 127 | } 128 | mtx = o._matrix; 129 | mtx.appendTransform(o.x, o.y, o.scaleX, o.scaleY, o.rotation, o.skewX, o.skewY, o.regX, o.regY); 130 | 131 | // Try and get a cache... 132 | var cacheData = p.sampleData; 133 | if(!o.cacheCanvas){ 134 | if(o instanceof Bitmap){ 135 | if(p.dataByImage[o.image.src]){ 136 | cacheData = p.dataByImage[o.image.src]; 137 | //console.log("Render from image cache"); 138 | } else { 139 | o.cache(0, 0, o.image.width * o.scaleX, o.image.height * o.scaleY); 140 | cacheData = o.getCacheDataURL(); 141 | p.dataByImage[o.image.src] = cacheData; 142 | //console.log("Cache bitmap: " + o.image.src); 143 | } 144 | } else if(o instanceof BitmapSequence){ 145 | if(p.dataByImage[o.spriteSheet.image.src + "-" + o.currentFrame]){ 146 | cacheData = p.dataByImage[o.spriteSheet.image.src + "-" + o.currentFrame]; 147 | //console.log("Render from image cache"); 148 | } else { 149 | //@GRANT - This part is broken, it should be getting a full untransformed cache for each frame... 150 | //instead transforms are being applied to the cache, so I end up with random image scale/rotation 151 | o.cache(0, 0, o.spriteSheet.frameWidth, o.spriteSheet.frameHeight); 152 | cacheData = o.getCacheDataURL(); 153 | p.dataByImage[o.spriteSheet.image.src + "-" + o.currentFrame] = cacheData; 154 | //console.log("Cache bitmapSequence: " + o.spriteSheet.image.src + "-" + o.currentFrame); 155 | } 156 | } 157 | } 158 | 159 | //Render element 160 | if (o instanceof Container == false && cacheData) { 161 | cacheData = cacheData.split("base64,")[1]; 162 | var id = p.idByData[cacheData]; 163 | //If we don't have an id yet for this image, make one, and pass the full data. 164 | if(isNaN(id)){ 165 | id = p.currentId++; 166 | p.idByData[cacheData] = id; 167 | p.dataList.push(cacheData); 168 | //console.log("Caching sprite for id:" + id); 169 | } 170 | //Render by id, we've already passed data to the swf. 171 | else { 172 | id = p.idByData[cacheData]; 173 | p.dataList.push(""); 174 | //console.log("Using cache: ", id); 175 | } 176 | p.idList.push(id); 177 | p.matrixList.push(mtx.a + "|" + mtx.b + "|" + mtx.c + "|" + mtx.d + "|" + mtx.tx + "|" + mtx.ty + "|" + o.alpha); 178 | 179 | } else if (o instanceof Container) { 180 | var list = o.children.slice(0); 181 | for (var i=0,l=list.length; i 31) { 444 | this._draw(ctx); 445 | } 446 | }; 447 | 448 | /* 449 | * _draw runs the draw method and resets everything. This way, multiple draw methods can be called (if needed). 450 | */ 451 | p._draw = function(ctx) { 452 | ctx.bufferSubData(ctx.ARRAY_BUFFER, 0, this.vertices.subarray(0, this._index * this._vertexDataCount)); 453 | ctx.drawElements(ctx.TRIANGLES, this._index * 1.5, ctx.UNSIGNED_SHORT, 0); 454 | 455 | this._index = 0; 456 | this._textureCount = 0; 457 | this._textures = []; 458 | }; 459 | 460 | /* 461 | * Cache images are always being saved to the array. This will remove all those that aren't used (they've been overwritten 462 | * by a new image due to a cacheID change). 463 | */ 464 | 465 | p._cleanCache = function() { 466 | var textures = this._cacheTextures; 467 | for (var i = 0, l = textures.length; i < l; i++) { 468 | if (!textures[i]._isUsed) { 469 | textures.splice(i, 1); 470 | i--; 471 | l--; 472 | } else { 473 | textures[i]._isUsed = false; 474 | } 475 | } 476 | }; 477 | 478 | /* 479 | * Because it takes so much processor to create mat4s, they are pooled. 480 | */ 481 | p._getMat4 = function() { 482 | if (this._matPool.length > 0) { 483 | return this._matPool.pop(); 484 | } else { 485 | return mat4.create(); 486 | } 487 | }; 488 | p._poolMat4 = function(mat) { 489 | this._matPool.push(mat); 490 | }; 491 | 492 | window.RendererWebGL = RendererWebGL; 493 | }(window)); -------------------------------------------------------------------------------- /lib/easeljs-NEXT.min.js: -------------------------------------------------------------------------------- 1 | /* 2 | * EaselJS 3 | * Visit http://createjs.com/ for documentation, updates and examples. 4 | * 5 | * Copyright (c) 2011 gskinner.com, inc. 6 | * 7 | * Distributed under the terms of the MIT license. 8 | * http://www.opensource.org/licenses/mit-license.html 9 | * 10 | * This notice shall be included in all copies or substantial portions of the Software. 11 | */ 12 | (function(g){var c=function(){throw"UID cannot be instantiated";};c._nextID=0;c.get=function(){return c._nextID++};g.UID=c})(createjs||(createjs={}));var createjs;(function(g){var c=function(){throw"Ticker cannot be instantiated.";};c.useRAF=null;c._listeners=null;c._pauseable=null;c._paused=false;c._inited=false;c._startTime=0;c._pausedTime=0;c._ticks=0;c._pausedTicks=0;c._interval=50;c._lastTime=0;c._times=null;c._tickTimes=null;c._rafActive=false;c._timeoutID=null;c.addListener=function(a,k){a!=null&&(c._inited||c.init(),c.removeListener(a),c._pauseable[c._listeners.length]=k==null?true:k,c._listeners.push(a))};c.init=function(){c._inited=true;c._times= 13 | [];c._tickTimes=[];c._pauseable=[];c._listeners=[];c._times.push(c._lastTime=c._startTime=c._getTime());c.setInterval(c._interval)};c.removeListener=function(a){var k=c._listeners;k&&(a=k.indexOf(a),a!=-1&&(k.splice(a,1),c._pauseable.splice(a,1)))};c.removeAllListeners=function(){c._listeners=[];c._pauseable=[]};c.setInterval=function(a){c._interval=a;c._inited&&c._setupTick()};c.getInterval=function(){return c._interval};c.setFPS=function(a){c.setInterval(1E3/a)};c.getFPS=function(){return 1E3/c._interval}; 14 | c.getMeasuredFPS=function(a){if(c._times.length<2)return-1;a==null&&(a=c.getFPS()|0);a=Math.min(c._times.length-1,a);return 1E3/((c._times[0]-c._times[a])/a)};c.setPaused=function(a){c._paused=a};c.getPaused=function(){return c._paused};c.getTime=function(a){return c._getTime()-c._startTime-(a?c._pausedTime:0)};c.getTicks=function(a){return c._ticks-(a?c._pausedTicks:0)};c._handleAF=function(){c._rafActive=false;c._setupTick();c._getTime()-c._lastTime>=(c._interval-1)*0.97&&c._tick()};c._handleTimeout= 15 | function(){c.timeoutID=null;c._setupTick();c._tick()};c._setupTick=function(){if(!(c._rafActive||c.timeoutID!=null)){if(c.useRAF){var a=window.requestAnimationFrame||window.webkitRequestAnimationFrame||window.mozRequestAnimationFrame||window.oRequestAnimationFrame||window.msRequestAnimationFrame;if(a){a(c._handleAF);c._rafActive=true;return}}c.timeoutID=setTimeout(c._handleTimeout,c._interval)}};c._tick=function(){var a=c._getTime();c._ticks++;var k=a-c._lastTime,b=c._paused;b&&(c._pausedTicks++, 16 | c._pausedTime+=k);c._lastTime=a;for(var d=c._pauseable,e=c._listeners.slice(),f=e?e.length:0,h=0;h100;)c._tickTimes.pop();for(c._times.unshift(a);c._times.length>100;)c._times.pop()};var b=window.performance&&(performance.now||performance.mozNow||performance.msNow||performance.oNow||performance.webkitNow);c._getTime=function(){return b&&b.call(performance)|| 17 | (new Date).getTime()};g.Ticker=c})(createjs||(createjs={}));(function(g){var c=function(a,k,b,d,c,f,h,i,j){this.initialize(a,k,b,d,c,f,h,i,j)},b=c.prototype;b.stageX=0;b.stageY=0;b.rawX=0;b.rawY=0;b.type=null;b.nativeEvent=null;b.onMouseMove=null;b.onMouseUp=null;b.target=null;b.pointerID=0;b.primary=false;b.initialize=function(a,k,b,d,c,f,h,i,j){this.type=a;this.stageX=k;this.stageY=b;this.target=d;this.nativeEvent=c;this.pointerID=f;this.primary=h;this.rawX=i==null?k:i;this.rawY=j==null?b:j};b.clone=function(){return new c(this.type,this.stageX,this.stageY, 18 | this.target,this.nativeEvent,this.pointerID,this.primary,this.rawX,this.rawY)};b.toString=function(){return"[MouseEvent (type="+this.type+" stageX="+this.stageX+" stageY="+this.stageY+")]"};g.MouseEvent=c})(createjs||(createjs={}));(function(g){var c=function(a,k,b,d,c,f){this.initialize(a,k,b,d,c,f)},b=c.prototype;c.identity=null;c.DEG_TO_RAD=Math.PI/180;b.a=1;b.b=0;b.c=0;b.d=1;b.tx=0;b.ty=0;b.alpha=1;b.shadow=null;b.compositeOperation=null;b.initialize=function(a,k,b,d,c,f){if(a!=null)this.a=a;this.b=k||0;this.c=b||0;if(d!=null)this.d=d;this.tx=c||0;this.ty=f||0;return this};b.prepend=function(a,k,b,d,c,f){var h=this.tx;if(a!=1||k!=0||b!=0||d!=1){var i=this.a,j=this.c;this.a=i*a+this.b*b;this.b=i*k+this.b*d;this.c=j*a+this.d* 19 | b;this.d=j*k+this.d*d}this.tx=h*a+this.ty*b+c;this.ty=h*k+this.ty*d+f;return this};b.append=function(a,k,b,d,c,f){var h=this.a,i=this.b,j=this.c,l=this.d;this.a=a*h+k*j;this.b=a*i+k*l;this.c=b*h+d*j;this.d=b*i+d*l;this.tx=c*h+f*j+this.tx;this.ty=c*i+f*l+this.ty;return this};b.prependMatrix=function(a){this.prepend(a.a,a.b,a.c,a.d,a.tx,a.ty);this.prependProperties(a.alpha,a.shadow,a.compositeOperation);return this};b.appendMatrix=function(a){this.append(a.a,a.b,a.c,a.d,a.tx,a.ty);this.appendProperties(a.alpha, 20 | a.shadow,a.compositeOperation);return this};b.prependTransform=function(a,k,b,d,e,f,h,i,j){if(e%360)var l=e*c.DEG_TO_RAD,e=Math.cos(l),l=Math.sin(l);else e=1,l=0;if(i||j)this.tx-=i,this.ty-=j;f||h?(f*=c.DEG_TO_RAD,h*=c.DEG_TO_RAD,this.prepend(e*b,l*b,-l*d,e*d,0,0),this.prepend(Math.cos(h),Math.sin(h),-Math.sin(f),Math.cos(f),a,k)):this.prepend(e*b,l*b,-l*d,e*d,a,k);return this};b.appendTransform=function(a,k,b,d,e,f,h,i,j){if(e%360)var l=e*c.DEG_TO_RAD,e=Math.cos(l),l=Math.sin(l);else e=1,l=0;f|| 21 | h?(f*=c.DEG_TO_RAD,h*=c.DEG_TO_RAD,this.append(Math.cos(h),Math.sin(h),-Math.sin(f),Math.cos(f),a,k),this.append(e*b,l*b,-l*d,e*d,0,0)):this.append(e*b,l*b,-l*d,e*d,a,k);if(i||j)this.tx-=i*this.a+j*this.c,this.ty-=i*this.b+j*this.d;return this};b.rotate=function(a){var k=Math.cos(a),a=Math.sin(a),b=this.a,d=this.c,c=this.tx;this.a=b*k-this.b*a;this.b=b*a+this.b*k;this.c=d*k-this.d*a;this.d=d*a+this.d*k;this.tx=c*k-this.ty*a;this.ty=c*a+this.ty*k;return this};b.skew=function(a,k){a*=c.DEG_TO_RAD;k*= 22 | c.DEG_TO_RAD;this.append(Math.cos(k),Math.sin(k),-Math.sin(a),Math.cos(a),0,0);return this};b.scale=function(a,k){this.a*=a;this.d*=k;this.tx*=a;this.ty*=k;return this};b.translate=function(a,k){this.tx+=a;this.ty+=k;return this};b.identity=function(){this.alpha=this.a=this.d=1;this.b=this.c=this.tx=this.ty=0;this.shadow=this.compositeOperation=null;return this};b.invert=function(){var a=this.a,k=this.b,b=this.c,d=this.d,c=this.tx,f=a*d-k*b;this.a=d/f;this.b=-k/f;this.c=-b/f;this.d=a/f;this.tx=(b* 23 | this.ty-d*c)/f;this.ty=-(a*this.ty-k*c)/f;return this};b.isIdentity=function(){return this.tx==0&&this.ty==0&&this.a==1&&this.b==0&&this.c==0&&this.d==1};b.decompose=function(a){a==null&&(a={});a.x=this.tx;a.y=this.ty;a.scaleX=Math.sqrt(this.a*this.a+this.b*this.b);a.scaleY=Math.sqrt(this.c*this.c+this.d*this.d);var k=Math.atan2(-this.c,this.d),b=Math.atan2(this.b,this.a);k==b?(a.rotation=b/c.DEG_TO_RAD,this.a<0&&this.d>=0&&(a.rotation+=a.rotation<=0?180:-180),a.skewX=a.skewY=0):(a.skewX=k/c.DEG_TO_RAD, 24 | a.skewY=b/c.DEG_TO_RAD);return a};b.reinitialize=function(a,k,b,d,c,f,h,i,j){this.initialize(a,k,b,d,c,f);this.alpha=h||1;this.shadow=i;this.compositeOperation=j;return this};b.appendProperties=function(a,k,b){this.alpha*=a;this.shadow=k||this.shadow;this.compositeOperation=b||this.compositeOperation;return this};b.prependProperties=function(a,k,b){this.alpha*=a;this.shadow=this.shadow||k;this.compositeOperation=this.compositeOperation||b;return this};b.clone=function(){var a=new c(this.a,this.b, 25 | this.c,this.d,this.tx,this.ty);a.shadow=this.shadow;a.alpha=this.alpha;a.compositeOperation=this.compositeOperation;return a};b.toString=function(){return"[Matrix2D (a="+this.a+" b="+this.b+" c="+this.c+" d="+this.d+" tx="+this.tx+" ty="+this.ty+")]"};c.identity=new c(1,0,0,1,0,0);g.Matrix2D=c})(createjs||(createjs={}));(function(g){var c=function(a,k){this.initialize(a,k)},b=c.prototype;b.x=0;b.y=0;b.initialize=function(a,k){this.x=a==null?0:a;this.y=k==null?0:k};b.clone=function(){return new c(this.x,this.y)};b.toString=function(){return"[Point (x="+this.x+" y="+this.y+")]"};g.Point=c})(createjs||(createjs={}));(function(g){var c=function(a,k,b,d){this.initialize(a,k,b,d)},b=c.prototype;b.x=0;b.y=0;b.width=0;b.height=0;b.initialize=function(a,k,b,d){this.x=a==null?0:a;this.y=k==null?0:k;this.width=b==null?0:b;this.height=d==null?0:d};b.clone=function(){return new c(this.x,this.y,this.width,this.height)};b.toString=function(){return"[Rectangle (x="+this.x+" y="+this.y+" width="+this.width+" height="+this.height+")]"};g.Rectangle=c})(createjs||(createjs={}));(function(g){var c=function(a,b,m,d){this.initialize(a,b,m,d)},b=c.prototype;c.identity=null;b.color=null;b.offsetX=0;b.offsetY=0;b.blur=0;b.initialize=function(a,b,m,d){this.color=a;this.offsetX=b;this.offsetY=m;this.blur=d};b.toString=function(){return"[Shadow]"};b.clone=function(){return new c(this.color,this.offsetX,this.offsetY,this.blur)};c.identity=new c("transparent",0,0,0);g.Shadow=c})(createjs||(createjs={}));(function(g){var c=function(a){this.initialize(a)},b=c.prototype;b.complete=true;b.onComplete=null;b._animations=null;b._frames=null;b._images=null;b._data=null;b._loadCount=0;b._frameHeight=0;b._frameWidth=0;b._numFrames=0;b._regX=0;b._regY=0;b.initialize=function(a){var b,m,d;if(a!=null){if(a.images&&(m=a.images.length)>0){d=this._images=[];for(b=0;b0?Math.min(this._numFrames-a,h*i):h*i,j=0;j>8&255,a=a>>16&255);return e==null?"rgb("+a+","+b+","+c+")":"rgba("+a+","+b+","+c+","+e+")"};b.getHSL=function(a,b,c,e){return e==null?"hsl("+a%360+","+b+"%,"+c+"%)":"hsla("+a%360+","+b+"%,"+c+"%,"+e+")"};b.BASE_64={A:0,B:1,C:2,D:3,E:4,F:5,G:6,H:7,I:8, 31 | J:9,K:10,L:11,M:12,N:13,O:14,P:15,Q:16,R:17,S:18,T:19,U:20,V:21,W:22,X:23,Y:24,Z:25,a:26,b:27,c:28,d:29,e:30,f:31,g:32,h:33,i:34,j:35,k:36,l:37,m:38,n:39,o:40,p:41,q:42,r:43,s:44,t:45,u:46,v:47,w:48,x:49,y:50,z:51,0:52,1:53,2:54,3:55,4:56,5:57,6:58,7:59,8:60,9:61,"+":62,"/":63};b.STROKE_CAPS_MAP=["butt","round","square"];b.STROKE_JOINTS_MAP=["miter","round","bevel"];b._ctx=(g.createCanvas?g.createCanvas():document.createElement("canvas")).getContext("2d");b.beginCmd=new c(b._ctx.beginPath,[],false); 32 | b.fillCmd=new c(b._ctx.fill,[],false);b.strokeCmd=new c(b._ctx.stroke,[],false);a._strokeInstructions=null;a._strokeStyleInstructions=null;a._fillInstructions=null;a._instructions=null;a._oldInstructions=null;a._activeInstructions=null;a._active=false;a._dirty=false;a.initialize=function(){this.clear();this._ctx=b._ctx};a.draw=function(a){this._dirty&&this._updateInstructions();for(var b=this._instructions,c=0,e=b.length;cl&&(f=l);h<0&&(h*=p=-1);h>l&&(h=l);i<0&&(i*=o=-1);i>l&&(i=l);j<0&&(j*=r=-1);j>l&&(j=l);this._dirty=this._active=true;var l=this._ctx.arcTo,q=this._ctx.lineTo;this._activeInstructions.push(new c(this._ctx.moveTo,[a+d-h,b]), 41 | new c(l,[a+d+h*p,b-h*p,a+d,b+h,h]),new c(q,[a+d,b+e-i]),new c(l,[a+d+i*o,b+e+i*o,a+d-i,b+e,i]),new c(q,[a+j,b+e]),new c(l,[a-j*r,b+e+j*r,a,b+e-j,j]),new c(q,[a,b+f]),new c(l,[a-f*g,b-f*g,a+f,b,f]),new c(this._ctx.closePath));return this};a.drawCircle=function(a,b,c){this.arc(a,b,c,0,Math.PI*2);return this};a.drawEllipse=function(a,b,d,e){this._dirty=this._active=true;var f=d/2*0.5522848,h=e/2*0.5522848,i=a+d,j=b+e,d=a+d/2,e=b+e/2;this._activeInstructions.push(new c(this._ctx.moveTo,[a,e]),new c(this._ctx.bezierCurveTo, 42 | [a,e-h,d-f,b,d,b]),new c(this._ctx.bezierCurveTo,[d+f,b,i,e-h,i,e]),new c(this._ctx.bezierCurveTo,[i,e+h,d+f,j,d,j]),new c(this._ctx.bezierCurveTo,[d-f,j,a,e+h,a,e]));return this};a.drawPolyStar=function(a,b,d,e,f,h){this._dirty=this._active=true;f==null&&(f=0);f=1-f;h==null?h=0:h/=180/Math.PI;var i=Math.PI/e;this._activeInstructions.push(new c(this._ctx.moveTo,[a+Math.cos(h)*d,b+Math.sin(h)*d]));for(var j=0;j>3,r=c[o];if(!r||p&3)throw"bad path data (@"+e+"): "+g;g=d[o];o||(i=j=0);h.length=0;e++;p=(p>>2&1)+2;for(o=0;o>5?-1:1,q=(q&31)<<6|l[a.charAt(e+1)];p== 44 | 3&&(q=q<<6|l[a.charAt(e+2)]);q=t*q/10;o%2?i=q+=i:j=q+=j;h[o]=q;e+=p}r.apply(this,h)}return this};a.clone=function(){var a=new b;a._instructions=this._instructions.slice();a._activeInstructions=this._activeInstructions.slice();a._oldInstructions=this._oldInstructions.slice();if(this._fillInstructions)a._fillInstructions=this._fillInstructions.slice();if(this._strokeInstructions)a._strokeInstructions=this._strokeInstructions.slice();if(this._strokeStyleInstructions)a._strokeStyleInstructions=this._strokeStyleInstructions.slice(); 45 | a._active=this._active;a._dirty=this._dirty;a.drawAsPath=this.drawAsPath;return a};a.toString=function(){return"[Graphics]"};a.mt=a.moveTo;a.lt=a.lineTo;a.at=a.arcTo;a.bt=a.bezierCurveTo;a.qt=a.quadraticCurveTo;a.a=a.arc;a.r=a.rect;a.cp=a.closePath;a.c=a.clear;a.f=a.beginFill;a.lf=a.beginLinearGradientFill;a.rf=a.beginRadialGradientFill;a.bf=a.beginBitmapFill;a.ef=a.endFill;a.ss=a.setStrokeStyle;a.s=a.beginStroke;a.ls=a.beginLinearGradientStroke;a.rs=a.beginRadialGradientStroke;a.bs=a.beginBitmapStroke; 46 | a.es=a.endStroke;a.dr=a.drawRect;a.rr=a.drawRoundRect;a.rc=a.drawRoundRectComplex;a.dc=a.drawCircle;a.de=a.drawEllipse;a.dp=a.drawPolyStar;a.p=a.decodePath;a._updateInstructions=function(){this._instructions=this._oldInstructions.slice();this._instructions.push(b.beginCmd);this._fillInstructions&&this._instructions.push.apply(this._instructions,this._fillInstructions);this._strokeInstructions&&(this._instructions.push.apply(this._instructions,this._strokeInstructions),this._strokeStyleInstructions&& 47 | this._instructions.push.apply(this._instructions,this._strokeStyleInstructions));this._instructions.push.apply(this._instructions,this._activeInstructions);this._fillInstructions&&this._instructions.push(b.fillCmd);this._strokeInstructions&&this._instructions.push(b.strokeCmd)};a._getEllipseArc=function(a,b,d,e){var f=d/2*0.5522848,h=e/2*0.5522848,i=a+d,j=b+e,d=a+d/2,e=b+e/2;this._activeInstructions.push(new c(this._ctx.moveTo,[a,e]),new c(this._ctx.bezierCurveTo,[a,e-h,d-f,b,d,b]),new c(this._ctx.bezierCurveTo, 48 | [d+f,b,i,e-h,i,e]),new c(this._ctx.bezierCurveTo,[i,e+h,d+f,j,d,j]),new c(this._ctx.bezierCurveTo,[d-f,j,a,e+h,a,e]));return this};a._newPath=function(){this._dirty&&this._updateInstructions();this._oldInstructions=this._instructions;this._activeInstructions=[];this._active=this._dirty=false};a._setProp=function(a,b){this[a]=b};g.Graphics=b})(createjs||(createjs={}));(function(g){var c=function(){this.initialize()},b=c.prototype;c.suppressCrossDomainErrors=false;c._hitTestCanvas=g.createCanvas?g.createCanvas():document.createElement("canvas");c._hitTestCanvas.width=c._hitTestCanvas.height=1;c._hitTestContext=c._hitTestCanvas.getContext("2d");c._nextCacheID=1;b.alpha=1;b.cacheCanvas=null;b.id=-1;b.mouseEnabled=true;b.name=null;b.parent=null;b.regX=0;b.regY=0;b.rotation=0;b.scaleX=1;b.scaleY=1;b.skewX=0;b.skewY=0;b.shadow=null;b.visible=true;b.x=0;b.y=0;b.compositeOperation= 49 | null;b.snapToPixel=false;b.onPress=null;b.onClick=null;b.onDoubleClick=null;b.onMouseOver=null;b.onMouseOut=null;b.onTick=null;b.filters=null;b.cacheID=0;b.mask=null;b.hitArea=null;b._cacheOffsetX=0;b._cacheOffsetY=0;b._cacheScale=1;b._cacheDataURLID=0;b._cacheDataURL=null;b._matrix=null;b.initialize=function(){this.id=g.UID.get();this._matrix=new g.Matrix2D};b.isVisible=function(){return this.visible&&this.alpha>0&&this.scaleX!=0&&this.scaleY!=0};b.draw=function(a,b){var c=this.cacheCanvas;if(b|| 50 | !c)return false;var d=this._cacheScale;a.drawImage(c,this._cacheOffsetX,this._cacheOffsetY,c.width/d,c.height/d);return true};b.updateContext=function(a){var b,c=this.mask;c&&c.graphics&&(b=c.getMatrix(c._matrix),a.transform(b.a,b.b,b.c,b.d,b.tx,b.ty),c.graphics.drawAsPath(a),a.clip(),b.invert(),a.transform(b.a,b.b,b.c,b.d,b.tx,b.ty));b=this._matrix.identity().appendTransform(this.x,this.y,this.scaleX,this.scaleY,this.rotation,this.skewX,this.skewY,this.regX,this.regY);g.Stage._snapToPixelEnabled&& 51 | this.snapToPixel?a.transform(b.a,b.b,b.c,b.d,b.tx+0.5|0,b.ty+0.5|0):a.transform(b.a,b.b,b.c,b.d,b.tx,b.ty);a.globalAlpha*=this.alpha;if(this.compositeOperation)a.globalCompositeOperation=this.compositeOperation;this.shadow&&this._applyShadow(a,this.shadow)};b.cache=function(a,b,c,d,e){e=e||1;if(!this.cacheCanvas)this.cacheCanvas=g.createCanvas?g.createCanvas():document.createElement("canvas");this.cacheCanvas.width=Math.ceil(c*e);this.cacheCanvas.height=Math.ceil(d*e);this._cacheOffsetX=a;this._cacheOffsetY= 52 | b;this._cacheScale=e||1;this.updateCache()};b.updateCache=function(a){var b=this.cacheCanvas,m=this._cacheOffsetX,d=this._cacheOffsetY,e=this._cacheScale;if(!b)throw"cache() must be called before updateCache()";var f=b.getContext("2d");f.save();a||f.clearRect(0,0,b.width,b.height);f.globalCompositeOperation=a;f.setTransform(e,0,0,e,-m,-d);this.draw(f,true);this._applyFilters();f.restore();this.cacheID=c._nextCacheID++};b.uncache=function(){this._cacheDataURL=this.cacheCanvas=null;this.cacheID=this._cacheOffsetX= 53 | this._cacheOffsetY=0;this._cacheScale=1};b.getCacheDataURL=function(){if(!this.cacheCanvas)return null;if(this.cacheID!=this._cacheDataURLID)this._cacheDataURL=this.cacheCanvas.toDataURL();return this._cacheDataURL};b.getStage=function(){for(var a=this;a.parent;)a=a.parent;return a instanceof g.Stage?a:null};b.localToGlobal=function(a,b){var c=this.getConcatenatedMatrix(this._matrix);if(c==null)return null;c.append(1,0,0,1,a,b);return new g.Point(c.tx,c.ty)};b.globalToLocal=function(a,b){var c=this.getConcatenatedMatrix(this._matrix); 54 | if(c==null)return null;c.invert();c.append(1,0,0,1,a,b);return new g.Point(c.tx,c.ty)};b.localToLocal=function(a,b,c){a=this.localToGlobal(a,b);return c.globalToLocal(a.x,a.y)};b.setTransform=function(a,b,c,d,e,f,h,i,j){this.x=a||0;this.y=b||0;this.scaleX=c==null?1:c;this.scaleY=d==null?1:d;this.rotation=e||0;this.skewX=f||0;this.skewY=h||0;this.regX=i||0;this.regY=j||0;return this};b.getMatrix=function(a){return(a?a.identity():new g.Matrix2D).appendTransform(this.x,this.y,this.scaleX,this.scaleY, 55 | this.rotation,this.skewX,this.skewY,this.regX,this.regY).appendProperties(this.alpha,this.shadow,this.compositeOperation)};b.getConcatenatedMatrix=function(a){a?a.identity():a=new g.Matrix2D;for(var b=this;b!=null;)a.prependTransform(b.x,b.y,b.scaleX,b.scaleY,b.rotation,b.skewX,b.skewY,b.regX,b.regY).prependProperties(b.alpha,b.shadow,b.compositeOperation),b=b.parent;return a};b.hitTest=function(a,b){var m=c._hitTestContext,d=c._hitTestCanvas;m.setTransform(1,0,0,1,-a,-b);this.draw(m);m=this._testHit(m); 56 | d.width=0;d.width=1;return m};b.clone=function(){var a=new c;this.cloneProps(a);return a};b.toString=function(){return"[DisplayObject (name="+this.name+")]"};b.cloneProps=function(a){a.alpha=this.alpha;a.name=this.name;a.regX=this.regX;a.regY=this.regY;a.rotation=this.rotation;a.scaleX=this.scaleX;a.scaleY=this.scaleY;a.shadow=this.shadow;a.skewX=this.skewX;a.skewY=this.skewY;a.visible=this.visible;a.x=this.x;a.y=this.y;a.mouseEnabled=this.mouseEnabled;a.compositeOperation=this.compositeOperation; 57 | if(this.cacheCanvas)a.cacheCanvas=this.cacheCanvas.cloneNode(true),a.cacheCanvas.getContext("2d").putImageData(this.cacheCanvas.getContext("2d").getImageData(0,0,this.cacheCanvas.width,this.cacheCanvas.height),0,0)};b._applyShadow=function(a,b){b=b||Shadow.identity;a.shadowColor=b.color;a.shadowOffsetX=b.offsetX;a.shadowOffsetY=b.offsetY;a.shadowBlur=b.blur};b._tick=function(a){if(this.onTick)if(a)this.onTick.apply(this,a);else this.onTick()};b._testHit=function(a){try{var b=a.getImageData(0,0,1, 58 | 1).data[3]>1}catch(m){if(!c.suppressCrossDomainErrors)throw"An error has occurred. This is most likely due to security restrictions on reading canvas pixel data with local or cross-domain images.";}return b};b._applyFilters=function(){if(this.filters&&this.filters.length!=0&&this.cacheCanvas)for(var a=this.filters.length,b=this.cacheCanvas.getContext("2d"),c=this.cacheCanvas.width,d=this.cacheCanvas.height,e=0;e0&&this.children.length&&this.scaleX!=0&&this.scaleY!=0};b.DisplayObject_draw=b.draw;b.draw=function(a,b){if(this.DisplayObject_draw(a,b))return true;for(var c=this.children.slice(0),d=0,e=c.length;d1){for(var c=0;cthis.children.length)return arguments[c-2];if(c>2){for(var e=0;e1){for(var c=true,d=0;d1){for(var c=[],d=0;dthis.children.length-1)return false; 62 | if(b=this.children[a])b.parent=null;this.children.splice(a,1);return true};b.removeAllChildren=function(){for(var a=this.children;a.length;)a.pop().parent=null};b.getChildAt=function(a){return this.children[a]};b.sortChildren=function(a){this.children.sort(a)};b.getChildIndex=function(a){return this.children.indexOf(a)};b.getNumChildren=function(){return this.children.length};b.swapChildrenAt=function(a,b){var c=this.children,d=c[a],e=c[b];d&&e&&(c[a]=e,c[b]=d)};b.swapChildren=function(a,b){for(var c= 63 | this.children,d,e,f=0,h=c.length;f=d)){for(var e=0;e=0;b--){var c=this.children[b];c._tick&&c._tick(a)}this.DisplayObject__tick(a)};b._getObjectsUnderPoint=function(a,b,m,d){var e=createjs.DisplayObject._hitTestContext,f=createjs.DisplayObject._hitTestCanvas,h=this._matrix,i=d&1&&(this.onPress||this.onClick||this.onDoubleClick)||d&2&&(this.onMouseOver||this.onMouseOut);if(this.cacheCanvas&&i&&(this.getConcatenatedMatrix(h),e.setTransform(h.a,h.b,h.c,h.d,h.tx-a,h.ty-b),e.globalAlpha=h.alpha,this.draw(e),this._testHit(e)))return f.width=0,f.width= 66 | 1,this;for(var j=this.children.length-1;j>=0;j--){var g=this.children[j];if(g.isVisible()&&g.mouseEnabled)if(g instanceof c)if(i){if(g=g._getObjectsUnderPoint(a,b))return this}else{if(g=g._getObjectsUnderPoint(a,b,m,d),!m&&g)return g}else if(!d||i||d&1&&(g.onPress||g.onClick||g.onDoubleClick)||d&2&&(g.onMouseOver||g.onMouseOut)){var n=g.hitArea;g.getConcatenatedMatrix(h);n&&(h.appendTransform(n.x+g.regX,n.y+g.regY,n.scaleX,n.scaleY,n.rotation,n.skewX,n.skewY,n.regX,n.regY),h.alpha*=n.alpha/g.alpha); 67 | e.globalAlpha=h.alpha;e.setTransform(h.a,h.b,h.c,h.d,h.tx-a,h.ty-b);(n||g).draw(e);if(this._testHit(e))if(f.width=0,f.width=1,i)return this;else if(m)m.push(g);else return g}}return null};g.Container=c})(createjs||(createjs={}));(function(g){var c=function(a){this.initialize(a)},b=c.prototype=new g.Container;c._snapToPixelEnabled=false;b.autoClear=true;b.canvas=null;b.mouseX=0;b.mouseY=0;b.onMouseMove=null;b.onMouseUp=null;b.onMouseDown=null;b.snapToPixelEnabled=false;b.mouseInBounds=false;b.tickOnUpdate=true;b.mouseMoveOutside=false;b._pointerData=null;b._pointerCount=0;b._primaryPointerID=null;b._mouseOverIntervalID=null;b.Container_initialize=b.initialize;b.initialize=function(a){this.Container_initialize();this.canvas= 68 | a instanceof HTMLCanvasElement?a:document.getElementById(a);this._pointerData={};this._enableMouseEvents(true)};b.update=function(){if(this.canvas){this.autoClear&&this.clear();c._snapToPixelEnabled=this.snapToPixelEnabled;this.tickOnUpdate&&this._tick(arguments.length?arguments:null);var a=this.canvas.getContext("2d");a.save();this.updateContext(a);this.draw(a,false);a.restore()}};b.tick=b.update;b.clear=function(){if(this.canvas){var a=this.canvas.getContext("2d");a.setTransform(1,0,0,1,0,0);a.clearRect(0, 69 | 0,this.canvas.width,this.canvas.height)}};b.toDataURL=function(a,b){b||(b="image/png");var c=this.canvas.getContext("2d"),d=this.canvas.width,e=this.canvas.height,f;if(a){f=c.getImageData(0,0,d,e);var h=c.globalCompositeOperation;c.globalCompositeOperation="destination-over";c.fillStyle=a;c.fillRect(0,0,d,e)}var g=this.canvas.toDataURL(b);if(a)c.clearRect(0,0,d,e),c.putImageData(f,0,0),c.globalCompositeOperation=h;return g};b.enableMouseOver=function(a){if(this._mouseOverIntervalID)clearInterval(this._mouseOverIntervalID), 70 | this._mouseOverIntervalID=null;if(a==null)a=20;else if(a<=0)return;var b=this;this._mouseOverIntervalID=setInterval(function(){b._testMouseOver()},1E3/Math.min(50,a))};b.clone=function(){var a=new c(null);this.cloneProps(a);return a};b.toString=function(){return"[Stage (name="+this.name+")]"};b._enableMouseEvents=function(){var a=this,b=window.addEventListener?window:document;b.addEventListener("mouseup",function(b){a._handleMouseUp(b)},false);b.addEventListener("mousemove",function(b){a._handleMouseMove(b)}, 71 | false);b.addEventListener("dblclick",function(b){a._handleDoubleClick(b)},false);this.canvas&&this.canvas.addEventListener("mousedown",function(b){a._handleMouseDown(b)},false)};b._getPointerData=function(a){var b=this._pointerData[a];if(!b&&(b=this._pointerData[a]={x:0,y:0},this._primaryPointerID==null))this._primaryPointerID=a;return b};b._handleMouseMove=function(a){if(!a)a=window.event;this._handlePointerMove(-1,a,a.pageX,a.pageY)};b._handlePointerMove=function(a,b,c,d){if(this.canvas){var e= 72 | this._getPointerData(a),f=e.inBounds;this._updatePointerPosition(a,c,d);if(f||e.inBounds||this.mouseMoveOutside){a=new g.MouseEvent("onMouseMove",e.x,e.y,this,b,a,a==this._primaryPointerID,e.rawX,e.rawY);if(this.onMouseMove)this.onMouseMove(a);if(e.event&&e.event.onMouseMove)a=a.clone(),a.target=e.event.target,e.event.onMouseMove(a)}}};b._updatePointerPosition=function(a,b,c){var d=this.canvas;do b-=d.offsetLeft,c-=d.offsetTop;while(d=d.offsetParent);var d=this.canvas.width,e=this.canvas.height,f= 73 | this._getPointerData(a);if(f.inBounds=b>=0&&c>=0&&b<=d-1&&c<=e-1)f.x=b,f.y=c;else if(this.mouseMoveOutside)f.x=b<0?0:b>d-1?d-1:b,f.y=c<0?0:c>e-1?e-1:c;f.rawX=b;f.rawY=c;if(a==this._primaryPointerID)this.mouseX=f.x,this.mouseY=f.y,this.mouseInBounds=f.inBounds};b._handleMouseUp=function(a){this._handlePointerUp(-1,a,false)};b._handlePointerUp=function(a,b,c){var d=this._getPointerData(a),e=new g.MouseEvent("onMouseUp",d.x,d.y,this,b,a,a==this._primaryPointerID,d.rawX,d.rawY);if(this.onMouseUp)this.onMouseUp(e); 74 | if(d.event&&d.event.onMouseUp)e=e.clone(),e.target=d.event.target,d.event.onMouseUp(e);if(d.target&&d.target.onClick&&this._getObjectsUnderPoint(d.x,d.y,null,true,this._mouseOverIntervalID?3:1)==d.target)d.target.onClick(new g.MouseEvent("onClick",d.x,d.y,d.target,b,a,a==this._primaryPointerID,d.rawX,d.rawY));if(c){if(a==this._primaryPointerID)this._primaryPointerID=null;delete this._pointerData[a]}else d.event=d.target=null};b._handleMouseDown=function(a){this._handlePointerDown(-1,a,false)};b._handlePointerDown= 75 | function(a,b,c,d){var e=this._getPointerData(a);d!=null&&this._updatePointerPosition(a,c,d);if(this.onMouseDown)this.onMouseDown(new g.MouseEvent("onMouseDown",e.x,e.y,this,b,a,a==this._primaryPointerID,e.rawX,e.rawY));if(c=this._getObjectsUnderPoint(e.x,e.y,null,this._mouseOverIntervalID?3:1)){if(c.onPress&&(a=new g.MouseEvent("onPress",e.x,e.y,c,b,a,a==this._primaryPointerID,e.rawX,e.rawY),c.onPress(a),a.onMouseMove||a.onMouseUp))e.event=a;e.target=c}};b._testMouseOver=function(){if(this._primaryPointerID== 76 | -1&&!(this.mouseX==this._mouseOverX&&this.mouseY==this._mouseOverY&&this.mouseInBounds)){var a=null;if(this.mouseInBounds)a=this._getObjectsUnderPoint(this.mouseX,this.mouseY,null,3),this._mouseOverX=this.mouseX,this._mouseOverY=this.mouseY;if(this._mouseOverTarget!=a){if(this._mouseOverTarget&&this._mouseOverTarget.onMouseOut)this._mouseOverTarget.onMouseOut(new g.MouseEvent("onMouseOut",this.mouseX,this.mouseY,this._mouseOverTarget));if(a&&a.onMouseOver)a.onMouseOver(new g.MouseEvent("onMouseOver", 77 | this.mouseX,this.mouseY,a));this._mouseOverTarget=a}}};b._handleDoubleClick=function(a){if(this.onDoubleClick)this.onDoubleClick(new g.MouseEvent("onDoubleClick",this.mouseX,this.mouseY,this,a,-1,true));var b=this._getObjectsUnderPoint(this.mouseX,this.mouseY,null,this._mouseOverIntervalID?3:1);if(b&&b.onDoubleClick)b.onDoubleClick(new g.MouseEvent("onDoubleClick",this.mouseX,this.mouseY,b,a,-1,true))};g.Stage=c})(createjs||(createjs={}));(function(g){var c=function(a){this.initialize(a)},b=c.prototype=new g.DisplayObject;b.image=null;b.snapToPixel=true;b.sourceRect=null;b.DisplayObject_initialize=b.initialize;b.initialize=function(a){this.DisplayObject_initialize();typeof a=="string"?(this.image=new Image,this.image.src=a):this.image=a};b.isVisible=function(){return this.visible&&this.alpha>0&&this.scaleX!=0&&this.scaleY!=0&&this.image&&(this.image.complete||this.image.getContext||this.image.readyState>=2)};b.DisplayObject_draw=b.draw; 78 | b.draw=function(a,b){if(this.DisplayObject_draw(a,b))return true;var c=this.sourceRect;c?a.drawImage(this.image,c.x,c.y,c.width,c.height,0,0,c.width,c.height):a.drawImage(this.image,0,0);return true};b.clone=function(){var a=new c(this.image);this.cloneProps(a);return a};b.toString=function(){return"[Bitmap (name="+this.name+")]"};g.Bitmap=c})(createjs||(createjs={}));(function(g){var c=function(a){this.initialize(a)},b=c.prototype=new g.DisplayObject;b.onAnimationEnd=null;b.currentFrame=-1;b.currentAnimation=null;b.paused=true;b.spriteSheet=null;b.snapToPixel=true;b.offset=0;b.currentAnimationFrame=0;b._advanceCount=0;b._animation=null;b.DisplayObject_initialize=b.initialize;b.initialize=function(a){this.DisplayObject_initialize();this.spriteSheet=a};b.isVisible=function(){return this.visible&&this.alpha>0&&this.scaleX!=0&&this.scaleY!=0&&this.spriteSheet.complete&& 79 | this.currentFrame>=0};b.DisplayObject_draw=b.draw;b.draw=function(a,b){if(this.DisplayObject_draw(a,b))return true;this._normalizeFrame();var c=this.spriteSheet.getFrame(this.currentFrame);if(c!=null){var d=c.rect;a.drawImage(c.image,d.x,d.y,d.width,d.height,-c.regX,-c.regY,d.width,d.height);return true}};b.play=function(){this.paused=false};b.stop=function(){this.paused=true};b.gotoAndPlay=function(a){this.paused=false;this._goto(a)};b.gotoAndStop=function(a){this.paused=true;this._goto(a)};b.advance= 80 | function(){this._animation?this.currentAnimationFrame++:this.currentFrame++;this._normalizeFrame()};b.clone=function(){var a=new c(this.spriteSheet);this.cloneProps(a);return a};b.toString=function(){return"[BitmapAnimation (name="+this.name+")]"};b.DisplayObject__tick=b._tick;b._tick=function(a){var b=this._animation?this._animation.frequency:1;!this.paused&&(++this._advanceCount+this.offset)%b==0&&this.advance();this.DisplayObject__tick(a)};b._normalizeFrame=function(){var a=this._animation;if(a)if(this.currentAnimationFrame>= 81 | a.frames.length){if(a.next?this._goto(a.next):(this.paused=true,this.currentAnimationFrame=a.frames.length-1,this.currentFrame=a.frames[this.currentAnimationFrame]),this.onAnimationEnd)this.onAnimationEnd(this,a.name)}else this.currentFrame=a.frames[this.currentAnimationFrame];else if(this.currentFrame>=this.spriteSheet.getNumFrames()&&(this.currentFrame=0,this.onAnimationEnd))this.onAnimationEnd(this,null)};b.DisplayObject_cloneProps=b.cloneProps;b.cloneProps=function(a){this.DisplayObject_cloneProps(a); 82 | a.onAnimationEnd=this.onAnimationEnd;a.currentFrame=this.currentFrame;a.currentAnimation=this.currentAnimation;a.paused=this.paused;a.offset=this.offset;a._animation=this._animation;a.currentAnimationFrame=this.currentAnimationFrame};b._goto=function(a){if(isNaN(a)){var b=this.spriteSheet.getAnimation(a);if(b)this.currentAnimationFrame=0,this._animation=b,this.currentAnimation=a,this._normalizeFrame()}else this.currentAnimation=this._animation=null,this.currentFrame=a};g.BitmapAnimation=c})(createjs|| 83 | (createjs={}));(function(g){var c=function(a){this.initialize(a)},b=c.prototype=new g.DisplayObject;b.graphics=null;b.DisplayObject_initialize=b.initialize;b.initialize=function(a){this.DisplayObject_initialize();this.graphics=a?a:new g.Graphics};b.isVisible=function(){return Boolean(this.visible&&this.alpha>0&&this.scaleX!=0&&this.scaleY!=0&&this.graphics)};b.DisplayObject_draw=b.draw;b.draw=function(a,b){if(this.DisplayObject_draw(a,b))return true;this.graphics.draw(a);return true};b.clone=function(a){a=new c(a&& 84 | this.graphics?this.graphics.clone():this.graphics);this.cloneProps(a);return a};b.toString=function(){return"[Shape (name="+this.name+")]"};g.Shape=c})(createjs||(createjs={}));(function(g){var c=function(a,b,c){this.initialize(a,b,c)},b=c.prototype=new g.DisplayObject;c._workingContext=(g.createCanvas?g.createCanvas():document.createElement("canvas")).getContext("2d");b.text="";b.font=null;b.color="#000";b.textAlign="left";b.textBaseline="top";b.maxWidth=null;b.outline=false;b.lineHeight=0;b.lineWidth=null;b.DisplayObject_initialize=b.initialize;b.initialize=function(a,b,c){this.DisplayObject_initialize();this.text=a;this.font=b;this.color=c?c:"#000"};b.isVisible=function(){return Boolean(this.visible&& 85 | this.alpha>0&&this.scaleX!=0&&this.scaleY!=0&&this.text!=null&&this.text!=="")};b.DisplayObject_draw=b.draw;b.draw=function(a,b){if(this.DisplayObject_draw(a,b))return true;this.outline?a.strokeStyle=this.color:a.fillStyle=this.color;a.font=this.font;a.textAlign=this.textAlign||"start";a.textBaseline=this.textBaseline||"alphabetic";this._drawText(a);return true};b.getMeasuredWidth=function(){return this._getWorkingContext().measureText(this.text).width};b.getMeasuredLineHeight=function(){return this._getWorkingContext().measureText("M").width* 86 | 1.2};b.getMeasuredHeight=function(){return this._drawText()*(this.lineHeight||this.getMeasuredLineHeight())};b.clone=function(){var a=new c(this.text,this.font,this.color);this.cloneProps(a);return a};b.toString=function(){return"[Text (text="+(this.text.length>20?this.text.substr(0,17)+"...":this.text)+")]"};b.DisplayObject_cloneProps=b.cloneProps;b.cloneProps=function(a){this.DisplayObject_cloneProps(a);a.textAlign=this.textAlign;a.textBaseline=this.textBaseline;a.maxWidth=this.maxWidth;a.outline= 87 | this.outline;a.lineHeight=this.lineHeight;a.lineWidth=this.lineWidth};b._getWorkingContext=function(){var a=c._workingContext;a.font=this.font;a.textAlign=this.textAlign||"start";a.textBaseline=this.textBaseline||"alphabetic";return a};b._drawText=function(a){var b=!!a;b||(a=this._getWorkingContext());for(var c=String(this.text).split(/(?:\r\n|\r|\n)/),d=this.lineHeight||this.getMeasuredLineHeight(),e=0,f=0,h=c.length;fthis.lineWidth?(b&&this._drawTextLine(a,j,e*d),e++,j=g[l+1]):j+=g[l]+g[l+1];b&&this._drawTextLine(a,j,e*d)}e++}return e};b._drawTextLine=function(a,b,c){this.outline?a.strokeText(b,0,c,this.maxWidth||65535):a.fillText(b,0,c,this.maxWidth||65535)};g.Text=c})(createjs||(createjs={}));(function(g){var c=function(){throw"SpriteSheetUtils cannot be instantiated";};c._workingCanvas=g.createCanvas?g.createCanvas():document.createElement("canvas");c._workingContext=c._workingCanvas.getContext("2d");c.addFlippedFrames=function(b,a,k,g){if(a||k||g){var d=0;a&&c._flip(b,++d,true,false);k&&c._flip(b,++d,false,true);g&&c._flip(b,++d,true,true)}};c.extractFrame=function(b,a){isNaN(a)&&(a=b.getAnimation(a).frames[0]);var k=b.getFrame(a);if(!k)return null;var g=k.rect,d=c._workingCanvas;d.width= 89 | g.width;d.height=g.height;c._workingContext.drawImage(k.image,g.x,g.y,g.width,g.height,0,0,g.width,g.height);k=new Image;k.src=d.toDataURL("image/png");return k};c.mergeAlpha=function(b,a,c){c||(c=g.createCanvas?g.createCanvas():document.createElement("canvas"));c.width=Math.max(a.width,b.width);c.height=Math.max(a.height,b.height);var m=c.getContext("2d");m.save();m.drawImage(b,0,0);m.globalCompositeOperation="destination-in";m.drawImage(a,0,0);m.restore();return c};c._flip=function(b,a,k,g){for(var d= 90 | b._images,e=c._workingCanvas,f=c._workingContext,h=d.length/a,i=0;ithis.maxHeight)throw c.ERR_DIMENSIONS;for(var d=0,e=0,f=0;m.length;){var h=this._fillRow(m,d,f,b,a);if(h.w>e)e=h.w;d+=h.h;if(!h.h||!m.length){var i=g.createCanvas?g.createCanvas():document.createElement("canvas");i.width= 96 | this._getSize(e,this.maxWidth);i.height=this._getSize(d,this.maxHeight);this._data.images[f]=i;h.h||(e=d=0,f++)}}};b._getSize=function(a,b){for(var c=4;Math.pow(2,++c)=0;l--){var n=a[l],p=this._scale*n.scale,o=n.sourceRect,r=n.source,q=Math.floor(p*o.x-e),t=Math.floor(p*o.y-e),s=Math.ceil(p*o.height+e*2),o=Math.ceil(p*o.width+e*2);if(o>f)throw c.ERR_DIMENSIONS; 97 | if(!(s>h||i+o>f))n.img=m,n.rect=new g.Rectangle(i,b,o,s),j=j||s,a.splice(l,1),d[n.index]=[i,b,o,s,m,Math.round(-q+p*r.regX-e),Math.round(-t+p*r.regY-e)],i+=o}return{w:i,h:j}};b._endBuild=function(){this.spriteSheet=new g.SpriteSheet(this._data);this._data=null;this._callback&&this._callback(this)};b._run=function(){for(var a=(new Date).getTime()+this._timeSlice,b=false;a>(new Date).getTime();)if(!this._drawNext()){b=true;break}if(b)this._endBuild();else{var c=this;this._timerID=setTimeout(function(){c._run()}, 98 | 50-this._timeSlice)}};b._drawNext=function(){var a=this._frames[this._index],b=a.scale*this._scale,c=a.rect,d=a.sourceRect,e=this._data.images[a.img].getContext("2d");a.funct&&a.funct.apply(a.scope,a.params);e.save();e.beginPath();e.rect(c.x,c.y,c.width,c.height);e.clip();e.translate(Math.ceil(c.x-d.x*b),Math.ceil(c.y-d.y*b));e.scale(b,b);a.source.draw(e);e.restore();return++this._index