added pucker and bloat modifier support
diff --git a/player/index.html b/player/index.html
index 75fe01a..52e1cf7 100644
--- a/player/index.html
+++ b/player/index.html
@@ -48,6 +48,7 @@
<script src="js/utils/shapes/ShapeModifiers.js"></script>
<script src="js/utils/shapes/TrimModifier.js"></script>
<script src="js/utils/shapes/RoundCornersModifier.js"></script>
+ <script src="js/utils/shapes/PuckerAndBloatModifier.js"></script>
<script src="js/utils/shapes/RepeaterModifier.js"></script>
<script src="js/utils/shapes/ShapeCollection.js"></script>
<script src="js/utils/shapes/DashProperty.js"></script>
@@ -176,7 +177,7 @@
container: elem,
renderer: 'svg',
loop: false,
- autoplay: false,
+ autoplay: true,
rendererSettings: {
progressiveLoad:false,
preserveAspectRatio: 'xMidYMid meet',
diff --git a/player/js/elements/canvasElements/CVShapeElement.js b/player/js/elements/canvasElements/CVShapeElement.js
index 3c9c542..fc25d03 100644
--- a/player/js/elements/canvasElements/CVShapeElement.js
+++ b/player/js/elements/canvasElements/CVShapeElement.js
@@ -182,7 +182,7 @@
itemsData[i] = this.createShapeElement(arr[i]);
}
- }else if(arr[i].ty == 'tm' || arr[i].ty == 'rd'){
+ }else if(arr[i].ty == 'tm' || arr[i].ty == 'rd' || arr[i].ty == 'pb'){
if(!processedPos){
modifier = ShapeModifiers.getModifier(arr[i].ty);
modifier.init(this,arr[i]);
diff --git a/player/js/elements/svgElements/SVGShapeElement.js b/player/js/elements/svgElements/SVGShapeElement.js
index 95c6975..b93a9fc 100644
--- a/player/js/elements/svgElements/SVGShapeElement.js
+++ b/player/js/elements/svgElements/SVGShapeElement.js
@@ -240,7 +240,7 @@
}
this.setElementStyles(itemsData[i]);
- }else if(arr[i].ty == 'tm' || arr[i].ty == 'rd' || arr[i].ty == 'ms'){
+ }else if(arr[i].ty == 'tm' || arr[i].ty == 'rd' || arr[i].ty == 'ms' || arr[i].ty == 'pb'){
if(!processedPos){
modifier = ShapeModifiers.getModifier(arr[i].ty);
modifier.init(this,arr[i]);
diff --git a/player/js/utils/shapes/PuckerAndBloatModifier.js b/player/js/utils/shapes/PuckerAndBloatModifier.js
new file mode 100644
index 0000000..c3699a0
--- /dev/null
+++ b/player/js/utils/shapes/PuckerAndBloatModifier.js
@@ -0,0 +1,62 @@
+function PuckerAndBloatModifier(){}
+extendPrototype([ShapeModifier],PuckerAndBloatModifier);
+PuckerAndBloatModifier.prototype.initModifierProperties = function(elem,data){
+ this.getValue = this.processKeys;
+ this.amount = PropertyFactory.getProp(elem,data.a,0,null,this);
+ this._isAnimated = !!this.amount.effectsSequence.length;
+};
+
+PuckerAndBloatModifier.prototype.processPath = function(path, amount){
+ var percent = amount / 100;
+ var centerPoint = [0, 0];
+ var pathLength = path._length, i = 0;
+ for (i = 0; i < pathLength; i += 1) {
+ centerPoint[0] += path.v[i][0];
+ centerPoint[1] += path.v[i][1];
+ }
+ centerPoint[0] /= pathLength;
+ centerPoint[1] /= pathLength;
+ var cloned_path = shape_pool.newElement();
+ cloned_path.c = path.c;
+ var vX, vY, oX, oY, iX, iY;
+ for(i = 0; i < pathLength; i += 1) {
+ vX = path.v[i][0] + (centerPoint[0] - path.v[i][0]) * percent;
+ vY = path.v[i][1] + (centerPoint[1] - path.v[i][1]) * percent;
+ oX = path.o[i][0] + (centerPoint[0] - path.o[i][0]) * -percent;
+ oY = path.o[i][1] + (centerPoint[1] - path.o[i][1]) * -percent;
+ iX = path.i[i][0] + (centerPoint[0] - path.i[i][0]) * -percent;
+ iY = path.i[i][1] + (centerPoint[1] - path.i[i][1]) * -percent;
+ cloned_path.setTripleAt(vX, vY, oX, oY, iX, iY, i);
+ }
+ return cloned_path;
+};
+
+PuckerAndBloatModifier.prototype.processShapes = function(_isFirstFrame){
+ var shapePaths;
+ var i, len = this.shapes.length;
+ var j, jLen;
+ var amount = this.amount.v;
+
+ if(amount !== 0){
+ var shapeData, newPaths, localShapeCollection;
+ for(i=0;i<len;i+=1){
+ shapeData = this.shapes[i];
+ newPaths = shapeData.shape.paths;
+ localShapeCollection = shapeData.localShapeCollection;
+ if(!(!shapeData.shape._mdf && !this._mdf && !_isFirstFrame)){
+ localShapeCollection.releaseShapes();
+ shapeData.shape._mdf = true;
+ shapePaths = shapeData.shape.paths.shapes;
+ jLen = shapeData.shape.paths._length;
+ for(j=0;j<jLen;j+=1){
+ localShapeCollection.addShape(this.processPath(shapePaths[j], amount));
+ }
+ }
+ shapeData.shape.paths = shapeData.localShapeCollection;
+ }
+ }
+ if(!this.dynamicProperties.length){
+ this._mdf = false;
+ }
+};
+ShapeModifiers.registerModifier('pb',PuckerAndBloatModifier);
\ No newline at end of file
diff --git a/tasks/build.js b/tasks/build.js
index 3048782..f03eb3f 100644
--- a/tasks/build.js
+++ b/tasks/build.js
@@ -109,6 +109,10 @@
builds: defaultBuilds
},
{
+ src: 'js/utils/shapes/PuckerAndBloatModifier.js',
+ builds: defaultBuilds
+ },
+ {
src: 'js/utils/shapes/RepeaterModifier.js',
builds: defaultBuilds
},
