including unregistered layers
diff --git a/player/index.html b/player/index.html index 0b80e38..19d2bd6 100644 --- a/player/index.html +++ b/player/index.html
@@ -54,6 +54,10 @@ <script src="js/module.js"></script> <!-- endbuild --> <!-- <script src="bodymovin.js"></script> --> + <script src="exports/blue/data.js"></script> + <script src="exports/blue/anim1Data.js"></script> + <script src="exports/blue/time_0.js"></script> + <script src="exports/blue/anim2Data.js"></script> </head> <body> @@ -72,14 +76,18 @@ var animData = { wrapper: document.getElementById('bodymovin'), - animType: 'svg', + animType: 'canvas', loop: true, prerender: false, autoplay: true, - path: 'exports/bm' + animationData: anim1Data + //path: 'exports/bm' }; bodymovin.setQuality(50); var anim = bodymovin.loadAnimation(animData); + setTimeout(function(){ + anim.includeLayers(anim2Data); + },500); anim.addEventListener('bm:config_ready', configReady); anim.addEventListener('bm:data_ready', dataReady); </script>
diff --git a/player/js/animation/AnimationItem.js b/player/js/animation/AnimationItem.js index 1718958..18c1270 100644 --- a/player/js/animation/AnimationItem.js +++ b/player/js/animation/AnimationItem.js
@@ -130,13 +130,21 @@ var newLayers = data.layers; var j, jLen = newLayers.length; for(j=0;j<jLen;j+=1){ - i = 0; - while(i<len){ - if(layers[i].id == newLayers[j].id){ - layers[i] = newLayers[j]; - break; + if(!newLayers[j].id){ + if(this.animType == 'svg'){ + layers.push(newLayers[j]); + }else{ + layers.unshift(newLayers[j]); } - i += 1; + }else{ + i = 0; + while(i<len){ + if(layers[i].id == newLayers[j].id){ + layers[i] = newLayers[j]; + break; + } + i += 1; + } } } if(data.assets){
diff --git a/player/js/renderers/CanvasRenderer.js b/player/js/renderers/CanvasRenderer.js index a6baa33..76de194 100644 --- a/player/js/renderers/CanvasRenderer.js +++ b/player/js/renderers/CanvasRenderer.js
@@ -67,20 +67,30 @@ if(!elements){ elements = this.elements; } - var j, jLen = elements.length, elems, placeholder; + var j, jLen = elements.length, elems; for(i=0;i<len;i+=1){ - j = 0; - while(j<jLen){ - if(elements[j].data.id == layers[i].id){ - elements[j] = this.createItem(layers[i],parentContainer); - if (layers[i].ty === 0) { - elems = []; - this.buildItems(layers[i].layers,elems); - elements[j].setElements(elems); - } - break; + if(!layers[i].id){ + var elem = this.createItem(layers[i],parentContainer); + elements.unshift(elem); + if (layers[i].ty === 0) { + elems = []; + this.buildItems(layers[i].layers,elems); + elem.setElements(elems); } - j += 1; + }else{ + j = 0; + while(j<jLen){ + if(elements[j].data.id == layers[i].id){ + elements[j] = this.createItem(layers[i],parentContainer); + if (layers[i].ty === 0) { + elems = []; + this.buildItems(layers[i].layers,elems); + elements[j].setElements(elems); + } + break; + } + j += 1; + } } } };
diff --git a/player/js/renderers/SVGRenderer.js b/player/js/renderers/SVGRenderer.js index 69309f2..93a12eb 100644 --- a/player/js/renderers/SVGRenderer.js +++ b/player/js/renderers/SVGRenderer.js
@@ -60,19 +60,29 @@ } var j, jLen = elements.length, elems, placeholder; for(i=0;i<len;i+=1){ - j = 0; - while(j<jLen){ - if(elements[j].data.id == layers[i].id){ - placeholder = elements[j]; - elements[j] = this.createItem(layers[i],parentContainer, placeholder); - if (layers[i].ty === 0) { - elems = []; - this.buildItems(layers[i].layers,elements[j].getDomElement(),elems, placeholder); - elements[j].setElements(elems); - } - break; + if(!layers[i].id){ + var elem = this.createItem(layers[i],parentContainer); + elements.push(elem); + if (layers[i].ty === 0) { + elems = []; + this.buildItems(layers[i].layers,elem.getDomElement(),elems); + elem.setElements(elems); } - j += 1; + }else{ + j = 0; + while(j<jLen){ + if(elements[j].data.id == layers[i].id){ + placeholder = elements[j]; + elements[j] = this.createItem(layers[i],parentContainer, placeholder); + if (layers[i].ty === 0) { + elems = []; + this.buildItems(layers[i].layers,elements[j].getDomElement(),elems, placeholder); + elements[j].setElements(elems); + } + break; + } + j += 1; + } } } };