feat: 第一次上传代码

node_modules/lottie-web/player/js/elements/svgElements/SVGBaseElement.js

@@ -0,0 +1,181 @@
+import { getLocationHref } from '../../main';
+import {
+  createElementID,
+} from '../../utils/common';
+import createNS from '../../utils/helpers/svg_elements';
+import MaskElement from '../../mask';
+import filtersFactory from '../../utils/filters';
+import featureSupport from '../../utils/featureSupport';
+import SVGEffects from './SVGEffects';
+
+function SVGBaseElement() {
+}
+
+SVGBaseElement.prototype = {
+  initRendererElement: function () {
+    this.layerElement = createNS('g');
+  },
+  createContainerElements: function () {
+    this.matteElement = createNS('g');
+    this.transformedElement = this.layerElement;
+    this.maskedElement = this.layerElement;
+    this._sizeChanged = false;
+    var layerElementParent = null;
+    // If this layer acts as a mask for the following layer
+    if (this.data.td) {
+      this.matteMasks = {};
+      var gg = createNS('g');
+      gg.setAttribute('id', this.layerId);
+      gg.appendChild(this.layerElement);
+      layerElementParent = gg;
+      this.globalData.defs.appendChild(gg);
+    } else if (this.data.tt) {
+      this.matteElement.appendChild(this.layerElement);
+      layerElementParent = this.matteElement;
+      this.baseElement = this.matteElement;
+    } else {
+      this.baseElement = this.layerElement;
+    }
+    if (this.data.ln) {
+      this.layerElement.setAttribute('id', this.data.ln);
+    }
+    if (this.data.cl) {
+      this.layerElement.setAttribute('class', this.data.cl);
+    }
+    // Clipping compositions to hide content that exceeds boundaries. If collapsed transformations is on, component should not be clipped
+    if (this.data.ty === 0 && !this.data.hd) {
+      var cp = createNS('clipPath');
+      var pt = createNS('path');
+      pt.setAttribute('d', 'M0,0 L' + this.data.w + ',0 L' + this.data.w + ',' + this.data.h + ' L0,' + this.data.h + 'z');
+      var clipId = createElementID();
+      cp.setAttribute('id', clipId);
+      cp.appendChild(pt);
+      this.globalData.defs.appendChild(cp);
+
+      if (this.checkMasks()) {
+        var cpGroup = createNS('g');
+        cpGroup.setAttribute('clip-path', 'url(' + getLocationHref() + '#' + clipId + ')');
+        cpGroup.appendChild(this.layerElement);
+        this.transformedElement = cpGroup;
+        if (layerElementParent) {
+          layerElementParent.appendChild(this.transformedElement);
+        } else {
+          this.baseElement = this.transformedElement;
+        }
+      } else {
+        this.layerElement.setAttribute('clip-path', 'url(' + getLocationHref() + '#' + clipId + ')');
+      }
+    }
+    if (this.data.bm !== 0) {
+      this.setBlendMode();
+    }
+  },
+  renderElement: function () {
+    if (this.finalTransform._localMatMdf) {
+      this.transformedElement.setAttribute('transform', this.finalTransform.localMat.to2dCSS());
+    }
+    if (this.finalTransform._opMdf) {
+      this.transformedElement.setAttribute('opacity', this.finalTransform.localOpacity);
+    }
+  },
+  destroyBaseElement: function () {
+    this.layerElement = null;
+    this.matteElement = null;
+    this.maskManager.destroy();
+  },
+  getBaseElement: function () {
+    if (this.data.hd) {
+      return null;
+    }
+    return this.baseElement;
+  },
+  createRenderableComponents: function () {
+    this.maskManager = new MaskElement(this.data, this, this.globalData);
+    this.renderableEffectsManager = new SVGEffects(this);
+    this.searchEffectTransforms();
+  },
+  getMatte: function (matteType) {
+    // This should not be a common case. But for backward compatibility, we'll create the matte object.
+    // It solves animations that have two consecutive layers marked as matte masks.
+    // Which is an undefined behavior in AE.
+    if (!this.matteMasks) {
+      this.matteMasks = {};
+    }
+    if (!this.matteMasks[matteType]) {
+      var id = this.layerId + '_' + matteType;
+      var filId;
+      var fil;
+      var useElement;
+      var gg;
+      if (matteType === 1 || matteType === 3) {
+        var masker = createNS('mask');
+        masker.setAttribute('id', id);
+        masker.setAttribute('mask-type', matteType === 3 ? 'luminance' : 'alpha');
+        useElement = createNS('use');
+        useElement.setAttributeNS('http://www.w3.org/1999/xlink', 'href', '#' + this.layerId);
+        masker.appendChild(useElement);
+        this.globalData.defs.appendChild(masker);
+        if (!featureSupport.maskType && matteType === 1) {
+          masker.setAttribute('mask-type', 'luminance');
+          filId = createElementID();
+          fil = filtersFactory.createFilter(filId);
+          this.globalData.defs.appendChild(fil);
+          fil.appendChild(filtersFactory.createAlphaToLuminanceFilter());
+          gg = createNS('g');
+          gg.appendChild(useElement);
+          masker.appendChild(gg);
+          gg.setAttribute('filter', 'url(' + getLocationHref() + '#' + filId + ')');
+        }
+      } else if (matteType === 2) {
+        var maskGroup = createNS('mask');
+        maskGroup.setAttribute('id', id);
+        maskGroup.setAttribute('mask-type', 'alpha');
+        var maskGrouper = createNS('g');
+        maskGroup.appendChild(maskGrouper);
+        filId = createElementID();
+        fil = filtersFactory.createFilter(filId);
+        /// /
+        var feCTr = createNS('feComponentTransfer');
+        feCTr.setAttribute('in', 'SourceGraphic');
+        fil.appendChild(feCTr);
+        var feFunc = createNS('feFuncA');
+        feFunc.setAttribute('type', 'table');
+        feFunc.setAttribute('tableValues', '1.0 0.0');
+        feCTr.appendChild(feFunc);
+        /// /
+        this.globalData.defs.appendChild(fil);
+        var alphaRect = createNS('rect');
+        alphaRect.setAttribute('width', this.comp.data.w);
+        alphaRect.setAttribute('height', this.comp.data.h);
+        alphaRect.setAttribute('x', '0');
+        alphaRect.setAttribute('y', '0');
+        alphaRect.setAttribute('fill', '#ffffff');
+        alphaRect.setAttribute('opacity', '0');
+        maskGrouper.setAttribute('filter', 'url(' + getLocationHref() + '#' + filId + ')');
+        maskGrouper.appendChild(alphaRect);
+        useElement = createNS('use');
+        useElement.setAttributeNS('http://www.w3.org/1999/xlink', 'href', '#' + this.layerId);
+        maskGrouper.appendChild(useElement);
+        if (!featureSupport.maskType) {
+          maskGroup.setAttribute('mask-type', 'luminance');
+          fil.appendChild(filtersFactory.createAlphaToLuminanceFilter());
+          gg = createNS('g');
+          maskGrouper.appendChild(alphaRect);
+          gg.appendChild(this.layerElement);
+          maskGrouper.appendChild(gg);
+        }
+        this.globalData.defs.appendChild(maskGroup);
+      }
+      this.matteMasks[matteType] = id;
+    }
+    return this.matteMasks[matteType];
+  },
+  setMatte: function (id) {
+    if (!this.matteElement) {
+      return;
+    }
+    this.matteElement.setAttribute('mask', 'url(' + getLocationHref() + '#' + id + ')');
+  },
+};
+
+export default SVGBaseElement;

node_modules/lottie-web/player/js/elements/svgElements/SVGCompElement.js

@@ -0,0 +1,28 @@
+import {
+  extendPrototype,
+} from '../../utils/functionExtensions';
+import {
+  createSizedArray,
+} from '../../utils/helpers/arrays';
+import PropertyFactory from '../../utils/PropertyFactory';
+import SVGRendererBase from '../../renderers/SVGRendererBase'; // eslint-disable-line
+import SVGBaseElement from './SVGBaseElement';
+import ICompElement from '../CompElement';
+
+function SVGCompElement(data, globalData, comp) {
+  this.layers = data.layers;
+  this.supports3d = true;
+  this.completeLayers = false;
+  this.pendingElements = [];
+  this.elements = this.layers ? createSizedArray(this.layers.length) : [];
+  this.initElement(data, globalData, comp);
+  this.tm = data.tm ? PropertyFactory.getProp(this, data.tm, 0, globalData.frameRate, this) : { _placeholder: true };
+}
+
+extendPrototype([SVGRendererBase, ICompElement, SVGBaseElement], SVGCompElement);
+
+SVGCompElement.prototype.createComp = function (data) {
+  return new SVGCompElement(data, this.globalData, this);
+};
+
+export default SVGCompElement;

node_modules/lottie-web/player/js/elements/svgElements/SVGEffects.js

@@ -0,0 +1,70 @@
+import { getLocationHref } from '../../main';
+import {
+  createElementID,
+} from '../../utils/common';
+import filtersFactory from '../../utils/filters';
+
+var registeredEffects = {};
+var idPrefix = 'filter_result_';
+
+function SVGEffects(elem) {
+  var i;
+  var source = 'SourceGraphic';
+  var len = elem.data.ef ? elem.data.ef.length : 0;
+  var filId = createElementID();
+  var fil = filtersFactory.createFilter(filId, true);
+  var count = 0;
+  this.filters = [];
+  var filterManager;
+  for (i = 0; i < len; i += 1) {
+    filterManager = null;
+    var type = elem.data.ef[i].ty;
+    if (registeredEffects[type]) {
+      var Effect = registeredEffects[type].effect;
+      filterManager = new Effect(fil, elem.effectsManager.effectElements[i], elem, idPrefix + count, source);
+      source = idPrefix + count;
+      if (registeredEffects[type].countsAsEffect) {
+        count += 1;
+      }
+    }
+    if (filterManager) {
+      this.filters.push(filterManager);
+    }
+  }
+  if (count) {
+    elem.globalData.defs.appendChild(fil);
+    elem.layerElement.setAttribute('filter', 'url(' + getLocationHref() + '#' + filId + ')');
+  }
+  if (this.filters.length) {
+    elem.addRenderableComponent(this);
+  }
+}
+
+SVGEffects.prototype.renderFrame = function (_isFirstFrame) {
+  var i;
+  var len = this.filters.length;
+  for (i = 0; i < len; i += 1) {
+    this.filters[i].renderFrame(_isFirstFrame);
+  }
+};
+
+SVGEffects.prototype.getEffects = function (type) {
+  var i;
+  var len = this.filters.length;
+  var effects = [];
+  for (i = 0; i < len; i += 1) {
+    if (this.filters[i].type === type) {
+      effects.push(this.filters[i]);
+    }
+  }
+  return effects;
+};
+
+export function registerEffect(id, effect, countsAsEffect) {
+  registeredEffects[id] = {
+    effect,
+    countsAsEffect,
+  };
+}
+
+export default SVGEffects;

node_modules/lottie-web/player/js/elements/svgElements/SVGEffectsPlaceholder.js

@@ -0,0 +1,3 @@
+function SVGEffects() {}
+
+export default SVGEffects;

node_modules/lottie-web/player/js/elements/svgElements/SVGShapeElement.js

@@ -0,0 +1,366 @@
+import {
+  extendPrototype,
+} from '../../utils/functionExtensions';
+import { getLocationHref } from '../../main';
+import ShapePropertyFactory from '../../utils/shapes/ShapeProperty';
+import BaseElement from '../BaseElement';
+import TransformElement from '../helpers/TransformElement';
+import SVGBaseElement from './SVGBaseElement';
+import HierarchyElement from '../helpers/HierarchyElement';
+import FrameElement from '../helpers/FrameElement';
+import RenderableDOMElement from '../helpers/RenderableDOMElement';
+import getBlendMode from '../../utils/helpers/blendModes';
+import Matrix from '../../3rd_party/transformation-matrix';
+import IShapeElement from '../ShapeElement';
+import TransformPropertyFactory from '../../utils/TransformProperty';
+import { ShapeModifiers } from '../../utils/shapes/ShapeModifiers';
+import {
+  lineCapEnum,
+  lineJoinEnum,
+} from '../../utils/helpers/shapeEnums';
+import SVGShapeData from '../helpers/shapes/SVGShapeData';
+import SVGStyleData from '../helpers/shapes/SVGStyleData';
+import SVGStrokeStyleData from '../helpers/shapes/SVGStrokeStyleData';
+import SVGFillStyleData from '../helpers/shapes/SVGFillStyleData';
+import SVGNoStyleData from '../helpers/shapes/SVGNoStyleData';
+import SVGGradientFillStyleData from '../helpers/shapes/SVGGradientFillStyleData';
+import SVGGradientStrokeStyleData from '../helpers/shapes/SVGGradientStrokeStyleData';
+import ShapeGroupData from '../helpers/shapes/ShapeGroupData';
+import SVGTransformData from '../helpers/shapes/SVGTransformData';
+import SVGElementsRenderer from '../helpers/shapes/SVGElementsRenderer';
+
+function SVGShapeElement(data, globalData, comp) {
+  // List of drawable elements
+  this.shapes = [];
+  // Full shape data
+  this.shapesData = data.shapes;
+  // List of styles that will be applied to shapes
+  this.stylesList = [];
+  // List of modifiers that will be applied to shapes
+  this.shapeModifiers = [];
+  // List of items in shape tree
+  this.itemsData = [];
+  // List of items in previous shape tree
+  this.processedElements = [];
+  // List of animated components
+  this.animatedContents = [];
+  this.initElement(data, globalData, comp);
+  // Moving any property that doesn't get too much access after initialization because of v8 way of handling more than 10 properties.
+  // List of elements that have been created
+  this.prevViewData = [];
+  // Moving any property that doesn't get too much access after initialization because of v8 way of handling more than 10 properties.
+}
+
+extendPrototype([BaseElement, TransformElement, SVGBaseElement, IShapeElement, HierarchyElement, FrameElement, RenderableDOMElement], SVGShapeElement);
+
+SVGShapeElement.prototype.initSecondaryElement = function () {
+};
+
+SVGShapeElement.prototype.identityMatrix = new Matrix();
+
+SVGShapeElement.prototype.buildExpressionInterface = function () {};
+
+SVGShapeElement.prototype.createContent = function () {
+  this.searchShapes(this.shapesData, this.itemsData, this.prevViewData, this.layerElement, 0, [], true);
+  this.filterUniqueShapes();
+};
+
+/*
+This method searches for multiple shapes that affect a single element and one of them is animated
+*/
+SVGShapeElement.prototype.filterUniqueShapes = function () {
+  var i;
+  var len = this.shapes.length;
+  var shape;
+  var j;
+  var jLen = this.stylesList.length;
+  var style;
+  var tempShapes = [];
+  var areAnimated = false;
+  for (j = 0; j < jLen; j += 1) {
+    style = this.stylesList[j];
+    areAnimated = false;
+    tempShapes.length = 0;
+    for (i = 0; i < len; i += 1) {
+      shape = this.shapes[i];
+      if (shape.styles.indexOf(style) !== -1) {
+        tempShapes.push(shape);
+        areAnimated = shape._isAnimated || areAnimated;
+      }
+    }
+    if (tempShapes.length > 1 && areAnimated) {
+      this.setShapesAsAnimated(tempShapes);
+    }
+  }
+};
+
+SVGShapeElement.prototype.setShapesAsAnimated = function (shapes) {
+  var i;
+  var len = shapes.length;
+  for (i = 0; i < len; i += 1) {
+    shapes[i].setAsAnimated();
+  }
+};
+
+SVGShapeElement.prototype.createStyleElement = function (data, level) {
+  // TODO: prevent drawing of hidden styles
+  var elementData;
+  var styleOb = new SVGStyleData(data, level);
+
+  var pathElement = styleOb.pElem;
+  if (data.ty === 'st') {
+    elementData = new SVGStrokeStyleData(this, data, styleOb);
+  } else if (data.ty === 'fl') {
+    elementData = new SVGFillStyleData(this, data, styleOb);
+  } else if (data.ty === 'gf' || data.ty === 'gs') {
+    var GradientConstructor = data.ty === 'gf' ? SVGGradientFillStyleData : SVGGradientStrokeStyleData;
+    elementData = new GradientConstructor(this, data, styleOb);
+    this.globalData.defs.appendChild(elementData.gf);
+    if (elementData.maskId) {
+      this.globalData.defs.appendChild(elementData.ms);
+      this.globalData.defs.appendChild(elementData.of);
+      pathElement.setAttribute('mask', 'url(' + getLocationHref() + '#' + elementData.maskId + ')');
+    }
+  } else if (data.ty === 'no') {
+    elementData = new SVGNoStyleData(this, data, styleOb);
+  }
+
+  if (data.ty === 'st' || data.ty === 'gs') {
+    pathElement.setAttribute('stroke-linecap', lineCapEnum[data.lc || 2]);
+    pathElement.setAttribute('stroke-linejoin', lineJoinEnum[data.lj || 2]);
+    pathElement.setAttribute('fill-opacity', '0');
+    if (data.lj === 1) {
+      pathElement.setAttribute('stroke-miterlimit', data.ml);
+    }
+  }
+
+  if (data.r === 2) {
+    pathElement.setAttribute('fill-rule', 'evenodd');
+  }
+
+  if (data.ln) {
+    pathElement.setAttribute('id', data.ln);
+  }
+  if (data.cl) {
+    pathElement.setAttribute('class', data.cl);
+  }
+  if (data.bm) {
+    pathElement.style['mix-blend-mode'] = getBlendMode(data.bm);
+  }
+  this.stylesList.push(styleOb);
+  this.addToAnimatedContents(data, elementData);
+  return elementData;
+};
+
+SVGShapeElement.prototype.createGroupElement = function (data) {
+  var elementData = new ShapeGroupData();
+  if (data.ln) {
+    elementData.gr.setAttribute('id', data.ln);
+  }
+  if (data.cl) {
+    elementData.gr.setAttribute('class', data.cl);
+  }
+  if (data.bm) {
+    elementData.gr.style['mix-blend-mode'] = getBlendMode(data.bm);
+  }
+  return elementData;
+};
+
+SVGShapeElement.prototype.createTransformElement = function (data, container) {
+  var transformProperty = TransformPropertyFactory.getTransformProperty(this, data, this);
+  var elementData = new SVGTransformData(transformProperty, transformProperty.o, container);
+  this.addToAnimatedContents(data, elementData);
+  return elementData;
+};
+
+SVGShapeElement.prototype.createShapeElement = function (data, ownTransformers, level) {
+  var ty = 4;
+  if (data.ty === 'rc') {
+    ty = 5;
+  } else if (data.ty === 'el') {
+    ty = 6;
+  } else if (data.ty === 'sr') {
+    ty = 7;
+  }
+  var shapeProperty = ShapePropertyFactory.getShapeProp(this, data, ty, this);
+  var elementData = new SVGShapeData(ownTransformers, level, shapeProperty);
+  this.shapes.push(elementData);
+  this.addShapeToModifiers(elementData);
+  this.addToAnimatedContents(data, elementData);
+  return elementData;
+};
+
+SVGShapeElement.prototype.addToAnimatedContents = function (data, element) {
+  var i = 0;
+  var len = this.animatedContents.length;
+  while (i < len) {
+    if (this.animatedContents[i].element === element) {
+      return;
+    }
+    i += 1;
+  }
+  this.animatedContents.push({
+    fn: SVGElementsRenderer.createRenderFunction(data),
+    element: element,
+    data: data,
+  });
+};
+
+SVGShapeElement.prototype.setElementStyles = function (elementData) {
+  var arr = elementData.styles;
+  var j;
+  var jLen = this.stylesList.length;
+  for (j = 0; j < jLen; j += 1) {
+    if (arr.indexOf(this.stylesList[j]) === -1 && !this.stylesList[j].closed) {
+      arr.push(this.stylesList[j]);
+    }
+  }
+};
+
+SVGShapeElement.prototype.reloadShapes = function () {
+  this._isFirstFrame = true;
+  var i;
+  var len = this.itemsData.length;
+  for (i = 0; i < len; i += 1) {
+    this.prevViewData[i] = this.itemsData[i];
+  }
+  this.searchShapes(this.shapesData, this.itemsData, this.prevViewData, this.layerElement, 0, [], true);
+  this.filterUniqueShapes();
+  len = this.dynamicProperties.length;
+  for (i = 0; i < len; i += 1) {
+    this.dynamicProperties[i].getValue();
+  }
+  this.renderModifiers();
+};
+
+SVGShapeElement.prototype.searchShapes = function (arr, itemsData, prevViewData, container, level, transformers, render) {
+  var ownTransformers = [].concat(transformers);
+  var i;
+  var len = arr.length - 1;
+  var j;
+  var jLen;
+  var ownStyles = [];
+  var ownModifiers = [];
+  var currentTransform;
+  var modifier;
+  var processedPos;
+  for (i = len; i >= 0; i -= 1) {
+    processedPos = this.searchProcessedElement(arr[i]);
+    if (!processedPos) {
+      arr[i]._render = render;
+    } else {
+      itemsData[i] = prevViewData[processedPos - 1];
+    }
+    if (arr[i].ty === 'fl' || arr[i].ty === 'st' || arr[i].ty === 'gf' || arr[i].ty === 'gs' || arr[i].ty === 'no') {
+      if (!processedPos) {
+        itemsData[i] = this.createStyleElement(arr[i], level);
+      } else {
+        itemsData[i].style.closed = arr[i].hd;
+      }
+      if (arr[i]._render) {
+        if (itemsData[i].style.pElem.parentNode !== container) {
+          container.appendChild(itemsData[i].style.pElem);
+        }
+      }
+      ownStyles.push(itemsData[i].style);
+    } else if (arr[i].ty === 'gr') {
+      if (!processedPos) {
+        itemsData[i] = this.createGroupElement(arr[i]);
+      } else {
+        jLen = itemsData[i].it.length;
+        for (j = 0; j < jLen; j += 1) {
+          itemsData[i].prevViewData[j] = itemsData[i].it[j];
+        }
+      }
+      this.searchShapes(arr[i].it, itemsData[i].it, itemsData[i].prevViewData, itemsData[i].gr, level + 1, ownTransformers, render);
+      if (arr[i]._render) {
+        if (itemsData[i].gr.parentNode !== container) {
+          container.appendChild(itemsData[i].gr);
+        }
+      }
+    } else if (arr[i].ty === 'tr') {
+      if (!processedPos) {
+        itemsData[i] = this.createTransformElement(arr[i], container);
+      }
+      currentTransform = itemsData[i].transform;
+      ownTransformers.push(currentTransform);
+    } else if (arr[i].ty === 'sh' || arr[i].ty === 'rc' || arr[i].ty === 'el' || arr[i].ty === 'sr') {
+      if (!processedPos) {
+        itemsData[i] = this.createShapeElement(arr[i], ownTransformers, level);
+      }
+      this.setElementStyles(itemsData[i]);
+    } else if (arr[i].ty === 'tm' || arr[i].ty === 'rd' || arr[i].ty === 'ms' || arr[i].ty === 'pb' || arr[i].ty === 'zz' || arr[i].ty === 'op') {
+      if (!processedPos) {
+        modifier = ShapeModifiers.getModifier(arr[i].ty);
+        modifier.init(this, arr[i]);
+        itemsData[i] = modifier;
+        this.shapeModifiers.push(modifier);
+      } else {
+        modifier = itemsData[i];
+        modifier.closed = false;
+      }
+      ownModifiers.push(modifier);
+    } else if (arr[i].ty === 'rp') {
+      if (!processedPos) {
+        modifier = ShapeModifiers.getModifier(arr[i].ty);
+        itemsData[i] = modifier;
+        modifier.init(this, arr, i, itemsData);
+        this.shapeModifiers.push(modifier);
+        render = false;
+      } else {
+        modifier = itemsData[i];
+        modifier.closed = true;
+      }
+      ownModifiers.push(modifier);
+    }
+    this.addProcessedElement(arr[i], i + 1);
+  }
+  len = ownStyles.length;
+  for (i = 0; i < len; i += 1) {
+    ownStyles[i].closed = true;
+  }
+  len = ownModifiers.length;
+  for (i = 0; i < len; i += 1) {
+    ownModifiers[i].closed = true;
+  }
+};
+
+SVGShapeElement.prototype.renderInnerContent = function () {
+  this.renderModifiers();
+  var i;
+  var len = this.stylesList.length;
+  for (i = 0; i < len; i += 1) {
+    this.stylesList[i].reset();
+  }
+  this.renderShape();
+  for (i = 0; i < len; i += 1) {
+    if (this.stylesList[i]._mdf || this._isFirstFrame) {
+      if (this.stylesList[i].msElem) {
+        this.stylesList[i].msElem.setAttribute('d', this.stylesList[i].d);
+        // Adding M0 0 fixes same mask bug on all browsers
+        this.stylesList[i].d = 'M0 0' + this.stylesList[i].d;
+      }
+      this.stylesList[i].pElem.setAttribute('d', this.stylesList[i].d || 'M0 0');
+    }
+  }
+};
+
+SVGShapeElement.prototype.renderShape = function () {
+  var i;
+  var len = this.animatedContents.length;
+  var animatedContent;
+  for (i = 0; i < len; i += 1) {
+    animatedContent = this.animatedContents[i];
+    if ((this._isFirstFrame || animatedContent.element._isAnimated) && animatedContent.data !== true) {
+      animatedContent.fn(animatedContent.data, animatedContent.element, this._isFirstFrame);
+    }
+  }
+};
+
+SVGShapeElement.prototype.destroy = function () {
+  this.destroyBaseElement();
+  this.shapesData = null;
+  this.itemsData = null;
+};
+
+export default SVGShapeElement;

node_modules/lottie-web/player/js/elements/svgElements/SVGTextElement.js

@@ -0,0 +1,322 @@
+import {
+  extendPrototype,
+} from '../../utils/functionExtensions';
+import {
+  createSizedArray,
+} from '../../utils/helpers/arrays';
+import createNS from '../../utils/helpers/svg_elements';
+import BaseElement from '../BaseElement';
+import TransformElement from '../helpers/TransformElement';
+import SVGBaseElement from './SVGBaseElement';
+import HierarchyElement from '../helpers/HierarchyElement';
+import FrameElement from '../helpers/FrameElement';
+import RenderableDOMElement from '../helpers/RenderableDOMElement';
+import ITextElement from '../TextElement';
+import SVGCompElement from './SVGCompElement'; // eslint-disable-line
+import SVGShapeElement from './SVGShapeElement';
+
+var emptyShapeData = {
+  shapes: [],
+};
+
+function SVGTextLottieElement(data, globalData, comp) {
+  this.textSpans = [];
+  this.renderType = 'svg';
+  this.initElement(data, globalData, comp);
+}
+
+extendPrototype([BaseElement, TransformElement, SVGBaseElement, HierarchyElement, FrameElement, RenderableDOMElement, ITextElement], SVGTextLottieElement);
+
+SVGTextLottieElement.prototype.createContent = function () {
+  if (this.data.singleShape && !this.globalData.fontManager.chars) {
+    this.textContainer = createNS('text');
+  }
+};
+
+SVGTextLottieElement.prototype.buildTextContents = function (textArray) {
+  var i = 0;
+  var len = textArray.length;
+  var textContents = [];
+  var currentTextContent = '';
+  while (i < len) {
+    if (textArray[i] === String.fromCharCode(13) || textArray[i] === String.fromCharCode(3)) {
+      textContents.push(currentTextContent);
+      currentTextContent = '';
+    } else {
+      currentTextContent += textArray[i];
+    }
+    i += 1;
+  }
+  textContents.push(currentTextContent);
+  return textContents;
+};
+
+SVGTextLottieElement.prototype.buildShapeData = function (data, scale) {
+  // data should probably be cloned to apply scale separately to each instance of a text on different layers
+  // but since text internal content gets only rendered once and then it's never rerendered,
+  // it's probably safe not to clone data and reuse always the same instance even if the object is mutated.
+  // Avoiding cloning is preferred since cloning each character shape data is expensive
+  if (data.shapes && data.shapes.length) {
+    var shape = data.shapes[0];
+    if (shape.it) {
+      var shapeItem = shape.it[shape.it.length - 1];
+      if (shapeItem.s) {
+        shapeItem.s.k[0] = scale;
+        shapeItem.s.k[1] = scale;
+      }
+    }
+  }
+  return data;
+};
+
+SVGTextLottieElement.prototype.buildNewText = function () {
+  this.addDynamicProperty(this);
+  var i;
+  var len;
+
+  var documentData = this.textProperty.currentData;
+  this.renderedLetters = createSizedArray(documentData ? documentData.l.length : 0);
+  if (documentData.fc) {
+    this.layerElement.setAttribute('fill', this.buildColor(documentData.fc));
+  } else {
+    this.layerElement.setAttribute('fill', 'rgba(0,0,0,0)');
+  }
+  if (documentData.sc) {
+    this.layerElement.setAttribute('stroke', this.buildColor(documentData.sc));
+    this.layerElement.setAttribute('stroke-width', documentData.sw);
+  }
+  this.layerElement.setAttribute('font-size', documentData.finalSize);
+  var fontData = this.globalData.fontManager.getFontByName(documentData.f);
+  if (fontData.fClass) {
+    this.layerElement.setAttribute('class', fontData.fClass);
+  } else {
+    this.layerElement.setAttribute('font-family', fontData.fFamily);
+    var fWeight = documentData.fWeight;
+    var fStyle = documentData.fStyle;
+    this.layerElement.setAttribute('font-style', fStyle);
+    this.layerElement.setAttribute('font-weight', fWeight);
+  }
+  this.layerElement.setAttribute('aria-label', documentData.t);
+
+  var letters = documentData.l || [];
+  var usesGlyphs = !!this.globalData.fontManager.chars;
+  len = letters.length;
+
+  var tSpan;
+  var matrixHelper = this.mHelper;
+  var shapeStr = '';
+  var singleShape = this.data.singleShape;
+  var xPos = 0;
+  var yPos = 0;
+  var firstLine = true;
+  var trackingOffset = documentData.tr * 0.001 * documentData.finalSize;
+  if (singleShape && !usesGlyphs && !documentData.sz) {
+    var tElement = this.textContainer;
+    var justify = 'start';
+    switch (documentData.j) {
+      case 1:
+        justify = 'end';
+        break;
+      case 2:
+        justify = 'middle';
+        break;
+      default:
+        justify = 'start';
+        break;
+    }
+    tElement.setAttribute('text-anchor', justify);
+    tElement.setAttribute('letter-spacing', trackingOffset);
+    var textContent = this.buildTextContents(documentData.finalText);
+    len = textContent.length;
+    yPos = documentData.ps ? documentData.ps[1] + documentData.ascent : 0;
+    for (i = 0; i < len; i += 1) {
+      tSpan = this.textSpans[i].span || createNS('tspan');
+      tSpan.textContent = textContent[i];
+      tSpan.setAttribute('x', 0);
+      tSpan.setAttribute('y', yPos);
+      tSpan.style.display = 'inherit';
+      tElement.appendChild(tSpan);
+      if (!this.textSpans[i]) {
+        this.textSpans[i] = {
+          span: null,
+          glyph: null,
+        };
+      }
+      this.textSpans[i].span = tSpan;
+      yPos += documentData.finalLineHeight;
+    }
+
+    this.layerElement.appendChild(tElement);
+  } else {
+    var cachedSpansLength = this.textSpans.length;
+    var charData;
+    for (i = 0; i < len; i += 1) {
+      if (!this.textSpans[i]) {
+        this.textSpans[i] = {
+          span: null,
+          childSpan: null,
+          glyph: null,
+        };
+      }
+      if (!usesGlyphs || !singleShape || i === 0) {
+        tSpan = cachedSpansLength > i ? this.textSpans[i].span : createNS(usesGlyphs ? 'g' : 'text');
+        if (cachedSpansLength <= i) {
+          tSpan.setAttribute('stroke-linecap', 'butt');
+          tSpan.setAttribute('stroke-linejoin', 'round');
+          tSpan.setAttribute('stroke-miterlimit', '4');
+          this.textSpans[i].span = tSpan;
+          if (usesGlyphs) {
+            var childSpan = createNS('g');
+            tSpan.appendChild(childSpan);
+            this.textSpans[i].childSpan = childSpan;
+          }
+          this.textSpans[i].span = tSpan;
+          this.layerElement.appendChild(tSpan);
+        }
+        tSpan.style.display = 'inherit';
+      }
+
+      matrixHelper.reset();
+      if (singleShape) {
+        if (letters[i].n) {
+          xPos = -trackingOffset;
+          yPos += documentData.yOffset;
+          yPos += firstLine ? 1 : 0;
+          firstLine = false;
+        }
+        this.applyTextPropertiesToMatrix(documentData, matrixHelper, letters[i].line, xPos, yPos);
+        xPos += letters[i].l || 0;
+        // xPos += letters[i].val === ' ' ? 0 : trackingOffset;
+        xPos += trackingOffset;
+      }
+      if (usesGlyphs) {
+        charData = this.globalData.fontManager.getCharData(
+          documentData.finalText[i],
+          fontData.fStyle,
+          this.globalData.fontManager.getFontByName(documentData.f).fFamily
+        );
+        var glyphElement;
+        // t === 1 means the character has been replaced with an animated shaped
+        if (charData.t === 1) {
+          glyphElement = new SVGCompElement(charData.data, this.globalData, this);
+        } else {
+          var data = emptyShapeData;
+          if (charData.data && charData.data.shapes) {
+            data = this.buildShapeData(charData.data, documentData.finalSize);
+          }
+          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);
+        glyphElement.renderFrame();
+        this.textSpans[i].childSpan.appendChild(glyphElement.layerElement);
+        // when using animated shapes, the layer will be scaled instead of replacing the internal scale
+        // this might have issues with strokes and might need a different solution
+        if (charData.t === 1) {
+          this.textSpans[i].childSpan.setAttribute('transform', 'scale(' + documentData.finalSize / 100 + ',' + documentData.finalSize / 100 + ')');
+        }
+      } else {
+        if (singleShape) {
+          tSpan.setAttribute('transform', 'translate(' + matrixHelper.props[12] + ',' + matrixHelper.props[13] + ')');
+        }
+        tSpan.textContent = letters[i].val;
+        tSpan.setAttributeNS('http://www.w3.org/XML/1998/namespace', 'xml:space', 'preserve');
+      }
+      //
+    }
+    if (singleShape && tSpan) {
+      tSpan.setAttribute('d', shapeStr);
+    }
+  }
+  while (i < this.textSpans.length) {
+    this.textSpans[i].span.style.display = 'none';
+    i += 1;
+  }
+
+  this._sizeChanged = true;
+};
+
+SVGTextLottieElement.prototype.sourceRectAtTime = function () {
+  this.prepareFrame(this.comp.renderedFrame - this.data.st);
+  this.renderInnerContent();
+  if (this._sizeChanged) {
+    this._sizeChanged = false;
+    var textBox = this.layerElement.getBBox();
+    this.bbox = {
+      top: textBox.y,
+      left: textBox.x,
+      width: textBox.width,
+      height: textBox.height,
+    };
+  }
+  return this.bbox;
+};
+
+SVGTextLottieElement.prototype.getValue = function () {
+  var i;
+  var len = this.textSpans.length;
+  var glyphElement;
+  this.renderedFrame = this.comp.renderedFrame;
+  for (i = 0; i < len; i += 1) {
+    glyphElement = this.textSpans[i].glyph;
+    if (glyphElement) {
+      glyphElement.prepareFrame(this.comp.renderedFrame - this.data.st);
+      if (glyphElement._mdf) {
+        this._mdf = true;
+      }
+    }
+  }
+};
+
+SVGTextLottieElement.prototype.renderInnerContent = function () {
+  this.validateText();
+  if (!this.data.singleShape || this._mdf) {
+    this.textAnimator.getMeasures(this.textProperty.currentData, this.lettersChangedFlag);
+    if (this.lettersChangedFlag || this.textAnimator.lettersChangedFlag) {
+      this._sizeChanged = true;
+      var i;
+      var len;
+      var renderedLetters = this.textAnimator.renderedLetters;
+
+      var letters = this.textProperty.currentData.l;
+
+      len = letters.length;
+      var renderedLetter;
+      var textSpan;
+      var glyphElement;
+      for (i = 0; i < len; i += 1) {
+        if (!letters[i].n) {
+          renderedLetter = renderedLetters[i];
+          textSpan = this.textSpans[i].span;
+          glyphElement = this.textSpans[i].glyph;
+          if (glyphElement) {
+            glyphElement.renderFrame();
+          }
+          if (renderedLetter._mdf.m) {
+            textSpan.setAttribute('transform', renderedLetter.m);
+          }
+          if (renderedLetter._mdf.o) {
+            textSpan.setAttribute('opacity', renderedLetter.o);
+          }
+          if (renderedLetter._mdf.sw) {
+            textSpan.setAttribute('stroke-width', renderedLetter.sw);
+          }
+          if (renderedLetter._mdf.sc) {
+            textSpan.setAttribute('stroke', renderedLetter.sc);
+          }
+          if (renderedLetter._mdf.fc) {
+            textSpan.setAttribute('fill', renderedLetter.fc);
+          }
+        }
+      }
+    }
+  }
+};
+
+export default SVGTextLottieElement;

node_modules/lottie-web/player/js/elements/svgElements/effects/SVGComposableEffect.js

@@ -0,0 +1,22 @@
+import createNS from '../../../utils/helpers/svg_elements';
+
+function SVGComposableEffect() {
+
+}
+SVGComposableEffect.prototype = {
+  createMergeNode: (resultId, ins) => {
+    var feMerge = createNS('feMerge');
+    feMerge.setAttribute('result', resultId);
+    var feMergeNode;
+    var i;
+    for (i = 0; i < ins.length; i += 1) {
+      feMergeNode = createNS('feMergeNode');
+      feMergeNode.setAttribute('in', ins[i]);
+      feMerge.appendChild(feMergeNode);
+      feMerge.appendChild(feMergeNode);
+    }
+    return feMerge;
+  },
+};
+
+export default SVGComposableEffect;

node_modules/lottie-web/player/js/elements/svgElements/effects/SVGDropShadowEffect.js

@@ -0,0 +1,83 @@
+import {
+  degToRads,
+  rgbToHex,
+} from '../../../utils/common';
+import createNS from '../../../utils/helpers/svg_elements';
+import SVGComposableEffect from './SVGComposableEffect';
+import {
+  extendPrototype,
+} from '../../../utils/functionExtensions';
+
+function SVGDropShadowEffect(filter, filterManager, elem, id, source) {
+  var globalFilterSize = filterManager.container.globalData.renderConfig.filterSize;
+  var filterSize = filterManager.data.fs || globalFilterSize;
+  filter.setAttribute('x', filterSize.x || globalFilterSize.x);
+  filter.setAttribute('y', filterSize.y || globalFilterSize.y);
+  filter.setAttribute('width', filterSize.width || globalFilterSize.width);
+  filter.setAttribute('height', filterSize.height || globalFilterSize.height);
+  this.filterManager = filterManager;
+
+  var feGaussianBlur = createNS('feGaussianBlur');
+  feGaussianBlur.setAttribute('in', 'SourceAlpha');
+  feGaussianBlur.setAttribute('result', id + '_drop_shadow_1');
+  feGaussianBlur.setAttribute('stdDeviation', '0');
+  this.feGaussianBlur = feGaussianBlur;
+  filter.appendChild(feGaussianBlur);
+
+  var feOffset = createNS('feOffset');
+  feOffset.setAttribute('dx', '25');
+  feOffset.setAttribute('dy', '0');
+  feOffset.setAttribute('in', id + '_drop_shadow_1');
+  feOffset.setAttribute('result', id + '_drop_shadow_2');
+  this.feOffset = feOffset;
+  filter.appendChild(feOffset);
+  var feFlood = createNS('feFlood');
+  feFlood.setAttribute('flood-color', '#00ff00');
+  feFlood.setAttribute('flood-opacity', '1');
+  feFlood.setAttribute('result', id + '_drop_shadow_3');
+  this.feFlood = feFlood;
+  filter.appendChild(feFlood);
+
+  var feComposite = createNS('feComposite');
+  feComposite.setAttribute('in', id + '_drop_shadow_3');
+  feComposite.setAttribute('in2', id + '_drop_shadow_2');
+  feComposite.setAttribute('operator', 'in');
+  feComposite.setAttribute('result', id + '_drop_shadow_4');
+  filter.appendChild(feComposite);
+
+  var feMerge = this.createMergeNode(
+    id,
+    [
+      id + '_drop_shadow_4',
+      source,
+    ]
+  );
+  filter.appendChild(feMerge);
+  //
+}
+extendPrototype([SVGComposableEffect], SVGDropShadowEffect);
+
+SVGDropShadowEffect.prototype.renderFrame = function (forceRender) {
+  if (forceRender || this.filterManager._mdf) {
+    if (forceRender || this.filterManager.effectElements[4].p._mdf) {
+      this.feGaussianBlur.setAttribute('stdDeviation', this.filterManager.effectElements[4].p.v / 4);
+    }
+    if (forceRender || this.filterManager.effectElements[0].p._mdf) {
+      var col = this.filterManager.effectElements[0].p.v;
+      this.feFlood.setAttribute('flood-color', rgbToHex(Math.round(col[0] * 255), Math.round(col[1] * 255), Math.round(col[2] * 255)));
+    }
+    if (forceRender || this.filterManager.effectElements[1].p._mdf) {
+      this.feFlood.setAttribute('flood-opacity', this.filterManager.effectElements[1].p.v / 255);
+    }
+    if (forceRender || this.filterManager.effectElements[2].p._mdf || this.filterManager.effectElements[3].p._mdf) {
+      var distance = this.filterManager.effectElements[3].p.v;
+      var angle = (this.filterManager.effectElements[2].p.v - 90) * degToRads;
+      var x = distance * Math.cos(angle);
+      var y = distance * Math.sin(angle);
+      this.feOffset.setAttribute('dx', x);
+      this.feOffset.setAttribute('dy', y);
+    }
+  }
+};
+
+export default SVGDropShadowEffect;

node_modules/lottie-web/player/js/elements/svgElements/effects/SVGFillFilter.js

@@ -0,0 +1,22 @@
+import createNS from '../../../utils/helpers/svg_elements';
+
+function SVGFillFilter(filter, filterManager, elem, id) {
+  this.filterManager = filterManager;
+  var feColorMatrix = createNS('feColorMatrix');
+  feColorMatrix.setAttribute('type', 'matrix');
+  feColorMatrix.setAttribute('color-interpolation-filters', 'sRGB');
+  feColorMatrix.setAttribute('values', '1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 1 0');
+  feColorMatrix.setAttribute('result', id);
+  filter.appendChild(feColorMatrix);
+  this.matrixFilter = feColorMatrix;
+}
+
+SVGFillFilter.prototype.renderFrame = function (forceRender) {
+  if (forceRender || this.filterManager._mdf) {
+    var color = this.filterManager.effectElements[2].p.v;
+    var opacity = this.filterManager.effectElements[6].p.v;
+    this.matrixFilter.setAttribute('values', '0 0 0 0 ' + color[0] + ' 0 0 0 0 ' + color[1] + ' 0 0 0 0 ' + color[2] + ' 0 0 0 ' + opacity + ' 0');
+  }
+};
+
+export default SVGFillFilter;

node_modules/lottie-web/player/js/elements/svgElements/effects/SVGGaussianBlurEffect.js

@@ -0,0 +1,44 @@
+import createNS from '../../../utils/helpers/svg_elements';
+
+function SVGGaussianBlurEffect(filter, filterManager, elem, id) {
+  // Outset the filter region by 100% on all sides to accommodate blur expansion.
+  filter.setAttribute('x', '-100%');
+  filter.setAttribute('y', '-100%');
+  filter.setAttribute('width', '300%');
+  filter.setAttribute('height', '300%');
+
+  this.filterManager = filterManager;
+  var feGaussianBlur = createNS('feGaussianBlur');
+  feGaussianBlur.setAttribute('result', id);
+  filter.appendChild(feGaussianBlur);
+  this.feGaussianBlur = feGaussianBlur;
+}
+
+SVGGaussianBlurEffect.prototype.renderFrame = function (forceRender) {
+  if (forceRender || this.filterManager._mdf) {
+    // Empirical value, matching AE's blur appearance.
+    var kBlurrinessToSigma = 0.3;
+    var sigma = this.filterManager.effectElements[0].p.v * kBlurrinessToSigma;
+
+    // Dimensions mapping:
+    //
+    //   1 -> horizontal & vertical
+    //   2 -> horizontal only
+    //   3 -> vertical only
+    //
+    var dimensions = this.filterManager.effectElements[1].p.v;
+    var sigmaX = (dimensions == 3) ? 0 : sigma; // eslint-disable-line eqeqeq
+    var sigmaY = (dimensions == 2) ? 0 : sigma; // eslint-disable-line eqeqeq
+
+    this.feGaussianBlur.setAttribute('stdDeviation', sigmaX + ' ' + sigmaY);
+
+    // Repeat edges mapping:
+    //
+    //   0 -> off -> duplicate
+    //   1 -> on  -> wrap
+    var edgeMode = (this.filterManager.effectElements[2].p.v == 1) ? 'wrap' : 'duplicate'; // eslint-disable-line eqeqeq
+    this.feGaussianBlur.setAttribute('edgeMode', edgeMode);
+  }
+};
+
+export default SVGGaussianBlurEffect;

node_modules/lottie-web/player/js/elements/svgElements/effects/SVGMatte3Effect.js

@@ -0,0 +1,101 @@
+import {
+  createElementID,
+} from '../../../utils/common';
+import createNS from '../../../utils/helpers/svg_elements';
+
+var _svgMatteSymbols = [];
+
+function SVGMatte3Effect(filterElem, filterManager, elem) {
+  this.initialized = false;
+  this.filterManager = filterManager;
+  this.filterElem = filterElem;
+  this.elem = elem;
+  elem.matteElement = createNS('g');
+  elem.matteElement.appendChild(elem.layerElement);
+  elem.matteElement.appendChild(elem.transformedElement);
+  elem.baseElement = elem.matteElement;
+}
+
+SVGMatte3Effect.prototype.findSymbol = function (mask) {
+  var i = 0;
+  var len = _svgMatteSymbols.length;
+  while (i < len) {
+    if (_svgMatteSymbols[i] === mask) {
+      return _svgMatteSymbols[i];
+    }
+    i += 1;
+  }
+  return null;
+};
+
+SVGMatte3Effect.prototype.replaceInParent = function (mask, symbolId) {
+  var parentNode = mask.layerElement.parentNode;
+  if (!parentNode) {
+    return;
+  }
+  var children = parentNode.children;
+  var i = 0;
+  var len = children.length;
+  while (i < len) {
+    if (children[i] === mask.layerElement) {
+      break;
+    }
+    i += 1;
+  }
+  var nextChild;
+  if (i <= len - 2) {
+    nextChild = children[i + 1];
+  }
+  var useElem = createNS('use');
+  useElem.setAttribute('href', '#' + symbolId);
+  if (nextChild) {
+    parentNode.insertBefore(useElem, nextChild);
+  } else {
+    parentNode.appendChild(useElem);
+  }
+};
+
+SVGMatte3Effect.prototype.setElementAsMask = function (elem, mask) {
+  if (!this.findSymbol(mask)) {
+    var symbolId = createElementID();
+    var masker = createNS('mask');
+    masker.setAttribute('id', mask.layerId);
+    masker.setAttribute('mask-type', 'alpha');
+    _svgMatteSymbols.push(mask);
+    var defs = elem.globalData.defs;
+    defs.appendChild(masker);
+    var symbol = createNS('symbol');
+    symbol.setAttribute('id', symbolId);
+    this.replaceInParent(mask, symbolId);
+    symbol.appendChild(mask.layerElement);
+    defs.appendChild(symbol);
+    var useElem = createNS('use');
+    useElem.setAttribute('href', '#' + symbolId);
+    masker.appendChild(useElem);
+    mask.data.hd = false;
+    mask.show();
+  }
+  elem.setMatte(mask.layerId);
+};
+
+SVGMatte3Effect.prototype.initialize = function () {
+  var ind = this.filterManager.effectElements[0].p.v;
+  var elements = this.elem.comp.elements;
+  var i = 0;
+  var len = elements.length;
+  while (i < len) {
+    if (elements[i] && elements[i].data.ind === ind) {
+      this.setElementAsMask(this.elem, elements[i]);
+    }
+    i += 1;
+  }
+  this.initialized = true;
+};
+
+SVGMatte3Effect.prototype.renderFrame = function () {
+  if (!this.initialized) {
+    this.initialize();
+  }
+};
+
+export default SVGMatte3Effect;

node_modules/lottie-web/player/js/elements/svgElements/effects/SVGProLevelsFilter.js

@@ -0,0 +1,108 @@
+import createNS from '../../../utils/helpers/svg_elements';
+
+function SVGProLevelsFilter(filter, filterManager, elem, id) {
+  this.filterManager = filterManager;
+  var effectElements = this.filterManager.effectElements;
+  var feComponentTransfer = createNS('feComponentTransfer');
+
+  // Red
+  if (effectElements[10].p.k || effectElements[10].p.v !== 0 || effectElements[11].p.k || effectElements[11].p.v !== 1 || effectElements[12].p.k || effectElements[12].p.v !== 1 || effectElements[13].p.k || effectElements[13].p.v !== 0 || effectElements[14].p.k || effectElements[14].p.v !== 1) {
+    this.feFuncR = this.createFeFunc('feFuncR', feComponentTransfer);
+  }
+  // Green
+  if (effectElements[17].p.k || effectElements[17].p.v !== 0 || effectElements[18].p.k || effectElements[18].p.v !== 1 || effectElements[19].p.k || effectElements[19].p.v !== 1 || effectElements[20].p.k || effectElements[20].p.v !== 0 || effectElements[21].p.k || effectElements[21].p.v !== 1) {
+    this.feFuncG = this.createFeFunc('feFuncG', feComponentTransfer);
+  }
+  // Blue
+  if (effectElements[24].p.k || effectElements[24].p.v !== 0 || effectElements[25].p.k || effectElements[25].p.v !== 1 || effectElements[26].p.k || effectElements[26].p.v !== 1 || effectElements[27].p.k || effectElements[27].p.v !== 0 || effectElements[28].p.k || effectElements[28].p.v !== 1) {
+    this.feFuncB = this.createFeFunc('feFuncB', feComponentTransfer);
+  }
+  // Alpha
+  if (effectElements[31].p.k || effectElements[31].p.v !== 0 || effectElements[32].p.k || effectElements[32].p.v !== 1 || effectElements[33].p.k || effectElements[33].p.v !== 1 || effectElements[34].p.k || effectElements[34].p.v !== 0 || effectElements[35].p.k || effectElements[35].p.v !== 1) {
+    this.feFuncA = this.createFeFunc('feFuncA', feComponentTransfer);
+  }
+  // RGB
+  if (this.feFuncR || this.feFuncG || this.feFuncB || this.feFuncA) {
+    feComponentTransfer.setAttribute('color-interpolation-filters', 'sRGB');
+    filter.appendChild(feComponentTransfer);
+  }
+
+  if (effectElements[3].p.k || effectElements[3].p.v !== 0 || effectElements[4].p.k || effectElements[4].p.v !== 1 || effectElements[5].p.k || effectElements[5].p.v !== 1 || effectElements[6].p.k || effectElements[6].p.v !== 0 || effectElements[7].p.k || effectElements[7].p.v !== 1) {
+    feComponentTransfer = createNS('feComponentTransfer');
+    feComponentTransfer.setAttribute('color-interpolation-filters', 'sRGB');
+    feComponentTransfer.setAttribute('result', id);
+    filter.appendChild(feComponentTransfer);
+    this.feFuncRComposed = this.createFeFunc('feFuncR', feComponentTransfer);
+    this.feFuncGComposed = this.createFeFunc('feFuncG', feComponentTransfer);
+    this.feFuncBComposed = this.createFeFunc('feFuncB', feComponentTransfer);
+  }
+}
+
+SVGProLevelsFilter.prototype.createFeFunc = function (type, feComponentTransfer) {
+  var feFunc = createNS(type);
+  feFunc.setAttribute('type', 'table');
+  feComponentTransfer.appendChild(feFunc);
+  return feFunc;
+};
+
+SVGProLevelsFilter.prototype.getTableValue = function (inputBlack, inputWhite, gamma, outputBlack, outputWhite) {
+  var cnt = 0;
+  var segments = 256;
+  var perc;
+  var min = Math.min(inputBlack, inputWhite);
+  var max = Math.max(inputBlack, inputWhite);
+  var table = Array.call(null, { length: segments });
+  var colorValue;
+  var pos = 0;
+  var outputDelta = outputWhite - outputBlack;
+  var inputDelta = inputWhite - inputBlack;
+  while (cnt <= 256) {
+    perc = cnt / 256;
+    if (perc <= min) {
+      colorValue = inputDelta < 0 ? outputWhite : outputBlack;
+    } else if (perc >= max) {
+      colorValue = inputDelta < 0 ? outputBlack : outputWhite;
+    } else {
+      colorValue = (outputBlack + outputDelta * Math.pow((perc - inputBlack) / inputDelta, 1 / gamma));
+    }
+    table[pos] = colorValue;
+    pos += 1;
+    cnt += 256 / (segments - 1);
+  }
+  return table.join(' ');
+};
+
+SVGProLevelsFilter.prototype.renderFrame = function (forceRender) {
+  if (forceRender || this.filterManager._mdf) {
+    var val;
+    var effectElements = this.filterManager.effectElements;
+    if (this.feFuncRComposed && (forceRender || effectElements[3].p._mdf || effectElements[4].p._mdf || effectElements[5].p._mdf || effectElements[6].p._mdf || effectElements[7].p._mdf)) {
+      val = this.getTableValue(effectElements[3].p.v, effectElements[4].p.v, effectElements[5].p.v, effectElements[6].p.v, effectElements[7].p.v);
+      this.feFuncRComposed.setAttribute('tableValues', val);
+      this.feFuncGComposed.setAttribute('tableValues', val);
+      this.feFuncBComposed.setAttribute('tableValues', val);
+    }
+
+    if (this.feFuncR && (forceRender || effectElements[10].p._mdf || effectElements[11].p._mdf || effectElements[12].p._mdf || effectElements[13].p._mdf || effectElements[14].p._mdf)) {
+      val = this.getTableValue(effectElements[10].p.v, effectElements[11].p.v, effectElements[12].p.v, effectElements[13].p.v, effectElements[14].p.v);
+      this.feFuncR.setAttribute('tableValues', val);
+    }
+
+    if (this.feFuncG && (forceRender || effectElements[17].p._mdf || effectElements[18].p._mdf || effectElements[19].p._mdf || effectElements[20].p._mdf || effectElements[21].p._mdf)) {
+      val = this.getTableValue(effectElements[17].p.v, effectElements[18].p.v, effectElements[19].p.v, effectElements[20].p.v, effectElements[21].p.v);
+      this.feFuncG.setAttribute('tableValues', val);
+    }
+
+    if (this.feFuncB && (forceRender || effectElements[24].p._mdf || effectElements[25].p._mdf || effectElements[26].p._mdf || effectElements[27].p._mdf || effectElements[28].p._mdf)) {
+      val = this.getTableValue(effectElements[24].p.v, effectElements[25].p.v, effectElements[26].p.v, effectElements[27].p.v, effectElements[28].p.v);
+      this.feFuncB.setAttribute('tableValues', val);
+    }
+
+    if (this.feFuncA && (forceRender || effectElements[31].p._mdf || effectElements[32].p._mdf || effectElements[33].p._mdf || effectElements[34].p._mdf || effectElements[35].p._mdf)) {
+      val = this.getTableValue(effectElements[31].p.v, effectElements[32].p.v, effectElements[33].p.v, effectElements[34].p.v, effectElements[35].p.v);
+      this.feFuncA.setAttribute('tableValues', val);
+    }
+  }
+};
+
+export default SVGProLevelsFilter;

node_modules/lottie-web/player/js/elements/svgElements/effects/SVGStrokeEffect.js

@@ -0,0 +1,119 @@
+import { getLocationHref } from '../../../main';
+import {
+  createElementID,
+  bmFloor,
+} from '../../../utils/common';
+import createNS from '../../../utils/helpers/svg_elements';
+
+function SVGStrokeEffect(fil, filterManager, elem) {
+  this.initialized = false;
+  this.filterManager = filterManager;
+  this.elem = elem;
+  this.paths = [];
+}
+
+SVGStrokeEffect.prototype.initialize = function () {
+  var elemChildren = this.elem.layerElement.children || this.elem.layerElement.childNodes;
+  var path;
+  var groupPath;
+  var i;
+  var len;
+  if (this.filterManager.effectElements[1].p.v === 1) {
+    len = this.elem.maskManager.masksProperties.length;
+    i = 0;
+  } else {
+    i = this.filterManager.effectElements[0].p.v - 1;
+    len = i + 1;
+  }
+  groupPath = createNS('g');
+  groupPath.setAttribute('fill', 'none');
+  groupPath.setAttribute('stroke-linecap', 'round');
+  groupPath.setAttribute('stroke-dashoffset', 1);
+  for (i; i < len; i += 1) {
+    path = createNS('path');
+    groupPath.appendChild(path);
+    this.paths.push({ p: path, m: i });
+  }
+  if (this.filterManager.effectElements[10].p.v === 3) {
+    var mask = createNS('mask');
+    var id = createElementID();
+    mask.setAttribute('id', id);
+    mask.setAttribute('mask-type', 'alpha');
+    mask.appendChild(groupPath);
+    this.elem.globalData.defs.appendChild(mask);
+    var g = createNS('g');
+    g.setAttribute('mask', 'url(' + getLocationHref() + '#' + id + ')');
+    while (elemChildren[0]) {
+      g.appendChild(elemChildren[0]);
+    }
+    this.elem.layerElement.appendChild(g);
+    this.masker = mask;
+    groupPath.setAttribute('stroke', '#fff');
+  } else if (this.filterManager.effectElements[10].p.v === 1 || this.filterManager.effectElements[10].p.v === 2) {
+    if (this.filterManager.effectElements[10].p.v === 2) {
+      elemChildren = this.elem.layerElement.children || this.elem.layerElement.childNodes;
+      while (elemChildren.length) {
+        this.elem.layerElement.removeChild(elemChildren[0]);
+      }
+    }
+    this.elem.layerElement.appendChild(groupPath);
+    this.elem.layerElement.removeAttribute('mask');
+    groupPath.setAttribute('stroke', '#fff');
+  }
+  this.initialized = true;
+  this.pathMasker = groupPath;
+};
+
+SVGStrokeEffect.prototype.renderFrame = function (forceRender) {
+  if (!this.initialized) {
+    this.initialize();
+  }
+  var i;
+  var len = this.paths.length;
+  var mask;
+  var path;
+  for (i = 0; i < len; i += 1) {
+    if (this.paths[i].m !== -1) {
+      mask = this.elem.maskManager.viewData[this.paths[i].m];
+      path = this.paths[i].p;
+      if (forceRender || this.filterManager._mdf || mask.prop._mdf) {
+        path.setAttribute('d', mask.lastPath);
+      }
+      if (forceRender || this.filterManager.effectElements[9].p._mdf || this.filterManager.effectElements[4].p._mdf || this.filterManager.effectElements[7].p._mdf || this.filterManager.effectElements[8].p._mdf || mask.prop._mdf) {
+        var dasharrayValue;
+        if (this.filterManager.effectElements[7].p.v !== 0 || this.filterManager.effectElements[8].p.v !== 100) {
+          var s = Math.min(this.filterManager.effectElements[7].p.v, this.filterManager.effectElements[8].p.v) * 0.01;
+          var e = Math.max(this.filterManager.effectElements[7].p.v, this.filterManager.effectElements[8].p.v) * 0.01;
+          var l = path.getTotalLength();
+          dasharrayValue = '0 0 0 ' + l * s + ' ';
+          var lineLength = l * (e - s);
+          var segment = 1 + this.filterManager.effectElements[4].p.v * 2 * this.filterManager.effectElements[9].p.v * 0.01;
+          var units = Math.floor(lineLength / segment);
+          var j;
+          for (j = 0; j < units; j += 1) {
+            dasharrayValue += '1 ' + this.filterManager.effectElements[4].p.v * 2 * this.filterManager.effectElements[9].p.v * 0.01 + ' ';
+          }
+          dasharrayValue += '0 ' + l * 10 + ' 0 0';
+        } else {
+          dasharrayValue = '1 ' + this.filterManager.effectElements[4].p.v * 2 * this.filterManager.effectElements[9].p.v * 0.01;
+        }
+        path.setAttribute('stroke-dasharray', dasharrayValue);
+      }
+    }
+  }
+  if (forceRender || this.filterManager.effectElements[4].p._mdf) {
+    this.pathMasker.setAttribute('stroke-width', this.filterManager.effectElements[4].p.v * 2);
+  }
+
+  if (forceRender || this.filterManager.effectElements[6].p._mdf) {
+    this.pathMasker.setAttribute('opacity', this.filterManager.effectElements[6].p.v);
+  }
+  if (this.filterManager.effectElements[10].p.v === 1 || this.filterManager.effectElements[10].p.v === 2) {
+    if (forceRender || this.filterManager.effectElements[3].p._mdf) {
+      var color = this.filterManager.effectElements[3].p.v;
+      this.pathMasker.setAttribute('stroke', 'rgb(' + bmFloor(color[0] * 255) + ',' + bmFloor(color[1] * 255) + ',' + bmFloor(color[2] * 255) + ')');
+    }
+  }
+};
+
+export default SVGStrokeEffect;

node_modules/lottie-web/player/js/elements/svgElements/effects/SVGTintEffect.js

@@ -0,0 +1,47 @@
+import createNS from '../../../utils/helpers/svg_elements';
+import SVGComposableEffect from './SVGComposableEffect';
+import {
+  extendPrototype,
+} from '../../../utils/functionExtensions';
+
+var linearFilterValue = '0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0';
+
+function SVGTintFilter(filter, filterManager, elem, id, source) {
+  this.filterManager = filterManager;
+  var feColorMatrix = createNS('feColorMatrix');
+  feColorMatrix.setAttribute('type', 'matrix');
+  feColorMatrix.setAttribute('color-interpolation-filters', 'linearRGB');
+  feColorMatrix.setAttribute('values', linearFilterValue + ' 1 0');
+  this.linearFilter = feColorMatrix;
+  feColorMatrix.setAttribute('result', id + '_tint_1');
+  filter.appendChild(feColorMatrix);
+  feColorMatrix = createNS('feColorMatrix');
+  feColorMatrix.setAttribute('type', 'matrix');
+  feColorMatrix.setAttribute('color-interpolation-filters', 'sRGB');
+  feColorMatrix.setAttribute('values', '1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 1 0');
+  feColorMatrix.setAttribute('result', id + '_tint_2');
+  filter.appendChild(feColorMatrix);
+  this.matrixFilter = feColorMatrix;
+  var feMerge = this.createMergeNode(
+    id,
+    [
+      source,
+      id + '_tint_1',
+      id + '_tint_2',
+    ]
+  );
+  filter.appendChild(feMerge);
+}
+extendPrototype([SVGComposableEffect], SVGTintFilter);
+
+SVGTintFilter.prototype.renderFrame = function (forceRender) {
+  if (forceRender || this.filterManager._mdf) {
+    var colorBlack = this.filterManager.effectElements[0].p.v;
+    var colorWhite = this.filterManager.effectElements[1].p.v;
+    var opacity = this.filterManager.effectElements[2].p.v / 100;
+    this.linearFilter.setAttribute('values', linearFilterValue + ' ' + opacity + ' 0');
+    this.matrixFilter.setAttribute('values', (colorWhite[0] - colorBlack[0]) + ' 0 0 0 ' + colorBlack[0] + ' ' + (colorWhite[1] - colorBlack[1]) + ' 0 0 0 ' + colorBlack[1] + ' ' + (colorWhite[2] - colorBlack[2]) + ' 0 0 0 ' + colorBlack[2] + ' 0 0 0 1 0');
+  }
+};
+
+export default SVGTintFilter;

node_modules/lottie-web/player/js/elements/svgElements/effects/SVGTransformEffect.js

@@ -0,0 +1,10 @@
+import TransformEffect from '../../../effects/TransformEffect';
+import { extendPrototype } from '../../../utils/functionExtensions';
+
+function SVGTransformEffect(_, filterManager) {
+  this.init(filterManager);
+}
+
+extendPrototype([TransformEffect], SVGTransformEffect);
+
+export default SVGTransformEffect;

node_modules/lottie-web/player/js/elements/svgElements/effects/SVGTritoneFilter.js

@@ -0,0 +1,43 @@
+import createNS from '../../../utils/helpers/svg_elements';
+
+function SVGTritoneFilter(filter, filterManager, elem, id) {
+  this.filterManager = filterManager;
+  var feColorMatrix = createNS('feColorMatrix');
+  feColorMatrix.setAttribute('type', 'matrix');
+  feColorMatrix.setAttribute('color-interpolation-filters', 'linearRGB');
+  feColorMatrix.setAttribute('values', '0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0');
+  filter.appendChild(feColorMatrix);
+  var feComponentTransfer = createNS('feComponentTransfer');
+  feComponentTransfer.setAttribute('color-interpolation-filters', 'sRGB');
+  feComponentTransfer.setAttribute('result', id);
+  this.matrixFilter = feComponentTransfer;
+  var feFuncR = createNS('feFuncR');
+  feFuncR.setAttribute('type', 'table');
+  feComponentTransfer.appendChild(feFuncR);
+  this.feFuncR = feFuncR;
+  var feFuncG = createNS('feFuncG');
+  feFuncG.setAttribute('type', 'table');
+  feComponentTransfer.appendChild(feFuncG);
+  this.feFuncG = feFuncG;
+  var feFuncB = createNS('feFuncB');
+  feFuncB.setAttribute('type', 'table');
+  feComponentTransfer.appendChild(feFuncB);
+  this.feFuncB = feFuncB;
+  filter.appendChild(feComponentTransfer);
+}
+
+SVGTritoneFilter.prototype.renderFrame = function (forceRender) {
+  if (forceRender || this.filterManager._mdf) {
+    var color1 = this.filterManager.effectElements[0].p.v;
+    var color2 = this.filterManager.effectElements[1].p.v;
+    var color3 = this.filterManager.effectElements[2].p.v;
+    var tableR = color3[0] + ' ' + color2[0] + ' ' + color1[0];
+    var tableG = color3[1] + ' ' + color2[1] + ' ' + color1[1];
+    var tableB = color3[2] + ' ' + color2[2] + ' ' + color1[2];
+    this.feFuncR.setAttribute('tableValues', tableR);
+    this.feFuncG.setAttribute('tableValues', tableG);
+    this.feFuncB.setAttribute('tableValues', tableB);
+  }
+};
+
+export default SVGTritoneFilter;