moved property groups to factory
diff --git a/player/index.html b/player/index.html
index d16e402..75fe01a 100644
--- a/player/index.html
+++ b/player/index.html
@@ -141,6 +141,7 @@
<script src="js/utils/expressions/expressionHelpers.js" data-builds="full,svg,canvas,html,canvas_worker"></script>
<script src="js/utils/expressions/ExpressionPropertyDecorator.js" data-builds="full,svg,canvas,html,canvas_worker"></script>
<script src="js/utils/expressions/ExpressionTextPropertyDecorator.js" data-builds="full,svg,canvas,html,canvas_worker"></script>
+ <script src="js/utils/expressions/PropertyGroupFactory.js" data-builds="full,svg,canvas,html,canvas_worker"></script>
<script src="js/utils/expressions/PropertyInterface.js" data-builds="full,svg,canvas,html,canvas_worker"></script>
<script src="js/utils/expressions/ShapeInterface.js" data-builds="full,svg,canvas,html,canvas_worker"></script>
<script src="js/utils/expressions/shapes/ShapePathInterface.js" data-builds="full,svg,canvas,html,canvas_worker"></script>
@@ -175,7 +176,7 @@
container: elem,
renderer: 'svg',
loop: false,
- autoplay: true,
+ autoplay: false,
rendererSettings: {
progressiveLoad:false,
preserveAspectRatio: 'xMidYMid meet',
diff --git a/player/js/utils/expressions/EffectInterface.js b/player/js/utils/expressions/EffectInterface.js
index df573bc..bbe5201 100644
--- a/player/js/utils/expressions/EffectInterface.js
+++ b/player/js/utils/expressions/EffectInterface.js
@@ -33,26 +33,8 @@
}
function createGroupInterface(data,elements, propertyGroup, elem){
- var effectElements = [];
- var i, len = data.ef.length;
- for(i=0;i<len;i+=1){
- if(data.ef[i].ty === 5){
- effectElements.push(createGroupInterface(data.ef[i],elements.effectElements[i],elements.effectElements[i].propertyGroup, elem));
- } else {
- effectElements.push(createValueInterface(elements.effectElements[i],data.ef[i].ty, elem, _propertyGroup));
- }
- }
- function _propertyGroup(val) {
- val = val === undefined ? 1 : val
- if(val <= 0){
- return groupInterface;
- } else{
- return propertyGroup(val-1);
- }
- }
-
- var groupInterface = function(name){
+ function groupInterface(name){
var effects = data.ef, i = 0, len = effects.length;
while(i<len) {
if(name === effects[i].nm || name === effects[i].mn || name === effects[i].ix){
@@ -66,8 +48,17 @@
}
return effectElements[0]();
};
+ var _propertyGroup = propertyGroupFactory(groupInterface, propertyGroup);
- groupInterface.propertyGroup = _propertyGroup;
+ var effectElements = [];
+ var i, len = data.ef.length;
+ for(i=0;i<len;i+=1){
+ if(data.ef[i].ty === 5){
+ effectElements.push(createGroupInterface(data.ef[i],elements.effectElements[i],elements.effectElements[i].propertyGroup, elem));
+ } else {
+ effectElements.push(createValueInterface(elements.effectElements[i],data.ef[i].ty, elem, _propertyGroup));
+ }
+ }
if(data.mn === 'ADBE Color Control'){
Object.defineProperty(groupInterface, 'color', {
@@ -77,12 +68,13 @@
});
}
Object.defineProperties(groupInterface, {
- 'numProperties': {
+ numProperties: {
get: function(){
return data.np;
}
},
- '_name': { value: data.nm }
+ _name: { value: data.nm },
+ propertyGroup: {value: _propertyGroup},
});
groupInterface.active = groupInterface.enabled = data.en !== 0;
return groupInterface;
diff --git a/player/js/utils/expressions/PropertyGroupFactory.js b/player/js/utils/expressions/PropertyGroupFactory.js
new file mode 100644
index 0000000..643b56f
--- /dev/null
+++ b/player/js/utils/expressions/PropertyGroupFactory.js
@@ -0,0 +1,12 @@
+var propertyGroupFactory = (function() {
+ return function(interfaceFunction, parentPropertyGroup) {
+ return function(val) {
+ val = val === undefined ? 1 : val
+ if(val <= 0){
+ return interfaceFunction;
+ } else{
+ return parentPropertyGroup(val-1);
+ }
+ }
+ }
+}())
\ No newline at end of file
diff --git a/player/js/utils/expressions/ShapeInterface.js b/player/js/utils/expressions/ShapeInterface.js
index 0c5b8ab..2299a82 100644
--- a/player/js/utils/expressions/ShapeInterface.js
+++ b/player/js/utils/expressions/ShapeInterface.js
@@ -45,14 +45,8 @@
return interfaces[value-1];
}
};
- interfaceFunction.propertyGroup = function(val){
- val = val === undefined ? 1 : val
- if(val <= 0){
- return interfaceFunction;
- } else{
- return propertyGroup(val-1);
- }
- };
+
+ interfaceFunction.propertyGroup = propertyGroupFactory(interfaceFunction, propertyGroup);
interfaces = iterateElements(shape.it, view.it, interfaceFunction.propertyGroup);
interfaceFunction.numProperties = interfaces.length;
var transformInterface = transformInterfaceFactory(shape.it[shape.it.length - 1],view.it[view.it.length - 1],interfaceFunction.propertyGroup);
@@ -77,14 +71,7 @@
return interfaceFunction.transform;
}
};
- interfaceFunction.propertyGroup = function(val){
- val = val === undefined ? 1 : val
- if(val <= 0){
- return interfaceFunction;
- } else{
- return propertyGroup(val-1);
- }
- };
+ interfaceFunction.propertyGroup = propertyGroupFactory(interfaceFunction, propertyGroup);
var content = contentsInterfaceFactory(shape,view,interfaceFunction.propertyGroup);
var transformInterface = transformInterfaceFactory(shape.it[shape.it.length - 1],view.it[view.it.length - 1],interfaceFunction.propertyGroup);
interfaceFunction.content = content;
@@ -127,22 +114,8 @@
}
function strokeInterfaceFactory(shape,view,propertyGroup){
- function _propertyGroup(val){
- val = val === undefined ? 1 : val
- if(val <= 0){
- return ob;
- } else{
- return propertyGroup(val-1);
- }
- }
- function _dashPropertyGroup(val){
- val = val === undefined ? 1 : val
- if(val <= 0){
- return dashOb;
- } else{
- return _propertyGroup(val-1);
- }
- }
+ var _propertyGroup = propertyGroupFactory(interfaceFunction, propertyGroup);
+ var _dashPropertyGroup = propertyGroupFactory(dashOb, _propertyGroup);
function addPropertyToDashOb(i) {
Object.defineProperty(dashOb, shape.d[i].nm, {
get: ExpressionPropertyInterface(view.d.dataProps[i].p)
@@ -190,19 +163,6 @@
}
function trimInterfaceFactory(shape,view,propertyGroup){
- function _propertyGroup(val){
- val = val === undefined ? 1 : val
- if(val <= 0){
- return interfaceFunction;
- } else {
- return propertyGroup(--val);
- }
- }
- interfaceFunction.propertyIndex = shape.ix;
-
- view.s.setGroupProperty(PropertyInterface('Start', _propertyGroup));
- view.e.setGroupProperty(PropertyInterface('End', _propertyGroup));
- view.o.setGroupProperty(PropertyInterface('Offset', _propertyGroup));
function interfaceFunction(val){
if(val === shape.e.ix || val === 'End' || val === 'end'){
@@ -215,6 +175,13 @@
return interfaceFunction.offset;
}
}
+
+ var _propertyGroup = propertyGroupFactory(interfaceFunction, propertyGroup);
+ interfaceFunction.propertyIndex = shape.ix;
+
+ view.s.setGroupProperty(PropertyInterface('Start', _propertyGroup));
+ view.e.setGroupProperty(PropertyInterface('End', _propertyGroup));
+ view.o.setGroupProperty(PropertyInterface('Offset', _propertyGroup));
interfaceFunction.propertyIndex = shape.ix;
interfaceFunction.propertyGroup = propertyGroup;
@@ -235,24 +202,6 @@
}
function transformInterfaceFactory(shape,view,propertyGroup){
- function _propertyGroup(val){
- val = val === undefined ? 1 : val
- if(val <= 0){
- return interfaceFunction;
- } else {
- return propertyGroup(--val);
- }
- }
- view.transform.mProps.o.setGroupProperty(PropertyInterface('Opacity', _propertyGroup));
- view.transform.mProps.p.setGroupProperty(PropertyInterface('Position', _propertyGroup));
- view.transform.mProps.a.setGroupProperty(PropertyInterface('Anchor Point', _propertyGroup));
- view.transform.mProps.s.setGroupProperty(PropertyInterface('Scale', _propertyGroup));
- view.transform.mProps.r.setGroupProperty(PropertyInterface('Rotation', _propertyGroup));
- if(view.transform.mProps.sk){
- view.transform.mProps.sk.setGroupProperty(PropertyInterface('Skew', _propertyGroup));
- view.transform.mProps.sa.setGroupProperty(PropertyInterface('Skew Angle', _propertyGroup));
- }
- view.transform.op.setGroupProperty(PropertyInterface('Opacity', _propertyGroup));
function interfaceFunction(value){
if(shape.a.ix === value || value === 'Anchor Point'){
@@ -276,8 +225,19 @@
if(shape.sa && shape.sa.ix === value || value === 'Skew Axis'){
return interfaceFunction.skewAxis;
}
-
}
+
+ var _propertyGroup = propertyGroupFactory(interfaceFunction, propertyGroup);
+ view.transform.mProps.o.setGroupProperty(PropertyInterface('Opacity', _propertyGroup));
+ view.transform.mProps.p.setGroupProperty(PropertyInterface('Position', _propertyGroup));
+ view.transform.mProps.a.setGroupProperty(PropertyInterface('Anchor Point', _propertyGroup));
+ view.transform.mProps.s.setGroupProperty(PropertyInterface('Scale', _propertyGroup));
+ view.transform.mProps.r.setGroupProperty(PropertyInterface('Rotation', _propertyGroup));
+ if(view.transform.mProps.sk){
+ view.transform.mProps.sk.setGroupProperty(PropertyInterface('Skew', _propertyGroup));
+ view.transform.mProps.sa.setGroupProperty(PropertyInterface('Skew Angle', _propertyGroup));
+ }
+ view.transform.op.setGroupProperty(PropertyInterface('Opacity', _propertyGroup));
Object.defineProperties(interfaceFunction, {
'opacity': {
get: ExpressionPropertyInterface(view.transform.mProps.o)
@@ -309,18 +269,7 @@
}
function ellipseInterfaceFactory(shape,view,propertyGroup){
- function _propertyGroup(val){
- val = val === undefined ? 1 : val
- if(val <= 0){
- return interfaceFunction;
- } else {
- return propertyGroup(--val);
- }
- }
- interfaceFunction.propertyIndex = shape.ix;
- var prop = view.sh.ty === 'tm' ? view.sh.prop : view.sh;
- prop.s.setGroupProperty(PropertyInterface('Size', _propertyGroup));
- prop.p.setGroupProperty(PropertyInterface('Position', _propertyGroup));
+
function interfaceFunction(value){
if(shape.p.ix === value){
return interfaceFunction.position;
@@ -329,6 +278,11 @@
return interfaceFunction.size;
}
}
+ var _propertyGroup = propertyGroupFactory(interfaceFunction, propertyGroup);
+ interfaceFunction.propertyIndex = shape.ix;
+ var prop = view.sh.ty === 'tm' ? view.sh.prop : view.sh;
+ prop.s.setGroupProperty(PropertyInterface('Size', _propertyGroup));
+ prop.p.setGroupProperty(PropertyInterface('Position', _propertyGroup));
Object.defineProperties(interfaceFunction, {
'size': {
@@ -344,25 +298,6 @@
}
function starInterfaceFactory(shape,view,propertyGroup){
- function _propertyGroup(val){
- val = val === undefined ? 1 : val
- if(val <= 0){
- return interfaceFunction;
- } else {
- return propertyGroup(--val);
- }
- }
- var prop = view.sh.ty === 'tm' ? view.sh.prop : view.sh;
- interfaceFunction.propertyIndex = shape.ix;
- prop.or.setGroupProperty(PropertyInterface('Outer Radius', _propertyGroup));
- prop.os.setGroupProperty(PropertyInterface('Outer Roundness', _propertyGroup));
- prop.pt.setGroupProperty(PropertyInterface('Points', _propertyGroup));
- prop.p.setGroupProperty(PropertyInterface('Position', _propertyGroup));
- prop.r.setGroupProperty(PropertyInterface('Rotation', _propertyGroup));
- if(shape.ir){
- prop.ir.setGroupProperty(PropertyInterface('Inner Radius', _propertyGroup));
- prop.is.setGroupProperty(PropertyInterface('Inner Roundness', _propertyGroup));
- }
function interfaceFunction(value){
if(shape.p.ix === value){
@@ -389,6 +324,19 @@
}
+ var _propertyGroup = propertyGroupFactory(interfaceFunction, propertyGroup);
+ var prop = view.sh.ty === 'tm' ? view.sh.prop : view.sh;
+ interfaceFunction.propertyIndex = shape.ix;
+ prop.or.setGroupProperty(PropertyInterface('Outer Radius', _propertyGroup));
+ prop.os.setGroupProperty(PropertyInterface('Outer Roundness', _propertyGroup));
+ prop.pt.setGroupProperty(PropertyInterface('Points', _propertyGroup));
+ prop.p.setGroupProperty(PropertyInterface('Position', _propertyGroup));
+ prop.r.setGroupProperty(PropertyInterface('Rotation', _propertyGroup));
+ if(shape.ir){
+ prop.ir.setGroupProperty(PropertyInterface('Inner Radius', _propertyGroup));
+ prop.is.setGroupProperty(PropertyInterface('Inner Roundness', _propertyGroup));
+ }
+
Object.defineProperties(interfaceFunction, {
'position': {
get: ExpressionPropertyInterface(prop.p)
@@ -418,19 +366,6 @@
}
function rectInterfaceFactory(shape,view,propertyGroup){
- function _propertyGroup(val){
- val = val === undefined ? 1 : val
- if(val <= 0){
- return interfaceFunction;
- } else {
- return propertyGroup(--val);
- }
- }
- var prop = view.sh.ty === 'tm' ? view.sh.prop : view.sh;
- interfaceFunction.propertyIndex = shape.ix;
- prop.p.setGroupProperty(PropertyInterface('Position', _propertyGroup));
- prop.s.setGroupProperty(PropertyInterface('Size', _propertyGroup));
- prop.r.setGroupProperty(PropertyInterface('Rotation', _propertyGroup));
function interfaceFunction(value){
if(shape.p.ix === value){
@@ -444,6 +379,14 @@
}
}
+ var _propertyGroup = propertyGroupFactory(interfaceFunction, propertyGroup);
+
+ var prop = view.sh.ty === 'tm' ? view.sh.prop : view.sh;
+ interfaceFunction.propertyIndex = shape.ix;
+ prop.p.setGroupProperty(PropertyInterface('Position', _propertyGroup));
+ prop.s.setGroupProperty(PropertyInterface('Size', _propertyGroup));
+ prop.r.setGroupProperty(PropertyInterface('Rotation', _propertyGroup));
+
Object.defineProperties(interfaceFunction, {
'position': {
get: ExpressionPropertyInterface(prop.p)
@@ -461,24 +404,18 @@
}
function roundedInterfaceFactory(shape,view,propertyGroup){
- function _propertyGroup(val){
- val = val === undefined ? 1 : val
- if(val <= 0){
- return interfaceFunction;
- } else {
- return propertyGroup(--val);
- }
- }
- var prop = view;
- interfaceFunction.propertyIndex = shape.ix;
- prop.rd.setGroupProperty(PropertyInterface('Radius', _propertyGroup));
-
+
function interfaceFunction(value){
if(shape.r.ix === value || 'Round Corners 1' === value){
return interfaceFunction.radius;
}
-
}
+
+ var _propertyGroup = propertyGroupFactory(interfaceFunction, propertyGroup);
+ var prop = view;
+ interfaceFunction.propertyIndex = shape.ix;
+ prop.rd.setGroupProperty(PropertyInterface('Radius', _propertyGroup));
+
Object.defineProperties(interfaceFunction, {
'radius': {
get: ExpressionPropertyInterface(prop.rd)
@@ -490,18 +427,6 @@
}
function repeaterInterfaceFactory(shape,view,propertyGroup){
- function _propertyGroup(val){
- val = val === undefined ? 1 : val
- if(val <= 0){
- return interfaceFunction;
- } else {
- return propertyGroup(--val);
- }
- }
- var prop = view;
- interfaceFunction.propertyIndex = shape.ix;
- prop.c.setGroupProperty(PropertyInterface('Copies', _propertyGroup));
- prop.o.setGroupProperty(PropertyInterface('Offset', _propertyGroup));
function interfaceFunction(value){
if(shape.c.ix === value || 'Copies' === value){
@@ -509,8 +434,13 @@
} else if(shape.o.ix === value || 'Offset' === value){
return interfaceFunction.offset;
}
-
}
+
+ var _propertyGroup = propertyGroupFactory(interfaceFunction, propertyGroup);
+ var prop = view;
+ interfaceFunction.propertyIndex = shape.ix;
+ prop.c.setGroupProperty(PropertyInterface('Copies', _propertyGroup));
+ prop.o.setGroupProperty(PropertyInterface('Offset', _propertyGroup));
Object.defineProperties(interfaceFunction, {
'copies': {
get: ExpressionPropertyInterface(prop.c)
diff --git a/player/js/utils/expressions/shapes/ShapePathInterface.js b/player/js/utils/expressions/shapes/ShapePathInterface.js
index 661fe67..b99c91d 100644
--- a/player/js/utils/expressions/shapes/ShapePathInterface.js
+++ b/player/js/utils/expressions/shapes/ShapePathInterface.js
@@ -4,21 +4,15 @@
return function pathInterfaceFactory(shape,view,propertyGroup){
var prop = view.sh;
- function _propertyGroup(val){
- val = val === undefined ? 1 : val
- if(val <= 0){
- return interfaceFunction;
- } else {
- return propertyGroup(--val);
- }
- }
- prop.setGroupProperty(PropertyInterface('Path', _propertyGroup));
function interfaceFunction(val){
if(val === 'Shape' || val === 'shape' || val === 'Path' || val === 'path' || val === 'ADBE Vector Shape' || val === 2){
return interfaceFunction.path;
}
}
+
+ var _propertyGroup = propertyGroupFactory(interfaceFunction, propertyGroup);
+ prop.setGroupProperty(PropertyInterface('Path', _propertyGroup));
Object.defineProperties(interfaceFunction, {
'path': {
get: function(){
diff --git a/tasks/build.js b/tasks/build.js
index 49a76b9..3048782 100644
--- a/tasks/build.js
+++ b/tasks/build.js
@@ -481,6 +481,10 @@
builds: ['full','svg','canvas','html','canvas_worker']
},
{
+ src: 'js/utils/expressions/PropertyGroupFactory.js',
+ builds: ['full','svg','canvas','html','canvas_worker']
+ },
+ {
src: 'js/utils/expressions/PropertyInterface.js',
builds: ['full','svg','canvas','html','canvas_worker']
},
