Merge branch 'master' into 88_slots
diff --git a/player/js/elements/ImageElement.js b/player/js/elements/ImageElement.js
index 337c358..5bee39a 100644
--- a/player/js/elements/ImageElement.js
+++ b/player/js/elements/ImageElement.js
@@ -12,6 +12,9 @@
function IImageElement(data, globalData, comp) {
this.assetData = globalData.getAssetData(data.refId);
+ if (this.assetData && this.assetData.sid) {
+ this.assetData = globalData.slotManager.getProp(this.assetData);
+ }
this.initElement(data, globalData, comp);
this.sourceRect = {
top: 0, left: 0, width: this.assetData.w, height: this.assetData.h,
diff --git a/player/js/renderers/BaseRenderer.js b/player/js/renderers/BaseRenderer.js
index 53b3252..324e8e4 100644
--- a/player/js/renderers/BaseRenderer.js
+++ b/player/js/renderers/BaseRenderer.js
@@ -1,4 +1,5 @@
import FontManager from '../utils/FontManager';
+import slotFactory from '../utils/SlotManager';
import FootageElement from '../elements/FootageElement';
import AudioElement from '../elements/AudioElement';
@@ -167,6 +168,7 @@
BaseRenderer.prototype.setupGlobalData = function (animData, fontsContainer) {
this.globalData.fontManager = new FontManager();
+ this.globalData.slotManager = slotFactory(animData);
this.globalData.fontManager.addChars(animData.chars);
this.globalData.fontManager.addFonts(animData.fonts, fontsContainer);
this.globalData.getAssetData = this.animationItem.getAssetData.bind(this.animationItem);
diff --git a/player/js/utils/PropertyFactory.js b/player/js/utils/PropertyFactory.js
index 435b5de..4c559d5 100644
--- a/player/js/utils/PropertyFactory.js
+++ b/player/js/utils/PropertyFactory.js
@@ -10,450 +10,453 @@
} from '../main';
import bez from './bez';
-const PropertyFactory = (function () {
- var initFrame = initialDefaultFrame;
- var mathAbs = Math.abs;
+var initFrame = initialDefaultFrame;
+var mathAbs = Math.abs;
- function interpolateValue(frameNum, caching) {
- var offsetTime = this.offsetTime;
- var newValue;
- if (this.propType === 'multidimensional') {
- newValue = createTypedArray('float32', this.pv.length);
+function interpolateValue(frameNum, caching) {
+ var offsetTime = this.offsetTime;
+ var newValue;
+ if (this.propType === 'multidimensional') {
+ newValue = createTypedArray('float32', this.pv.length);
+ }
+ var iterationIndex = caching.lastIndex;
+ var i = iterationIndex;
+ var len = this.keyframes.length - 1;
+ var flag = true;
+ var keyData;
+ var nextKeyData;
+ var keyframeMetadata;
+
+ while (flag) {
+ keyData = this.keyframes[i];
+ nextKeyData = this.keyframes[i + 1];
+ if (i === len - 1 && frameNum >= nextKeyData.t - offsetTime) {
+ if (keyData.h) {
+ keyData = nextKeyData;
+ }
+ iterationIndex = 0;
+ break;
}
- var iterationIndex = caching.lastIndex;
- var i = iterationIndex;
- var len = this.keyframes.length - 1;
- var flag = true;
- var keyData;
- var nextKeyData;
- var keyframeMetadata;
-
- while (flag) {
- keyData = this.keyframes[i];
- nextKeyData = this.keyframes[i + 1];
- if (i === len - 1 && frameNum >= nextKeyData.t - offsetTime) {
- if (keyData.h) {
- keyData = nextKeyData;
- }
- iterationIndex = 0;
- break;
- }
- if ((nextKeyData.t - offsetTime) > frameNum) {
- iterationIndex = i;
- break;
- }
- if (i < len - 1) {
- i += 1;
- } else {
- iterationIndex = 0;
- flag = false;
- }
+ if ((nextKeyData.t - offsetTime) > frameNum) {
+ iterationIndex = i;
+ break;
}
- keyframeMetadata = this.keyframesMetadata[i] || {};
+ if (i < len - 1) {
+ i += 1;
+ } else {
+ iterationIndex = 0;
+ flag = false;
+ }
+ }
+ keyframeMetadata = this.keyframesMetadata[i] || {};
- var k;
- var kLen;
- var perc;
- var jLen;
- var j;
- var fnc;
- var nextKeyTime = nextKeyData.t - offsetTime;
- var keyTime = keyData.t - offsetTime;
- var endValue;
- if (keyData.to) {
- if (!keyframeMetadata.bezierData) {
- keyframeMetadata.bezierData = bez.buildBezierData(keyData.s, nextKeyData.s || keyData.e, keyData.to, keyData.ti);
+ var k;
+ var kLen;
+ var perc;
+ var jLen;
+ var j;
+ var fnc;
+ var nextKeyTime = nextKeyData.t - offsetTime;
+ var keyTime = keyData.t - offsetTime;
+ var endValue;
+ if (keyData.to) {
+ if (!keyframeMetadata.bezierData) {
+ keyframeMetadata.bezierData = bez.buildBezierData(keyData.s, nextKeyData.s || keyData.e, keyData.to, keyData.ti);
+ }
+ var bezierData = keyframeMetadata.bezierData;
+ if (frameNum >= nextKeyTime || frameNum < keyTime) {
+ var ind = frameNum >= nextKeyTime ? bezierData.points.length - 1 : 0;
+ kLen = bezierData.points[ind].point.length;
+ for (k = 0; k < kLen; k += 1) {
+ newValue[k] = bezierData.points[ind].point[k];
}
- var bezierData = keyframeMetadata.bezierData;
- if (frameNum >= nextKeyTime || frameNum < keyTime) {
- var ind = frameNum >= nextKeyTime ? bezierData.points.length - 1 : 0;
- kLen = bezierData.points[ind].point.length;
- for (k = 0; k < kLen; k += 1) {
- newValue[k] = bezierData.points[ind].point[k];
- }
- // caching._lastKeyframeIndex = -1;
+ // caching._lastKeyframeIndex = -1;
+ } else {
+ if (keyframeMetadata.__fnct) {
+ fnc = keyframeMetadata.__fnct;
} else {
- if (keyframeMetadata.__fnct) {
- fnc = keyframeMetadata.__fnct;
+ fnc = BezierFactory.getBezierEasing(keyData.o.x, keyData.o.y, keyData.i.x, keyData.i.y, keyData.n).get;
+ keyframeMetadata.__fnct = fnc;
+ }
+ perc = fnc((frameNum - keyTime) / (nextKeyTime - keyTime));
+ var distanceInLine = bezierData.segmentLength * perc;
+
+ var segmentPerc;
+ var addedLength = (caching.lastFrame < frameNum && caching._lastKeyframeIndex === i) ? caching._lastAddedLength : 0;
+ j = (caching.lastFrame < frameNum && caching._lastKeyframeIndex === i) ? caching._lastPoint : 0;
+ flag = true;
+ jLen = bezierData.points.length;
+ while (flag) {
+ addedLength += bezierData.points[j].partialLength;
+ if (distanceInLine === 0 || perc === 0 || j === bezierData.points.length - 1) {
+ kLen = bezierData.points[j].point.length;
+ for (k = 0; k < kLen; k += 1) {
+ newValue[k] = bezierData.points[j].point[k];
+ }
+ break;
+ } else if (distanceInLine >= addedLength && distanceInLine < addedLength + bezierData.points[j + 1].partialLength) {
+ segmentPerc = (distanceInLine - addedLength) / bezierData.points[j + 1].partialLength;
+ kLen = bezierData.points[j].point.length;
+ for (k = 0; k < kLen; k += 1) {
+ newValue[k] = bezierData.points[j].point[k] + (bezierData.points[j + 1].point[k] - bezierData.points[j].point[k]) * segmentPerc;
+ }
+ break;
+ }
+ if (j < jLen - 1) {
+ j += 1;
} else {
- fnc = BezierFactory.getBezierEasing(keyData.o.x, keyData.o.y, keyData.i.x, keyData.i.y, keyData.n).get;
- keyframeMetadata.__fnct = fnc;
+ flag = false;
}
- perc = fnc((frameNum - keyTime) / (nextKeyTime - keyTime));
- var distanceInLine = bezierData.segmentLength * perc;
-
- var segmentPerc;
- var addedLength = (caching.lastFrame < frameNum && caching._lastKeyframeIndex === i) ? caching._lastAddedLength : 0;
- j = (caching.lastFrame < frameNum && caching._lastKeyframeIndex === i) ? caching._lastPoint : 0;
- flag = true;
- jLen = bezierData.points.length;
- while (flag) {
- addedLength += bezierData.points[j].partialLength;
- if (distanceInLine === 0 || perc === 0 || j === bezierData.points.length - 1) {
- kLen = bezierData.points[j].point.length;
- for (k = 0; k < kLen; k += 1) {
- newValue[k] = bezierData.points[j].point[k];
- }
- break;
- } else if (distanceInLine >= addedLength && distanceInLine < addedLength + bezierData.points[j + 1].partialLength) {
- segmentPerc = (distanceInLine - addedLength) / bezierData.points[j + 1].partialLength;
- kLen = bezierData.points[j].point.length;
- for (k = 0; k < kLen; k += 1) {
- newValue[k] = bezierData.points[j].point[k] + (bezierData.points[j + 1].point[k] - bezierData.points[j].point[k]) * segmentPerc;
- }
- break;
- }
- if (j < jLen - 1) {
- j += 1;
- } else {
- flag = false;
- }
- }
- caching._lastPoint = j;
- caching._lastAddedLength = addedLength - bezierData.points[j].partialLength;
- caching._lastKeyframeIndex = i;
+ }
+ caching._lastPoint = j;
+ caching._lastAddedLength = addedLength - bezierData.points[j].partialLength;
+ caching._lastKeyframeIndex = i;
+ }
+ } else {
+ var outX;
+ var outY;
+ var inX;
+ var inY;
+ var keyValue;
+ len = keyData.s.length;
+ endValue = nextKeyData.s || keyData.e;
+ if (this.sh && keyData.h !== 1) {
+ if (frameNum >= nextKeyTime) {
+ newValue[0] = endValue[0];
+ newValue[1] = endValue[1];
+ newValue[2] = endValue[2];
+ } else if (frameNum <= keyTime) {
+ newValue[0] = keyData.s[0];
+ newValue[1] = keyData.s[1];
+ newValue[2] = keyData.s[2];
+ } else {
+ var quatStart = createQuaternion(keyData.s);
+ var quatEnd = createQuaternion(endValue);
+ var time = (frameNum - keyTime) / (nextKeyTime - keyTime);
+ quaternionToEuler(newValue, slerp(quatStart, quatEnd, time));
}
} else {
- var outX;
- var outY;
- var inX;
- var inY;
- var keyValue;
- len = keyData.s.length;
- endValue = nextKeyData.s || keyData.e;
- if (this.sh && keyData.h !== 1) {
- if (frameNum >= nextKeyTime) {
- newValue[0] = endValue[0];
- newValue[1] = endValue[1];
- newValue[2] = endValue[2];
- } else if (frameNum <= keyTime) {
- newValue[0] = keyData.s[0];
- newValue[1] = keyData.s[1];
- newValue[2] = keyData.s[2];
- } else {
- var quatStart = createQuaternion(keyData.s);
- var quatEnd = createQuaternion(endValue);
- var time = (frameNum - keyTime) / (nextKeyTime - keyTime);
- quaternionToEuler(newValue, slerp(quatStart, quatEnd, time));
- }
- } else {
- for (i = 0; i < len; i += 1) {
- if (keyData.h !== 1) {
- if (frameNum >= nextKeyTime) {
- perc = 1;
- } else if (frameNum < keyTime) {
- perc = 0;
- } else {
- if (keyData.o.x.constructor === Array) {
- if (!keyframeMetadata.__fnct) {
- keyframeMetadata.__fnct = [];
- }
- if (!keyframeMetadata.__fnct[i]) {
- outX = keyData.o.x[i] === undefined ? keyData.o.x[0] : keyData.o.x[i];
- outY = keyData.o.y[i] === undefined ? keyData.o.y[0] : keyData.o.y[i];
- inX = keyData.i.x[i] === undefined ? keyData.i.x[0] : keyData.i.x[i];
- inY = keyData.i.y[i] === undefined ? keyData.i.y[0] : keyData.i.y[i];
- fnc = BezierFactory.getBezierEasing(outX, outY, inX, inY).get;
- keyframeMetadata.__fnct[i] = fnc;
- } else {
- fnc = keyframeMetadata.__fnct[i];
- }
- } else if (!keyframeMetadata.__fnct) {
- outX = keyData.o.x;
- outY = keyData.o.y;
- inX = keyData.i.x;
- inY = keyData.i.y;
- fnc = BezierFactory.getBezierEasing(outX, outY, inX, inY).get;
- keyData.keyframeMetadata = fnc;
- } else {
- fnc = keyframeMetadata.__fnct;
+ for (i = 0; i < len; i += 1) {
+ if (keyData.h !== 1) {
+ if (frameNum >= nextKeyTime) {
+ perc = 1;
+ } else if (frameNum < keyTime) {
+ perc = 0;
+ } else {
+ if (keyData.o.x.constructor === Array) {
+ if (!keyframeMetadata.__fnct) {
+ keyframeMetadata.__fnct = [];
}
- perc = fnc((frameNum - keyTime) / (nextKeyTime - keyTime));
+ if (!keyframeMetadata.__fnct[i]) {
+ outX = keyData.o.x[i] === undefined ? keyData.o.x[0] : keyData.o.x[i];
+ outY = keyData.o.y[i] === undefined ? keyData.o.y[0] : keyData.o.y[i];
+ inX = keyData.i.x[i] === undefined ? keyData.i.x[0] : keyData.i.x[i];
+ inY = keyData.i.y[i] === undefined ? keyData.i.y[0] : keyData.i.y[i];
+ fnc = BezierFactory.getBezierEasing(outX, outY, inX, inY).get;
+ keyframeMetadata.__fnct[i] = fnc;
+ } else {
+ fnc = keyframeMetadata.__fnct[i];
+ }
+ } else if (!keyframeMetadata.__fnct) {
+ outX = keyData.o.x;
+ outY = keyData.o.y;
+ inX = keyData.i.x;
+ inY = keyData.i.y;
+ fnc = BezierFactory.getBezierEasing(outX, outY, inX, inY).get;
+ keyData.keyframeMetadata = fnc;
+ } else {
+ fnc = keyframeMetadata.__fnct;
}
+ perc = fnc((frameNum - keyTime) / (nextKeyTime - keyTime));
}
+ }
- endValue = nextKeyData.s || keyData.e;
- keyValue = keyData.h === 1 ? keyData.s[i] : keyData.s[i] + (endValue[i] - keyData.s[i]) * perc;
+ endValue = nextKeyData.s || keyData.e;
+ keyValue = keyData.h === 1 ? keyData.s[i] : keyData.s[i] + (endValue[i] - keyData.s[i]) * perc;
- if (this.propType === 'multidimensional') {
- newValue[i] = keyValue;
- } else {
- newValue = keyValue;
- }
+ if (this.propType === 'multidimensional') {
+ newValue[i] = keyValue;
+ } else {
+ newValue = keyValue;
}
}
}
- caching.lastIndex = iterationIndex;
- return newValue;
}
+ caching.lastIndex = iterationIndex;
+ return newValue;
+}
- // based on @Toji's https://github.com/toji/gl-matrix/
- function slerp(a, b, t) {
- var out = [];
- var ax = a[0];
- var ay = a[1];
- var az = a[2];
- var aw = a[3];
- var bx = b[0];
- var by = b[1];
- var bz = b[2];
- var bw = b[3];
+// based on @Toji's https://github.com/toji/gl-matrix/
+function slerp(a, b, t) {
+ var out = [];
+ var ax = a[0];
+ var ay = a[1];
+ var az = a[2];
+ var aw = a[3];
+ var bx = b[0];
+ var by = b[1];
+ var bz = b[2];
+ var bw = b[3];
- var omega;
- var cosom;
- var sinom;
- var scale0;
- var scale1;
+ var omega;
+ var cosom;
+ var sinom;
+ var scale0;
+ var scale1;
- cosom = ax * bx + ay * by + az * bz + aw * bw;
- if (cosom < 0.0) {
- cosom = -cosom;
- bx = -bx;
- by = -by;
- bz = -bz;
- bw = -bw;
+ cosom = ax * bx + ay * by + az * bz + aw * bw;
+ if (cosom < 0.0) {
+ cosom = -cosom;
+ bx = -bx;
+ by = -by;
+ bz = -bz;
+ bw = -bw;
+ }
+ if ((1.0 - cosom) > 0.000001) {
+ omega = Math.acos(cosom);
+ sinom = Math.sin(omega);
+ scale0 = Math.sin((1.0 - t) * omega) / sinom;
+ scale1 = Math.sin(t * omega) / sinom;
+ } else {
+ scale0 = 1.0 - t;
+ scale1 = t;
+ }
+ out[0] = scale0 * ax + scale1 * bx;
+ out[1] = scale0 * ay + scale1 * by;
+ out[2] = scale0 * az + scale1 * bz;
+ out[3] = scale0 * aw + scale1 * bw;
+
+ return out;
+}
+
+function quaternionToEuler(out, quat) {
+ var qx = quat[0];
+ var qy = quat[1];
+ var qz = quat[2];
+ var qw = quat[3];
+ var heading = Math.atan2(2 * qy * qw - 2 * qx * qz, 1 - 2 * qy * qy - 2 * qz * qz);
+ var attitude = Math.asin(2 * qx * qy + 2 * qz * qw);
+ var bank = Math.atan2(2 * qx * qw - 2 * qy * qz, 1 - 2 * qx * qx - 2 * qz * qz);
+ out[0] = heading / degToRads;
+ out[1] = attitude / degToRads;
+ out[2] = bank / degToRads;
+}
+
+function createQuaternion(values) {
+ var heading = values[0] * degToRads;
+ var attitude = values[1] * degToRads;
+ var bank = values[2] * degToRads;
+ var c1 = Math.cos(heading / 2);
+ var c2 = Math.cos(attitude / 2);
+ var c3 = Math.cos(bank / 2);
+ var s1 = Math.sin(heading / 2);
+ var s2 = Math.sin(attitude / 2);
+ var s3 = Math.sin(bank / 2);
+ var w = c1 * c2 * c3 - s1 * s2 * s3;
+ var x = s1 * s2 * c3 + c1 * c2 * s3;
+ var y = s1 * c2 * c3 + c1 * s2 * s3;
+ var z = c1 * s2 * c3 - s1 * c2 * s3;
+
+ return [x, y, z, w];
+}
+
+function getValueAtCurrentTime() {
+ var frameNum = this.comp.renderedFrame - this.offsetTime;
+ var initTime = this.keyframes[0].t - this.offsetTime;
+ var endTime = this.keyframes[this.keyframes.length - 1].t - this.offsetTime;
+ if (!(frameNum === this._caching.lastFrame || (this._caching.lastFrame !== initFrame && ((this._caching.lastFrame >= endTime && frameNum >= endTime) || (this._caching.lastFrame < initTime && frameNum < initTime))))) {
+ if (this._caching.lastFrame >= frameNum) {
+ this._caching._lastKeyframeIndex = -1;
+ this._caching.lastIndex = 0;
}
- if ((1.0 - cosom) > 0.000001) {
- omega = Math.acos(cosom);
- sinom = Math.sin(omega);
- scale0 = Math.sin((1.0 - t) * omega) / sinom;
- scale1 = Math.sin(t * omega) / sinom;
- } else {
- scale0 = 1.0 - t;
- scale1 = t;
+
+ var renderResult = this.interpolateValue(frameNum, this._caching);
+ this.pv = renderResult;
+ }
+ this._caching.lastFrame = frameNum;
+ return this.pv;
+}
+
+function setVValue(val) {
+ var multipliedValue;
+ if (this.propType === 'unidimensional') {
+ multipliedValue = val * this.mult;
+ if (mathAbs(this.v - multipliedValue) > 0.00001) {
+ this.v = multipliedValue;
+ this._mdf = true;
}
- out[0] = scale0 * ax + scale1 * bx;
- out[1] = scale0 * ay + scale1 * by;
- out[2] = scale0 * az + scale1 * bz;
- out[3] = scale0 * aw + scale1 * bw;
-
- return out;
- }
-
- function quaternionToEuler(out, quat) {
- var qx = quat[0];
- var qy = quat[1];
- var qz = quat[2];
- var qw = quat[3];
- var heading = Math.atan2(2 * qy * qw - 2 * qx * qz, 1 - 2 * qy * qy - 2 * qz * qz);
- var attitude = Math.asin(2 * qx * qy + 2 * qz * qw);
- var bank = Math.atan2(2 * qx * qw - 2 * qy * qz, 1 - 2 * qx * qx - 2 * qz * qz);
- out[0] = heading / degToRads;
- out[1] = attitude / degToRads;
- out[2] = bank / degToRads;
- }
-
- function createQuaternion(values) {
- var heading = values[0] * degToRads;
- var attitude = values[1] * degToRads;
- var bank = values[2] * degToRads;
- var c1 = Math.cos(heading / 2);
- var c2 = Math.cos(attitude / 2);
- var c3 = Math.cos(bank / 2);
- var s1 = Math.sin(heading / 2);
- var s2 = Math.sin(attitude / 2);
- var s3 = Math.sin(bank / 2);
- var w = c1 * c2 * c3 - s1 * s2 * s3;
- var x = s1 * s2 * c3 + c1 * c2 * s3;
- var y = s1 * c2 * c3 + c1 * s2 * s3;
- var z = c1 * s2 * c3 - s1 * c2 * s3;
-
- return [x, y, z, w];
- }
-
- function getValueAtCurrentTime() {
- var frameNum = this.comp.renderedFrame - this.offsetTime;
- var initTime = this.keyframes[0].t - this.offsetTime;
- var endTime = this.keyframes[this.keyframes.length - 1].t - this.offsetTime;
- if (!(frameNum === this._caching.lastFrame || (this._caching.lastFrame !== initFrame && ((this._caching.lastFrame >= endTime && frameNum >= endTime) || (this._caching.lastFrame < initTime && frameNum < initTime))))) {
- if (this._caching.lastFrame >= frameNum) {
- this._caching._lastKeyframeIndex = -1;
- this._caching.lastIndex = 0;
- }
-
- var renderResult = this.interpolateValue(frameNum, this._caching);
- this.pv = renderResult;
- }
- this._caching.lastFrame = frameNum;
- return this.pv;
- }
-
- function setVValue(val) {
- var multipliedValue;
- if (this.propType === 'unidimensional') {
- multipliedValue = val * this.mult;
- if (mathAbs(this.v - multipliedValue) > 0.00001) {
- this.v = multipliedValue;
+ } else {
+ var i = 0;
+ var len = this.v.length;
+ while (i < len) {
+ multipliedValue = val[i] * this.mult;
+ if (mathAbs(this.v[i] - multipliedValue) > 0.00001) {
+ this.v[i] = multipliedValue;
this._mdf = true;
}
- } else {
- var i = 0;
- var len = this.v.length;
- while (i < len) {
- multipliedValue = val[i] * this.mult;
- if (mathAbs(this.v[i] - multipliedValue) > 0.00001) {
- this.v[i] = multipliedValue;
- this._mdf = true;
- }
- i += 1;
+ i += 1;
+ }
+ }
+}
+
+function processEffectsSequence() {
+ if (this.elem.globalData.frameId === this.frameId || !this.effectsSequence.length) {
+ return;
+ }
+ if (this.lock) {
+ this.setVValue(this.pv);
+ return;
+ }
+ this.lock = true;
+ this._mdf = this._isFirstFrame;
+ var i;
+ var len = this.effectsSequence.length;
+ var finalValue = this.kf ? this.pv : this.data.k;
+ for (i = 0; i < len; i += 1) {
+ finalValue = this.effectsSequence[i](finalValue);
+ }
+ this.setVValue(finalValue);
+ this._isFirstFrame = false;
+ this.lock = false;
+ this.frameId = this.elem.globalData.frameId;
+}
+
+function addEffect(effectFunction) {
+ this.effectsSequence.push(effectFunction);
+ this.container.addDynamicProperty(this);
+}
+
+function ValueProperty(elem, data, mult, container) {
+ this.propType = 'unidimensional';
+ this.mult = mult || 1;
+ this.data = data;
+ this.v = mult ? data.k * mult : data.k;
+ this.pv = data.k;
+ this._mdf = false;
+ this.elem = elem;
+ this.container = container;
+ this.comp = elem.comp;
+ this.k = false;
+ this.kf = false;
+ this.vel = 0;
+ this.effectsSequence = [];
+ this._isFirstFrame = true;
+ this.getValue = processEffectsSequence;
+ this.setVValue = setVValue;
+ this.addEffect = addEffect;
+}
+
+function MultiDimensionalProperty(elem, data, mult, container) {
+ this.propType = 'multidimensional';
+ this.mult = mult || 1;
+ this.data = data;
+ this._mdf = false;
+ this.elem = elem;
+ this.container = container;
+ this.comp = elem.comp;
+ this.k = false;
+ this.kf = false;
+ this.frameId = -1;
+ var i;
+ var len = data.k.length;
+ this.v = createTypedArray('float32', len);
+ this.pv = createTypedArray('float32', len);
+ this.vel = createTypedArray('float32', len);
+ for (i = 0; i < len; i += 1) {
+ this.v[i] = data.k[i] * this.mult;
+ this.pv[i] = data.k[i];
+ }
+ this._isFirstFrame = true;
+ this.effectsSequence = [];
+ this.getValue = processEffectsSequence;
+ this.setVValue = setVValue;
+ this.addEffect = addEffect;
+}
+
+function KeyframedValueProperty(elem, data, mult, container) {
+ this.propType = 'unidimensional';
+ this.keyframes = data.k;
+ this.keyframesMetadata = [];
+ this.offsetTime = elem.data.st;
+ this.frameId = -1;
+ this._caching = {
+ lastFrame: initFrame, lastIndex: 0, value: 0, _lastKeyframeIndex: -1,
+ };
+ this.k = true;
+ this.kf = true;
+ this.data = data;
+ this.mult = mult || 1;
+ this.elem = elem;
+ this.container = container;
+ this.comp = elem.comp;
+ this.v = initFrame;
+ this.pv = initFrame;
+ this._isFirstFrame = true;
+ this.getValue = processEffectsSequence;
+ this.setVValue = setVValue;
+ this.interpolateValue = interpolateValue;
+ this.effectsSequence = [getValueAtCurrentTime.bind(this)];
+ this.addEffect = addEffect;
+}
+
+function KeyframedMultidimensionalProperty(elem, data, mult, container) {
+ this.propType = 'multidimensional';
+ var i;
+ var len = data.k.length;
+ var s;
+ var e;
+ var to;
+ var ti;
+ for (i = 0; i < len - 1; i += 1) {
+ if (data.k[i].to && data.k[i].s && data.k[i + 1] && data.k[i + 1].s) {
+ s = data.k[i].s;
+ e = data.k[i + 1].s;
+ to = data.k[i].to;
+ ti = data.k[i].ti;
+ if ((s.length === 2 && !(s[0] === e[0] && s[1] === e[1]) && bez.pointOnLine2D(s[0], s[1], e[0], e[1], s[0] + to[0], s[1] + to[1]) && bez.pointOnLine2D(s[0], s[1], e[0], e[1], e[0] + ti[0], e[1] + ti[1])) || (s.length === 3 && !(s[0] === e[0] && s[1] === e[1] && s[2] === e[2]) && bez.pointOnLine3D(s[0], s[1], s[2], e[0], e[1], e[2], s[0] + to[0], s[1] + to[1], s[2] + to[2]) && bez.pointOnLine3D(s[0], s[1], s[2], e[0], e[1], e[2], e[0] + ti[0], e[1] + ti[1], e[2] + ti[2]))) {
+ data.k[i].to = null;
+ data.k[i].ti = null;
}
- }
- }
-
- function processEffectsSequence() {
- if (this.elem.globalData.frameId === this.frameId || !this.effectsSequence.length) {
- return;
- }
- if (this.lock) {
- this.setVValue(this.pv);
- return;
- }
- this.lock = true;
- this._mdf = this._isFirstFrame;
- var i;
- var len = this.effectsSequence.length;
- var finalValue = this.kf ? this.pv : this.data.k;
- for (i = 0; i < len; i += 1) {
- finalValue = this.effectsSequence[i](finalValue);
- }
- this.setVValue(finalValue);
- this._isFirstFrame = false;
- this.lock = false;
- this.frameId = this.elem.globalData.frameId;
- }
-
- function addEffect(effectFunction) {
- this.effectsSequence.push(effectFunction);
- this.container.addDynamicProperty(this);
- }
-
- function ValueProperty(elem, data, mult, container) {
- this.propType = 'unidimensional';
- this.mult = mult || 1;
- this.data = data;
- this.v = mult ? data.k * mult : data.k;
- this.pv = data.k;
- this._mdf = false;
- this.elem = elem;
- this.container = container;
- this.comp = elem.comp;
- this.k = false;
- this.kf = false;
- this.vel = 0;
- this.effectsSequence = [];
- this._isFirstFrame = true;
- this.getValue = processEffectsSequence;
- this.setVValue = setVValue;
- this.addEffect = addEffect;
- }
-
- function MultiDimensionalProperty(elem, data, mult, container) {
- this.propType = 'multidimensional';
- this.mult = mult || 1;
- this.data = data;
- this._mdf = false;
- this.elem = elem;
- this.container = container;
- this.comp = elem.comp;
- this.k = false;
- this.kf = false;
- this.frameId = -1;
- var i;
- var len = data.k.length;
- this.v = createTypedArray('float32', len);
- this.pv = createTypedArray('float32', len);
- this.vel = createTypedArray('float32', len);
- for (i = 0; i < len; i += 1) {
- this.v[i] = data.k[i] * this.mult;
- this.pv[i] = data.k[i];
- }
- this._isFirstFrame = true;
- this.effectsSequence = [];
- this.getValue = processEffectsSequence;
- this.setVValue = setVValue;
- this.addEffect = addEffect;
- }
-
- function KeyframedValueProperty(elem, data, mult, container) {
- this.propType = 'unidimensional';
- this.keyframes = data.k;
- this.keyframesMetadata = [];
- this.offsetTime = elem.data.st;
- this.frameId = -1;
- this._caching = {
- lastFrame: initFrame, lastIndex: 0, value: 0, _lastKeyframeIndex: -1,
- };
- this.k = true;
- this.kf = true;
- this.data = data;
- this.mult = mult || 1;
- this.elem = elem;
- this.container = container;
- this.comp = elem.comp;
- this.v = initFrame;
- this.pv = initFrame;
- this._isFirstFrame = true;
- this.getValue = processEffectsSequence;
- this.setVValue = setVValue;
- this.interpolateValue = interpolateValue;
- this.effectsSequence = [getValueAtCurrentTime.bind(this)];
- this.addEffect = addEffect;
- }
-
- function KeyframedMultidimensionalProperty(elem, data, mult, container) {
- this.propType = 'multidimensional';
- var i;
- var len = data.k.length;
- var s;
- var e;
- var to;
- var ti;
- for (i = 0; i < len - 1; i += 1) {
- if (data.k[i].to && data.k[i].s && data.k[i + 1] && data.k[i + 1].s) {
- s = data.k[i].s;
- e = data.k[i + 1].s;
- to = data.k[i].to;
- ti = data.k[i].ti;
- if ((s.length === 2 && !(s[0] === e[0] && s[1] === e[1]) && bez.pointOnLine2D(s[0], s[1], e[0], e[1], s[0] + to[0], s[1] + to[1]) && bez.pointOnLine2D(s[0], s[1], e[0], e[1], e[0] + ti[0], e[1] + ti[1])) || (s.length === 3 && !(s[0] === e[0] && s[1] === e[1] && s[2] === e[2]) && bez.pointOnLine3D(s[0], s[1], s[2], e[0], e[1], e[2], s[0] + to[0], s[1] + to[1], s[2] + to[2]) && bez.pointOnLine3D(s[0], s[1], s[2], e[0], e[1], e[2], e[0] + ti[0], e[1] + ti[1], e[2] + ti[2]))) {
+ if (s[0] === e[0] && s[1] === e[1] && to[0] === 0 && to[1] === 0 && ti[0] === 0 && ti[1] === 0) {
+ if (s.length === 2 || (s[2] === e[2] && to[2] === 0 && ti[2] === 0)) {
data.k[i].to = null;
data.k[i].ti = null;
}
- if (s[0] === e[0] && s[1] === e[1] && to[0] === 0 && to[1] === 0 && ti[0] === 0 && ti[1] === 0) {
- if (s.length === 2 || (s[2] === e[2] && to[2] === 0 && ti[2] === 0)) {
- data.k[i].to = null;
- data.k[i].ti = null;
- }
- }
}
}
- this.effectsSequence = [getValueAtCurrentTime.bind(this)];
- this.data = data;
- this.keyframes = data.k;
- this.keyframesMetadata = [];
- this.offsetTime = elem.data.st;
- this.k = true;
- this.kf = true;
- this._isFirstFrame = true;
- this.mult = mult || 1;
- this.elem = elem;
- this.container = container;
- this.comp = elem.comp;
- this.getValue = processEffectsSequence;
- this.setVValue = setVValue;
- this.interpolateValue = interpolateValue;
- this.frameId = -1;
- var arrLen = data.k[0].s.length;
- this.v = createTypedArray('float32', arrLen);
- this.pv = createTypedArray('float32', arrLen);
- for (i = 0; i < arrLen; i += 1) {
- this.v[i] = initFrame;
- this.pv[i] = initFrame;
- }
- this._caching = { lastFrame: initFrame, lastIndex: 0, value: createTypedArray('float32', arrLen) };
- this.addEffect = addEffect;
}
+ this.effectsSequence = [getValueAtCurrentTime.bind(this)];
+ this.data = data;
+ this.keyframes = data.k;
+ this.keyframesMetadata = [];
+ this.offsetTime = elem.data.st;
+ this.k = true;
+ this.kf = true;
+ this._isFirstFrame = true;
+ this.mult = mult || 1;
+ this.elem = elem;
+ this.container = container;
+ this.comp = elem.comp;
+ this.getValue = processEffectsSequence;
+ this.setVValue = setVValue;
+ this.interpolateValue = interpolateValue;
+ this.frameId = -1;
+ var arrLen = data.k[0].s.length;
+ this.v = createTypedArray('float32', arrLen);
+ this.pv = createTypedArray('float32', arrLen);
+ for (i = 0; i < arrLen; i += 1) {
+ this.v[i] = initFrame;
+ this.pv[i] = initFrame;
+ }
+ this._caching = { lastFrame: initFrame, lastIndex: 0, value: createTypedArray('float32', arrLen) };
+ this.addEffect = addEffect;
+}
+const PropertyFactory = (function () {
function getProp(elem, data, type, mult, container) {
+ if (data.sid) {
+ data = elem.globalData.slotManager.getProp(data);
+ }
var p;
if (!data.k.length) {
p = new ValueProperty(elem, data, mult, container);
diff --git a/player/js/utils/SlotManager.js b/player/js/utils/SlotManager.js
new file mode 100644
index 0000000..27b258a
--- /dev/null
+++ b/player/js/utils/SlotManager.js
@@ -0,0 +1,17 @@
+function SlotManager(animationData) {
+ this.animationData = animationData;
+}
+SlotManager.prototype.getProp = function (data) {
+ if (this.animationData.slots
+ && this.animationData.slots[data.sid]
+ ) {
+ return Object.assign(data, this.animationData.slots[data.sid].p);
+ }
+ return data;
+};
+
+function slotFactory(animationData) {
+ return new SlotManager(animationData);
+}
+
+export default slotFactory;
diff --git a/player/js/utils/text/TextProperty.js b/player/js/utils/text/TextProperty.js
index 2f088ff..1fb3080 100644
--- a/player/js/utils/text/TextProperty.js
+++ b/player/js/utils/text/TextProperty.js
@@ -11,6 +11,9 @@
this.kf = false;
this._isFirstFrame = true;
this._mdf = false;
+ if (data.d && data.d.sid) {
+ data.d = elem.globalData.slotManager.getProp(data.d);
+ }
this.data = data;
this.elem = elem;
this.comp = this.elem.comp;