removed random ids in favour of incremental ids
diff --git a/player/js/animation/AnimationItem.js b/player/js/animation/AnimationItem.js
index c0f99ed..1d008ec 100644
--- a/player/js/animation/AnimationItem.js
+++ b/player/js/animation/AnimationItem.js
@@ -17,7 +17,7 @@
this.autoplay = false;
this.loop = true;
this.renderer = null;
- this.animationID = randomString(10);
+ this.animationID = createElementID();
this.assetsPath = '';
this.timeCompleted = 0;
this.segmentPos = 0;
diff --git a/player/js/elements/BaseElement.js b/player/js/elements/BaseElement.js
index 23ec18b..d2fee77 100644
--- a/player/js/elements/BaseElement.js
+++ b/player/js/elements/BaseElement.js
@@ -63,7 +63,7 @@
this.globalData = globalData;
this.comp = comp;
this.data = data;
- this.layerId = 'ly_'+randomString(10);
+ this.layerId = createElementID();
//Stretch factor for old animations missing this property.
if(!this.data.sr){
diff --git a/player/js/elements/helpers/shapes/SVGGradientFillStyleData.js b/player/js/elements/helpers/shapes/SVGGradientFillStyleData.js
index c747247..b7a9d9c 100644
--- a/player/js/elements/helpers/shapes/SVGGradientFillStyleData.js
+++ b/player/js/elements/helpers/shapes/SVGGradientFillStyleData.js
@@ -21,7 +21,7 @@
SVGGradientFillStyleData.prototype.setGradientData = function(pathElement,data){
- var gradientId = 'gr_'+randomString(10);
+ var gradientId = createElementID();
var gfill = createNS(data.t === 1 ? 'linearGradient' : 'radialGradient');
gfill.setAttribute('id',gradientId);
gfill.setAttribute('spreadMethod','pad');
@@ -46,8 +46,8 @@
var mask = createNS("mask");
var maskElement = createNS( 'path');
mask.appendChild(maskElement);
- var opacityId = 'op_'+randomString(10);
- var maskId = 'mk_'+randomString(10);
+ var opacityId = createElementID();
+ var maskId = createElementID();
mask.setAttribute('id',maskId);
var opFill = createNS(data.t === 1 ? 'linearGradient' : 'radialGradient');
opFill.setAttribute('id',opacityId);
diff --git a/player/js/elements/svgElements/SVGBaseElement.js b/player/js/elements/svgElements/SVGBaseElement.js
index 7f3a458..a3ca9b8 100644
--- a/player/js/elements/svgElements/SVGBaseElement.js
+++ b/player/js/elements/svgElements/SVGBaseElement.js
@@ -24,7 +24,7 @@
// This is only for IE and Edge when mask if of type alpha
if (!featureSupport.maskType && this.data.td == 1) {
masker.setAttribute('mask-type', 'luminance');
- filId = randomString(10);
+ filId = createElementID();
fil = filtersFactory.createFilter(filId);
this.globalData.defs.appendChild(fil);
fil.appendChild(filtersFactory.createAlphaToLuminanceFilter());
@@ -40,7 +40,7 @@
maskGroup.setAttribute('mask-type','alpha');
var maskGrouper = createNS('g');
maskGroup.appendChild(maskGrouper);
- filId = randomString(10);
+ filId = createElementID();
fil = filtersFactory.createFilter(filId);
////
@@ -99,7 +99,7 @@
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 = 'cp_'+randomString(8);
+ var clipId = createElementID();
cp.setAttribute('id',clipId);
cp.appendChild(pt);
this.globalData.defs.appendChild(cp);
diff --git a/player/js/elements/svgElements/SVGEffects.js b/player/js/elements/svgElements/SVGEffects.js
index 122779c..4f4e2f9 100644
--- a/player/js/elements/svgElements/SVGEffects.js
+++ b/player/js/elements/svgElements/SVGEffects.js
@@ -1,6 +1,6 @@
function SVGEffects(elem){
var i, len = elem.data.ef ? elem.data.ef.length : 0;
- var filId = randomString(10);
+ var filId = createElementID();
var fil = filtersFactory.createFilter(filId);
var count = 0;
this.filters = [];
diff --git a/player/js/elements/svgElements/effects/SVGMatte3Effect.js b/player/js/elements/svgElements/effects/SVGMatte3Effect.js
index ac20b42..48427fb 100644
--- a/player/js/elements/svgElements/effects/SVGMatte3Effect.js
+++ b/player/js/elements/svgElements/effects/SVGMatte3Effect.js
@@ -1,5 +1,4 @@
var _svgMatteSymbols = [];
-var _svgMatteMaskCounter = 0;
function SVGMatte3Effect(filterElem, filterManager, elem){
this.initialized = false;
@@ -51,7 +50,7 @@
SVGMatte3Effect.prototype.setElementAsMask = function(elem, mask) {
if(!this.findSymbol(mask)) {
- var symbolId = 'matte_' + randomString(5) + '_' + _svgMatteMaskCounter++;
+ var symbolId = createElementID();
var masker = createNS('mask');
masker.setAttribute('id', mask.layerId);
masker.setAttribute('mask-type', 'alpha');
diff --git a/player/js/elements/svgElements/effects/SVGStrokeEffect.js b/player/js/elements/svgElements/effects/SVGStrokeEffect.js
index 15542af..d8f6bbf 100644
--- a/player/js/elements/svgElements/effects/SVGStrokeEffect.js
+++ b/player/js/elements/svgElements/effects/SVGStrokeEffect.js
@@ -27,7 +27,7 @@
}
if(this.filterManager.effectElements[10].p.v === 3){
var mask = createNS('mask');
- var id = 'stms_' + randomString(10);
+ var id = createElementID();
mask.setAttribute('id',id);
mask.setAttribute('mask-type','alpha');
mask.appendChild(groupPath);
diff --git a/player/js/mask.js b/player/js/mask.js
index d7bae26..4529f04 100644
--- a/player/js/mask.js
+++ b/player/js/mask.js
@@ -15,7 +15,7 @@
var count = 0;
var currentMasks = [];
var j, jLen;
- var layerId = randomString(10);
+ var layerId = createElementID();
var rect, expansor, feMorph,x;
var maskType = 'clipPath', maskRef = 'clip-path';
for (i = 0; i < len; i++) {
@@ -57,7 +57,7 @@
maskType = 'mask';
maskRef = 'mask';
x = PropertyFactory.getProp(this.element,properties[i].x,0,null,this.element);
- filterID = 'fi_'+randomString(10);
+ filterID = createElementID();
expansor = createNS('filter');
expansor.setAttribute('id',filterID);
feMorph = createNS('feMorphology');
diff --git a/player/js/renderers/SVGRenderer.js b/player/js/renderers/SVGRenderer.js
index a1135f3..48f42e6 100644
--- a/player/js/renderers/SVGRenderer.js
+++ b/player/js/renderers/SVGRenderer.js
@@ -93,7 +93,7 @@
rect.setAttribute('height',animData.h);
rect.setAttribute('x',0);
rect.setAttribute('y',0);
- var maskId = 'animationMask_'+randomString(10);
+ var maskId = createElementID();
maskElement.setAttribute('id', maskId);
maskElement.appendChild(rect);
this.layerElement.setAttribute("clip-path", "url(" + locationHref + "#"+maskId+")");
diff --git a/player/js/utils/common.js b/player/js/utils/common.js
index c52c881..2ff0a89 100644
--- a/player/js/utils/common.js
+++ b/player/js/utils/common.js
@@ -92,15 +92,12 @@
this.target = t;
}
-function randomString(length, chars){
- if(chars === undefined){
- chars = 'abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ1234567890';
+var createElementID = (function(){
+ var _count = 0;
+ return function createID() {
+ return '__lottie_element_' + ++_count
}
- var i;
- var result = '';
- for (i = length; i > 0; --i) result += chars[Math.round(Math.random() * (chars.length - 1))];
- return result;
-}
+}())
function HSVtoRGB(h, s, v) {
var r, g, b, i, f, p, q, t;
