Merge branch 'master' of github.com:airbnb/lottie-web
diff --git a/player/js/elements/svgElements/SVGTextElement.js b/player/js/elements/svgElements/SVGTextElement.js
index e580b02..eceafc9 100644
--- a/player/js/elements/svgElements/SVGTextElement.js
+++ b/player/js/elements/svgElements/SVGTextElement.js
@@ -184,6 +184,11 @@
}
glyphElement = new SVGShapeElement(data, this.globalData, this);
}
+ if (this.textSpans[i].glyph) {
+ var glyph = this.textSpans[i].glyph;
+ this.textSpans[i].childSpan.removeChild(glyph.layerElement);
+ glyph.destroy();
+ }
this.textSpans[i].glyph = glyphElement;
glyphElement._debug = true;
glyphElement.prepareFrame(0);
diff --git a/player/js/module_worker.js b/player/js/module_worker.js
index 08fcf46..fc4faa9 100644
--- a/player/js/module_worker.js
+++ b/player/js/module_worker.js
@@ -10,7 +10,7 @@
var localIdCounter = 0;
var animations = {};
- var styleProperties = ['width', 'height', 'display', 'transform', 'opacity', 'contentVisibility'];
+ var styleProperties = ['width', 'height', 'display', 'transform', 'opacity', 'contentVisibility', 'mix-blend-mode'];
function createElement(namespace, type) {
var style = {
serialize: function () {
@@ -348,6 +348,10 @@
if (animations[payload.id]) {
animations[payload.id].resize();
}
+ } else if (type === 'playSegments') {
+ if (animations[payload.id]) {
+ animations[payload.id].playSegments(payload.arr, payload.forceFlag);
+ }
}
};
}
@@ -594,6 +598,16 @@
},
});
},
+ playSegments: function (arr, forceFlag) {
+ workerInstance.postMessage({
+ type: 'playSegments',
+ payload: {
+ id: animationId,
+ arr: arr,
+ forceFlag: forceFlag,
+ },
+ });
+ },
setSubframe: function (value) {
workerInstance.postMessage({
type: 'setSubframe',
diff --git a/player/js/renderers/SVGRenderer.js b/player/js/renderers/SVGRenderer.js
index 35d614c..20df797 100644
--- a/player/js/renderers/SVGRenderer.js
+++ b/player/js/renderers/SVGRenderer.js
@@ -56,6 +56,8 @@
x: (config && config.filterSize && config.filterSize.x) || '0%',
y: (config && config.filterSize && config.filterSize.y) || '0%',
},
+ width: (config && config.width),
+ height: (config && config.height),
};
this.globalData = {
diff --git a/player/js/renderers/SVGRendererBase.js b/player/js/renderers/SVGRendererBase.js
index 4e0f82f..0768cf7 100644
--- a/player/js/renderers/SVGRendererBase.js
+++ b/player/js/renderers/SVGRendererBase.js
@@ -58,6 +58,12 @@
this.svgElement.style.transform = 'translate3d(0,0,0)';
this.svgElement.style.contentVisibility = this.renderConfig.contentVisibility;
}
+ if (this.renderConfig.width) {
+ this.svgElement.setAttribute('width', this.renderConfig.width);
+ }
+ if (this.renderConfig.height) {
+ this.svgElement.setAttribute('height', this.renderConfig.height);
+ }
if (this.renderConfig.className) {
this.svgElement.setAttribute('class', this.renderConfig.className);
}
diff --git a/player/js/utils/expressions/ExpressionManager.js b/player/js/utils/expressions/ExpressionManager.js
index 1198523..4f0b264 100644
--- a/player/js/utils/expressions/ExpressionManager.js
+++ b/player/js/utils/expressions/ExpressionManager.js
@@ -727,7 +727,7 @@
return scoped_bm_rt;
}
// Bundlers will see these as dead code and unless we reference them
- executeExpression.__preventDeadCodeRemoval = [$bm_transform, anchorPoint, velocity, inPoint, outPoint, width, height, name, loop_in, loop_out, smooth, toComp, fromCompToSurface, toWorld, fromWorld, mask, position, rotation, scale, thisComp, numKeys, active, wiggle, loopInDuration, loopOutDuration, comp, lookAt, easeOut, easeIn, ease, nearestKey, key, text, textIndex, textTotal, selectorValue, framesToTime, timeToFrames, sourceRectAtTime, substring, substr, posterizeTime, index, globalData];
+ executeExpression.__preventDeadCodeRemoval = [$bm_transform, anchorPoint, time, velocity, inPoint, outPoint, width, height, name, loop_in, loop_out, smooth, toComp, fromCompToSurface, toWorld, fromWorld, mask, position, rotation, scale, thisComp, numKeys, active, wiggle, loopInDuration, loopOutDuration, comp, lookAt, easeOut, easeIn, ease, nearestKey, key, text, textIndex, textTotal, selectorValue, framesToTime, timeToFrames, sourceRectAtTime, substring, substr, posterizeTime, index, globalData];
return executeExpression;
}
diff --git a/player/js/worker_wrapper.js b/player/js/worker_wrapper.js
index 598289b..52559ee 100644
--- a/player/js/worker_wrapper.js
+++ b/player/js/worker_wrapper.js
@@ -2,7 +2,7 @@
var localIdCounter = 0;
var animations = {};
- var styleProperties = ['width', 'height', 'display', 'transform', 'opacity', 'contentVisibility'];
+ var styleProperties = ['width', 'height', 'display', 'transform', 'opacity', 'contentVisibility', 'mix-blend-mode'];
function createElement(namespace, type) {
var style = {
serialize: function () {
@@ -295,6 +295,10 @@
if (animations[payload.id]) {
animations[payload.id].resize();
}
+ } else if (type === 'playSegments') {
+ if (animations[payload.id]) {
+ animations[payload.id].playSegments(payload.arr, payload.forceFlag);
+ }
}
};
}
@@ -541,6 +545,16 @@
},
});
},
+ playSegments: function (arr, forceFlag) {
+ workerInstance.postMessage({
+ type: 'playSegments',
+ payload: {
+ id: animationId,
+ arr: arr,
+ forceFlag: forceFlag,
+ },
+ });
+ },
setSubframe: function (value) {
workerInstance.postMessage({
type: 'setSubframe',
