Merge pull request #6 from jiborobot/upload-refactor

Fixes shapes test, refactors upload to use `renderer.plugins.prepare`

bower.json

@@ -1,6 +1,6 @@
 {
 	"name": "pixi-animate",
-	"version": "0.5.2",
+	"version": "0.5.3",
 	"main": "dist/pixi-animate.min.js",
 	"dependencies":
 	{

package.json

@@ -1,7 +1,7 @@
 {
   "name": "pixi-animate",
   "description": "PIXI plugin for the PixiAnimate Extension",
-  "version": "0.5.2",
+  "version": "0.5.3",
   "main": "dist/pixi-animate.min.js",
   "author": "Matt Karl <[email protected]>",
   "dependencies": {

src/animate/utils.js

@@ -1,11 +1,5 @@
-const SharedTicker = PIXI.ticker.shared;
-
-// Number of assets to upload per frame
-let _uploadsPerFrame = 4;
-
-// Collectsion of graphics and textures
-const _graphics = [];
-const _textures = [];
+// If the movieclip plugin is installed
+let _prepare = null;
 
 /**
  * @namespace PIXI.animate
@@ -194,20 +188,6 @@ export default class AnimateUtils {
         }
     }
 
-    /**
-     * The number of graphics or textures to upload to the GPU, if using
-     * utils.upload and WebGLRenderer
-     * @property {int} UPLOADS_PER_FRAME
-     * @static
-     * @default 4
-     */
-    static set UPLOADS_PER_FRAME(value) {
-        _uploadsPerFrame = value;
-    }
-    static get UPLOADS_PER_FRAME() {
-        return _uploadsPerFrame;
-    }
-
     /** 
      * Upload all the textures and graphics to the GPU. 
      * @method upload
@@ -217,88 +197,30 @@ export default class AnimateUtils {
      * @param {function} done When complete
      */
     static upload(renderer, displayObject, done) {
-
-        // No need to upload if CanvasRenderer
-        if (!(renderer instanceof PIXI.WebGLRenderer)) {
-            return done();
+        if (!_prepare) {
+            _prepare = renderer.plugins.prepare;
+            _prepare.register(this.addMovieClips);
         }
-
-        // Get global properties
-        const textures = _textures;
-        const graphics = _graphics;
-
-        // Get the items for upload from the display
-        this.getUploadable(displayObject, textures, graphics);
-
-        let numLeft = this.UPLOADS_PER_FRAME;
-
-        const update = () => {
-
-            // Upload the graphics
-            while (graphics.length && numLeft) {
-                renderer.plugins.graphics.updateGraphics(graphics.pop());
-                numLeft--;
-            }
-
-            // Upload the textures
-            while (textures.length && numLeft) {
-                renderer.textureManager.updateTexture(textures.pop());
-                numLeft--;
-            }
-
-            // We're finished
-            if (textures.length || graphics.length) {
-                numLeft = this.UPLOADS_PER_FRAME;
-            } else {
-                SharedTicker.remove(update);
-                done();
-            }
-        };
-
-        // Listen to frame updates
-        SharedTicker.add(update);
+        _prepare.upload(displayObject, done);
     }
 
     /**
-     * Get the list of renderable items.
-     * @method getUploadable
+     * Add movie clips to the upload prepare.
+     * @method addMovieClips
      * @static
      * @private
-     * @param {PIXI.DisplayObject} displayObject 
-     * @param {Array<PIXI.Texture>} textures Collection of textures
-     * @param {Array<PIXI.Graphics>} graphics Collection of graphics
+     * @param {*} item To add to the queue 
      */
-    static getUploadable(displayObject, textures, graphics) {
-
-        // Objects with textures, like Sprites
-        if (displayObject._texture) {
-            let texture = displayObject._texture.baseTexture;
-            if (textures.indexOf(texture) == -1) {
-                textures.push(texture);
-            }
-        } else if (displayObject instanceof PIXI.Graphics) {
-            graphics.push(displayObject);
-        }
-
-        // Get timed childen
-        if (displayObject instanceof PIXI.animate.MovieClip) {
-            let children = displayObject.children.slice();
-            displayObject._timedChildTimelines.forEach((timeline) => {
-                this.getUploadable(timeline.target, textures, graphics);
-                const index = children.indexOf(timeline.target);
-                if (index > -1) {
-                    children.splice(index, 1);
+    static addMovieClips(item) {
+        if (item instanceof PIXI.animate.MovieClip) {
+            item._timedChildTimelines.forEach((timeline) => {
+                const index = item.children.indexOf(timeline.target);
+                if (index === -1) {
+                    _prepare.add(timeline.target);
                 }
             });
-            children.forEach((child) => {
-                this.getUploadable(child, textures, graphics);
-            });
-        }
-        // Recursively get textures
-        else if (displayObject instanceof PIXI.Container) {
-            displayObject.children.forEach((child) => {
-                this.getUploadable(child, textures, graphics);
-            });
+            return true;
         }
+        return false;
     }
 }

tests/animate/ShapesCache.js

@@ -4,7 +4,7 @@ describe('ShapesCache', function() {
         assert.isOk(ShapesCache);
     });
     it('should add shapes to cache', function() {
-        var commands = [
+        var commands = [[
             "f", "#003fcc", 1,
             "m", 363.05, 287.3,
             "l", 431.2, 208.5,
@@ -13,7 +13,7 @@ describe('ShapesCache', function() {
             "l", 267.05, 246.75,
             "l", 363.05, 287.3,
             "c"
-        ];
+        ]];
         ShapesCache.add('TestShape2', commands);
         assert.isOk(ShapesCache.TestShape2);
         assert.equal(ShapesCache.TestShape2, commands);