three-stdlib
Version:
stand-alone library of threejs examples
1,531 lines • 469 kB
JavaScript
"use strict";
const lottie = /* @__PURE__ */ (() => {
if (typeof navigator === "undefined" || typeof document === "undefined" || typeof CanvasRenderingContext2D === "undefined")
return {};
const svgNS = "http://www.w3.org/2000/svg";
let locationHref = "";
let _useWebWorker = false;
const initialDefaultFrame = -999999;
const setWebWorker = (flag) => {
_useWebWorker = !!flag;
};
const getWebWorker = () => _useWebWorker;
const setLocationHref = (value) => {
locationHref = value;
};
const getLocationHref = () => locationHref;
function createTag(type) {
return document.createElement(type);
}
function extendPrototype(sources, destination) {
var i;
var len = sources.length;
var sourcePrototype;
for (i = 0; i < len; i += 1) {
sourcePrototype = sources[i].prototype;
for (var attr in sourcePrototype) {
if (Object.prototype.hasOwnProperty.call(sourcePrototype, attr))
destination.prototype[attr] = sourcePrototype[attr];
}
}
}
function getDescriptor(object, prop) {
return Object.getOwnPropertyDescriptor(object, prop);
}
function createProxyFunction(prototype) {
function ProxyFunction() {
}
ProxyFunction.prototype = prototype;
return ProxyFunction;
}
const audioControllerFactory = function() {
function AudioController(audioFactory) {
this.audios = [];
this.audioFactory = audioFactory;
this._volume = 1;
this._isMuted = false;
}
AudioController.prototype = {
addAudio: function(audio) {
this.audios.push(audio);
},
pause: function() {
var i;
var len = this.audios.length;
for (i = 0; i < len; i += 1) {
this.audios[i].pause();
}
},
resume: function() {
var i;
var len = this.audios.length;
for (i = 0; i < len; i += 1) {
this.audios[i].resume();
}
},
setRate: function(rateValue) {
var i;
var len = this.audios.length;
for (i = 0; i < len; i += 1) {
this.audios[i].setRate(rateValue);
}
},
createAudio: function(assetPath) {
if (this.audioFactory) {
return this.audioFactory(assetPath);
}
if (window.Howl) {
return new window.Howl({
src: [assetPath]
});
}
return {
isPlaying: false,
play: function() {
this.isPlaying = true;
},
seek: function() {
this.isPlaying = false;
},
playing: function() {
},
rate: function() {
},
setVolume: function() {
}
};
},
setAudioFactory: function(audioFactory) {
this.audioFactory = audioFactory;
},
setVolume: function(value) {
this._volume = value;
this._updateVolume();
},
mute: function() {
this._isMuted = true;
this._updateVolume();
},
unmute: function() {
this._isMuted = false;
this._updateVolume();
},
getVolume: function() {
return this._volume;
},
_updateVolume: function() {
var i;
var len = this.audios.length;
for (i = 0; i < len; i += 1) {
this.audios[i].volume(this._volume * (this._isMuted ? 0 : 1));
}
}
};
return function() {
return new AudioController();
};
}();
const createTypedArray = function() {
function createRegularArray(type, len) {
var i = 0;
var arr = [];
var value;
switch (type) {
case "int16":
case "uint8c":
value = 1;
break;
default:
value = 1.1;
break;
}
for (i = 0; i < len; i += 1) {
arr.push(value);
}
return arr;
}
function createTypedArrayFactory(type, len) {
if (type === "float32") {
return new Float32Array(len);
}
if (type === "int16") {
return new Int16Array(len);
}
if (type === "uint8c") {
return new Uint8ClampedArray(len);
}
return createRegularArray(type, len);
}
if (typeof Uint8ClampedArray === "function" && typeof Float32Array === "function") {
return createTypedArrayFactory;
}
return createRegularArray;
}();
function createSizedArray(len) {
return Array.apply(null, { length: len });
}
let subframeEnabled = true;
let expressionsPlugin = null;
let idPrefix$1 = "";
const isSafari = /^((?!chrome|android).)*safari/i.test(navigator.userAgent);
const bmPow = Math.pow;
const bmSqrt = Math.sqrt;
const bmFloor = Math.floor;
const bmMin = Math.min;
const BMMath = {};
(function() {
var propertyNames = [
"abs",
"acos",
"acosh",
"asin",
"asinh",
"atan",
"atanh",
"atan2",
"ceil",
"cbrt",
"expm1",
"clz32",
"cos",
"cosh",
"exp",
"floor",
"fround",
"hypot",
"imul",
"log",
"log1p",
"log2",
"log10",
"max",
"min",
"pow",
"random",
"round",
"sign",
"sin",
"sinh",
"sqrt",
"tan",
"tanh",
"trunc",
"E",
"LN10",
"LN2",
"LOG10E",
"LOG2E",
"PI",
"SQRT1_2",
"SQRT2"
];
var i;
var len = propertyNames.length;
for (i = 0; i < len; i += 1) {
BMMath[propertyNames[i]] = Math[propertyNames[i]];
}
})();
BMMath.random = Math.random;
BMMath.abs = function(val) {
var tOfVal = typeof val;
if (tOfVal === "object" && val.length) {
var absArr = createSizedArray(val.length);
var i;
var len = val.length;
for (i = 0; i < len; i += 1) {
absArr[i] = Math.abs(val[i]);
}
return absArr;
}
return Math.abs(val);
};
let defaultCurveSegments = 150;
const degToRads = Math.PI / 180;
const roundCorner = 0.5519;
function BMEnterFrameEvent(type, currentTime, totalTime, frameMultiplier) {
this.type = type;
this.currentTime = currentTime;
this.totalTime = totalTime;
this.direction = frameMultiplier < 0 ? -1 : 1;
}
function BMCompleteEvent(type, frameMultiplier) {
this.type = type;
this.direction = frameMultiplier < 0 ? -1 : 1;
}
function BMCompleteLoopEvent(type, totalLoops, currentLoop, frameMultiplier) {
this.type = type;
this.currentLoop = currentLoop;
this.totalLoops = totalLoops;
this.direction = frameMultiplier < 0 ? -1 : 1;
}
function BMSegmentStartEvent(type, firstFrame, totalFrames) {
this.type = type;
this.firstFrame = firstFrame;
this.totalFrames = totalFrames;
}
function BMDestroyEvent(type, target) {
this.type = type;
this.target = target;
}
function BMRenderFrameErrorEvent(nativeError, currentTime) {
this.type = "renderFrameError";
this.nativeError = nativeError;
this.currentTime = currentTime;
}
function BMConfigErrorEvent(nativeError) {
this.type = "configError";
this.nativeError = nativeError;
}
const createElementID = function() {
var _count = 0;
return function createID() {
_count += 1;
return idPrefix$1 + "__lottie_element_" + _count;
};
}();
function HSVtoRGB(h, s, v) {
var r;
var g;
var b;
var i;
var f;
var p;
var q;
var t;
i = Math.floor(h * 6);
f = h * 6 - i;
p = v * (1 - s);
q = v * (1 - f * s);
t = v * (1 - (1 - f) * s);
switch (i % 6) {
case 0:
r = v;
g = t;
b = p;
break;
case 1:
r = q;
g = v;
b = p;
break;
case 2:
r = p;
g = v;
b = t;
break;
case 3:
r = p;
g = q;
b = v;
break;
case 4:
r = t;
g = p;
b = v;
break;
case 5:
r = v;
g = p;
b = q;
break;
}
return [r, g, b];
}
function RGBtoHSV(r, g, b) {
var max = Math.max(r, g, b);
var min = Math.min(r, g, b);
var d = max - min;
var h;
var s = max === 0 ? 0 : d / max;
var v = max / 255;
switch (max) {
case min:
h = 0;
break;
case r:
h = g - b + d * (g < b ? 6 : 0);
h /= 6 * d;
break;
case g:
h = b - r + d * 2;
h /= 6 * d;
break;
case b:
h = r - g + d * 4;
h /= 6 * d;
break;
}
return [h, s, v];
}
function addSaturationToRGB(color, offset) {
var hsv = RGBtoHSV(color[0] * 255, color[1] * 255, color[2] * 255);
hsv[1] += offset;
if (hsv[1] > 1) {
hsv[1] = 1;
} else if (hsv[1] <= 0) {
hsv[1] = 0;
}
return HSVtoRGB(hsv[0], hsv[1], hsv[2]);
}
function addBrightnessToRGB(color, offset) {
var hsv = RGBtoHSV(color[0] * 255, color[1] * 255, color[2] * 255);
hsv[2] += offset;
if (hsv[2] > 1) {
hsv[2] = 1;
} else if (hsv[2] < 0) {
hsv[2] = 0;
}
return HSVtoRGB(hsv[0], hsv[1], hsv[2]);
}
function addHueToRGB(color, offset) {
var hsv = RGBtoHSV(color[0] * 255, color[1] * 255, color[2] * 255);
hsv[0] += offset / 360;
if (hsv[0] > 1) {
hsv[0] -= 1;
} else if (hsv[0] < 0) {
hsv[0] += 1;
}
return HSVtoRGB(hsv[0], hsv[1], hsv[2]);
}
(function() {
var colorMap = [];
var i;
var hex;
for (i = 0; i < 256; i += 1) {
hex = i.toString(16);
colorMap[i] = hex.length === 1 ? "0" + hex : hex;
}
return function(r, g, b) {
if (r < 0) {
r = 0;
}
if (g < 0) {
g = 0;
}
if (b < 0) {
b = 0;
}
return "#" + colorMap[r] + colorMap[g] + colorMap[b];
};
})();
const setSubframeEnabled = (flag) => {
subframeEnabled = !!flag;
};
const getSubframeEnabled = () => subframeEnabled;
const setExpressionsPlugin = (value) => {
expressionsPlugin = value;
};
const getExpressionsPlugin = () => expressionsPlugin;
const setDefaultCurveSegments = (value) => {
defaultCurveSegments = value;
};
const getDefaultCurveSegments = () => defaultCurveSegments;
const setIdPrefix = (value) => {
idPrefix$1 = value;
};
function createNS(type) {
return document.createElementNS(svgNS, type);
}
const dataManager = function() {
var _counterId = 1;
var processes = [];
var workerFn;
var workerInstance;
var workerProxy = {
onmessage: function() {
},
postMessage: function(path) {
workerFn({
data: path
});
}
};
var _workerSelf = {
postMessage: function(data) {
workerProxy.onmessage({
data
});
}
};
function createWorker(fn) {
if (window.Worker && window.Blob && getWebWorker()) {
var blob = new Blob(["var _workerSelf = self; self.onmessage = ", fn.toString()], { type: "text/javascript" });
var url = URL.createObjectURL(blob);
return new Worker(url);
}
workerFn = fn;
return workerProxy;
}
function setupWorker() {
if (!workerInstance) {
workerInstance = createWorker(function workerStart(e) {
function dataFunctionManager() {
function completeLayers(layers, comps) {
var layerData;
var i;
var len = layers.length;
var j;
var jLen;
var k;
var kLen;
for (i = 0; i < len; i += 1) {
layerData = layers[i];
if ("ks" in layerData && !layerData.completed) {
layerData.completed = true;
if (layerData.tt) {
layers[i - 1].td = layerData.tt;
}
if (layerData.hasMask) {
var maskProps = layerData.masksProperties;
jLen = maskProps.length;
for (j = 0; j < jLen; j += 1) {
if (maskProps[j].pt.k.i) {
convertPathsToAbsoluteValues(maskProps[j].pt.k);
} else {
kLen = maskProps[j].pt.k.length;
for (k = 0; k < kLen; k += 1) {
if (maskProps[j].pt.k[k].s) {
convertPathsToAbsoluteValues(maskProps[j].pt.k[k].s[0]);
}
if (maskProps[j].pt.k[k].e) {
convertPathsToAbsoluteValues(maskProps[j].pt.k[k].e[0]);
}
}
}
}
}
if (layerData.ty === 0) {
layerData.layers = findCompLayers(layerData.refId, comps);
completeLayers(layerData.layers, comps);
} else if (layerData.ty === 4) {
completeShapes(layerData.shapes);
} else if (layerData.ty === 5) {
completeText(layerData);
}
}
}
}
function completeChars(chars, assets) {
if (chars) {
var i = 0;
var len = chars.length;
for (i = 0; i < len; i += 1) {
if (chars[i].t === 1) {
chars[i].data.layers = findCompLayers(chars[i].data.refId, assets);
completeLayers(chars[i].data.layers, assets);
}
}
}
}
function findComp(id, comps) {
var i = 0;
var len = comps.length;
while (i < len) {
if (comps[i].id === id) {
return comps[i];
}
i += 1;
}
return null;
}
function findCompLayers(id, comps) {
var comp = findComp(id, comps);
if (comp) {
if (!comp.layers.__used) {
comp.layers.__used = true;
return comp.layers;
}
return JSON.parse(JSON.stringify(comp.layers));
}
return null;
}
function completeShapes(arr) {
var i;
var len = arr.length;
var j;
var jLen;
for (i = len - 1; i >= 0; i -= 1) {
if (arr[i].ty === "sh") {
if (arr[i].ks.k.i) {
convertPathsToAbsoluteValues(arr[i].ks.k);
} else {
jLen = arr[i].ks.k.length;
for (j = 0; j < jLen; j += 1) {
if (arr[i].ks.k[j].s) {
convertPathsToAbsoluteValues(arr[i].ks.k[j].s[0]);
}
if (arr[i].ks.k[j].e) {
convertPathsToAbsoluteValues(arr[i].ks.k[j].e[0]);
}
}
}
} else if (arr[i].ty === "gr") {
completeShapes(arr[i].it);
}
}
}
function convertPathsToAbsoluteValues(path) {
var i;
var len = path.i.length;
for (i = 0; i < len; i += 1) {
path.i[i][0] += path.v[i][0];
path.i[i][1] += path.v[i][1];
path.o[i][0] += path.v[i][0];
path.o[i][1] += path.v[i][1];
}
}
function checkVersion(minimum, animVersionString) {
var animVersion = animVersionString ? animVersionString.split(".") : [100, 100, 100];
if (minimum[0] > animVersion[0]) {
return true;
}
if (animVersion[0] > minimum[0]) {
return false;
}
if (minimum[1] > animVersion[1]) {
return true;
}
if (animVersion[1] > minimum[1]) {
return false;
}
if (minimum[2] > animVersion[2]) {
return true;
}
if (animVersion[2] > minimum[2]) {
return false;
}
return null;
}
var checkText = function() {
var minimumVersion = [4, 4, 14];
function updateTextLayer(textLayer) {
var documentData = textLayer.t.d;
textLayer.t.d = {
k: [
{
s: documentData,
t: 0
}
]
};
}
function iterateLayers(layers) {
var i;
var len = layers.length;
for (i = 0; i < len; i += 1) {
if (layers[i].ty === 5) {
updateTextLayer(layers[i]);
}
}
}
return function(animationData) {
if (checkVersion(minimumVersion, animationData.v)) {
iterateLayers(animationData.layers);
if (animationData.assets) {
var i;
var len = animationData.assets.length;
for (i = 0; i < len; i += 1) {
if (animationData.assets[i].layers) {
iterateLayers(animationData.assets[i].layers);
}
}
}
}
};
}();
var checkChars = function() {
var minimumVersion = [4, 7, 99];
return function(animationData) {
if (animationData.chars && !checkVersion(minimumVersion, animationData.v)) {
var i;
var len = animationData.chars.length;
for (i = 0; i < len; i += 1) {
var charData = animationData.chars[i];
if (charData.data && charData.data.shapes) {
completeShapes(charData.data.shapes);
charData.data.ip = 0;
charData.data.op = 99999;
charData.data.st = 0;
charData.data.sr = 1;
charData.data.ks = {
p: { k: [0, 0], a: 0 },
s: { k: [100, 100], a: 0 },
a: { k: [0, 0], a: 0 },
r: { k: 0, a: 0 },
o: { k: 100, a: 0 }
};
if (!animationData.chars[i].t) {
charData.data.shapes.push({
ty: "no"
});
charData.data.shapes[0].it.push({
p: { k: [0, 0], a: 0 },
s: { k: [100, 100], a: 0 },
a: { k: [0, 0], a: 0 },
r: { k: 0, a: 0 },
o: { k: 100, a: 0 },
sk: { k: 0, a: 0 },
sa: { k: 0, a: 0 },
ty: "tr"
});
}
}
}
}
};
}();
var checkPathProperties = function() {
var minimumVersion = [5, 7, 15];
function updateTextLayer(textLayer) {
var pathData = textLayer.t.p;
if (typeof pathData.a === "number") {
pathData.a = {
a: 0,
k: pathData.a
};
}
if (typeof pathData.p === "number") {
pathData.p = {
a: 0,
k: pathData.p
};
}
if (typeof pathData.r === "number") {
pathData.r = {
a: 0,
k: pathData.r
};
}
}
function iterateLayers(layers) {
var i;
var len = layers.length;
for (i = 0; i < len; i += 1) {
if (layers[i].ty === 5) {
updateTextLayer(layers[i]);
}
}
}
return function(animationData) {
if (checkVersion(minimumVersion, animationData.v)) {
iterateLayers(animationData.layers);
if (animationData.assets) {
var i;
var len = animationData.assets.length;
for (i = 0; i < len; i += 1) {
if (animationData.assets[i].layers) {
iterateLayers(animationData.assets[i].layers);
}
}
}
}
};
}();
var checkColors = function() {
var minimumVersion = [4, 1, 9];
function iterateShapes(shapes) {
var i;
var len = shapes.length;
var j;
var jLen;
for (i = 0; i < len; i += 1) {
if (shapes[i].ty === "gr") {
iterateShapes(shapes[i].it);
} else if (shapes[i].ty === "fl" || shapes[i].ty === "st") {
if (shapes[i].c.k && shapes[i].c.k[0].i) {
jLen = shapes[i].c.k.length;
for (j = 0; j < jLen; j += 1) {
if (shapes[i].c.k[j].s) {
shapes[i].c.k[j].s[0] /= 255;
shapes[i].c.k[j].s[1] /= 255;
shapes[i].c.k[j].s[2] /= 255;
shapes[i].c.k[j].s[3] /= 255;
}
if (shapes[i].c.k[j].e) {
shapes[i].c.k[j].e[0] /= 255;
shapes[i].c.k[j].e[1] /= 255;
shapes[i].c.k[j].e[2] /= 255;
shapes[i].c.k[j].e[3] /= 255;
}
}
} else {
shapes[i].c.k[0] /= 255;
shapes[i].c.k[1] /= 255;
shapes[i].c.k[2] /= 255;
shapes[i].c.k[3] /= 255;
}
}
}
}
function iterateLayers(layers) {
var i;
var len = layers.length;
for (i = 0; i < len; i += 1) {
if (layers[i].ty === 4) {
iterateShapes(layers[i].shapes);
}
}
}
return function(animationData) {
if (checkVersion(minimumVersion, animationData.v)) {
iterateLayers(animationData.layers);
if (animationData.assets) {
var i;
var len = animationData.assets.length;
for (i = 0; i < len; i += 1) {
if (animationData.assets[i].layers) {
iterateLayers(animationData.assets[i].layers);
}
}
}
}
};
}();
var checkShapes = function() {
var minimumVersion = [4, 4, 18];
function completeClosingShapes(arr) {
var i;
var len = arr.length;
var j;
var jLen;
for (i = len - 1; i >= 0; i -= 1) {
if (arr[i].ty === "sh") {
if (arr[i].ks.k.i) {
arr[i].ks.k.c = arr[i].closed;
} else {
jLen = arr[i].ks.k.length;
for (j = 0; j < jLen; j += 1) {
if (arr[i].ks.k[j].s) {
arr[i].ks.k[j].s[0].c = arr[i].closed;
}
if (arr[i].ks.k[j].e) {
arr[i].ks.k[j].e[0].c = arr[i].closed;
}
}
}
} else if (arr[i].ty === "gr") {
completeClosingShapes(arr[i].it);
}
}
}
function iterateLayers(layers) {
var layerData;
var i;
var len = layers.length;
var j;
var jLen;
var k;
var kLen;
for (i = 0; i < len; i += 1) {
layerData = layers[i];
if (layerData.hasMask) {
var maskProps = layerData.masksProperties;
jLen = maskProps.length;
for (j = 0; j < jLen; j += 1) {
if (maskProps[j].pt.k.i) {
maskProps[j].pt.k.c = maskProps[j].cl;
} else {
kLen = maskProps[j].pt.k.length;
for (k = 0; k < kLen; k += 1) {
if (maskProps[j].pt.k[k].s) {
maskProps[j].pt.k[k].s[0].c = maskProps[j].cl;
}
if (maskProps[j].pt.k[k].e) {
maskProps[j].pt.k[k].e[0].c = maskProps[j].cl;
}
}
}
}
}
if (layerData.ty === 4) {
completeClosingShapes(layerData.shapes);
}
}
}
return function(animationData) {
if (checkVersion(minimumVersion, animationData.v)) {
iterateLayers(animationData.layers);
if (animationData.assets) {
var i;
var len = animationData.assets.length;
for (i = 0; i < len; i += 1) {
if (animationData.assets[i].layers) {
iterateLayers(animationData.assets[i].layers);
}
}
}
}
};
}();
function completeData(animationData) {
if (animationData.__complete) {
return;
}
checkColors(animationData);
checkText(animationData);
checkChars(animationData);
checkPathProperties(animationData);
checkShapes(animationData);
completeLayers(animationData.layers, animationData.assets);
completeChars(animationData.chars, animationData.assets);
animationData.__complete = true;
}
function completeText(data) {
if (data.t.a.length === 0 && !("m" in data.t.p))
;
}
var moduleOb = {};
moduleOb.completeData = completeData;
moduleOb.checkColors = checkColors;
moduleOb.checkChars = checkChars;
moduleOb.checkPathProperties = checkPathProperties;
moduleOb.checkShapes = checkShapes;
moduleOb.completeLayers = completeLayers;
return moduleOb;
}
if (!_workerSelf.dataManager) {
_workerSelf.dataManager = dataFunctionManager();
}
if (!_workerSelf.assetLoader) {
_workerSelf.assetLoader = function() {
function formatResponse(xhr) {
var contentTypeHeader = xhr.getResponseHeader("content-type");
if (contentTypeHeader && xhr.responseType === "json" && contentTypeHeader.indexOf("json") !== -1) {
return xhr.response;
}
if (xhr.response && typeof xhr.response === "object") {
return xhr.response;
}
if (xhr.response && typeof xhr.response === "string") {
return JSON.parse(xhr.response);
}
if (xhr.responseText) {
return JSON.parse(xhr.responseText);
}
return null;
}
function loadAsset(path, fullPath, callback, errorCallback) {
var response;
var xhr = new XMLHttpRequest();
try {
xhr.responseType = "json";
} catch (err) {
}
xhr.onreadystatechange = function() {
if (xhr.readyState === 4) {
if (xhr.status === 200) {
response = formatResponse(xhr);
callback(response);
} else {
try {
response = formatResponse(xhr);
callback(response);
} catch (err) {
if (errorCallback) {
errorCallback(err);
}
}
}
}
};
try {
xhr.open("GET", path, true);
} catch (error) {
xhr.open("GET", fullPath + "/" + path, true);
}
xhr.send();
}
return {
load: loadAsset
};
}();
}
if (e.data.type === "loadAnimation") {
_workerSelf.assetLoader.load(
e.data.path,
e.data.fullPath,
function(data) {
_workerSelf.dataManager.completeData(data);
_workerSelf.postMessage({
id: e.data.id,
payload: data,
status: "success"
});
},
function() {
_workerSelf.postMessage({
id: e.data.id,
status: "error"
});
}
);
} else if (e.data.type === "complete") {
var animation = e.data.animation;
_workerSelf.dataManager.completeData(animation);
_workerSelf.postMessage({
id: e.data.id,
payload: animation,
status: "success"
});
} else if (e.data.type === "loadData") {
_workerSelf.assetLoader.load(
e.data.path,
e.data.fullPath,
function(data) {
_workerSelf.postMessage({
id: e.data.id,
payload: data,
status: "success"
});
},
function() {
_workerSelf.postMessage({
id: e.data.id,
status: "error"
});
}
);
}
});
workerInstance.onmessage = function(event) {
var data = event.data;
var id = data.id;
var process = processes[id];
processes[id] = null;
if (data.status === "success") {
process.onComplete(data.payload);
} else if (process.onError) {
process.onError();
}
};
}
}
function createProcess(onComplete, onError) {
_counterId += 1;
var id = "processId_" + _counterId;
processes[id] = {
onComplete,
onError
};
return id;
}
function loadAnimation2(path, onComplete, onError) {
setupWorker();
var processId = createProcess(onComplete, onError);
workerInstance.postMessage({
type: "loadAnimation",
path,
fullPath: window.location.origin + window.location.pathname,
id: processId
});
}
function loadData(path, onComplete, onError) {
setupWorker();
var processId = createProcess(onComplete, onError);
workerInstance.postMessage({
type: "loadData",
path,
fullPath: window.location.origin + window.location.pathname,
id: processId
});
}
function completeAnimation(anim, onComplete, onError) {
setupWorker();
var processId = createProcess(onComplete, onError);
workerInstance.postMessage({
type: "complete",
animation: anim,
id: processId
});
}
return {
loadAnimation: loadAnimation2,
loadData,
completeAnimation
};
}();
const ImagePreloader = function() {
var proxyImage = function() {
var canvas = createTag("canvas");
canvas.width = 1;
canvas.height = 1;
var ctx = canvas.getContext("2d");
ctx.fillStyle = "rgba(0,0,0,0)";
ctx.fillRect(0, 0, 1, 1);
return canvas;
}();
function imageLoaded() {
this.loadedAssets += 1;
if (this.loadedAssets === this.totalImages && this.loadedFootagesCount === this.totalFootages) {
if (this.imagesLoadedCb) {
this.imagesLoadedCb(null);
}
}
}
function footageLoaded() {
this.loadedFootagesCount += 1;
if (this.loadedAssets === this.totalImages && this.loadedFootagesCount === this.totalFootages) {
if (this.imagesLoadedCb) {
this.imagesLoadedCb(null);
}
}
}
function getAssetsPath(assetData, assetsPath, originalPath) {
var path = "";
if (assetData.e) {
path = assetData.p;
} else if (assetsPath) {
var imagePath = assetData.p;
if (imagePath.indexOf("images/") !== -1) {
imagePath = imagePath.split("/")[1];
}
path = assetsPath + imagePath;
} else {
path = originalPath;
path += assetData.u ? assetData.u : "";
path += assetData.p;
}
return path;
}
function testImageLoaded(img) {
var _count = 0;
var intervalId = setInterval(
function() {
var box = img.getBBox();
if (box.width || _count > 500) {
this._imageLoaded();
clearInterval(intervalId);
}
_count += 1;
}.bind(this),
50
);
}
function createImageData(assetData) {
var path = getAssetsPath(assetData, this.assetsPath, this.path);
var img = createNS("image");
if (isSafari) {
this.testImageLoaded(img);
} else {
img.addEventListener("load", this._imageLoaded, false);
}
img.addEventListener(
"error",
function() {
ob.img = proxyImage;
this._imageLoaded();
}.bind(this),
false
);
img.setAttributeNS("http://www.w3.org/1999/xlink", "href", path);
if (this._elementHelper.append) {
this._elementHelper.append(img);
} else {
this._elementHelper.appendChild(img);
}
var ob = {
img,
assetData
};
return ob;
}
function createImgData(assetData) {
var path = getAssetsPath(assetData, this.assetsPath, this.path);
var img = createTag("img");
img.crossOrigin = "anonymous";
img.addEventListener("load", this._imageLoaded, false);
img.addEventListener(
"error",
function() {
ob.img = proxyImage;
this._imageLoaded();
}.bind(this),
false
);
img.src = path;
var ob = {
img,
assetData
};
return ob;
}
function createFootageData(data) {
var ob = {
assetData: data
};
var path = getAssetsPath(data, this.assetsPath, this.path);
dataManager.loadData(
path,
function(footageData) {
ob.img = footageData;
this._footageLoaded();
}.bind(this),
function() {
ob.img = {};
this._footageLoaded();
}.bind(this)
);
return ob;
}
function loadAssets(assets, cb) {
this.imagesLoadedCb = cb;
var i;
var len = assets.length;
for (i = 0; i < len; i += 1) {
if (!assets[i].layers) {
if (!assets[i].t || assets[i].t === "seq") {
this.totalImages += 1;
this.images.push(this._createImageData(assets[i]));
} else if (assets[i].t === 3) {
this.totalFootages += 1;
this.images.push(this.createFootageData(assets[i]));
}
}
}
}
function setPath(path) {
this.path = path || "";
}
function setAssetsPath(path) {
this.assetsPath = path || "";
}
function getAsset(assetData) {
var i = 0;
var len = this.images.length;
while (i < len) {
if (this.images[i].assetData === assetData) {
return this.images[i].img;
}
i += 1;
}
return null;
}
function destroy() {
this.imagesLoadedCb = null;
this.images.length = 0;
}
function loadedImages() {
return this.totalImages === this.loadedAssets;
}
function loadedFootages() {
return this.totalFootages === this.loadedFootagesCount;
}
function setCacheType(type, elementHelper) {
if (type === "svg") {
this._elementHelper = elementHelper;
this._createImageData = this.createImageData.bind(this);
} else {
this._createImageData = this.createImgData.bind(this);
}
}
function ImagePreloaderFactory() {
this._imageLoaded = imageLoaded.bind(this);
this._footageLoaded = footageLoaded.bind(this);
this.testImageLoaded = testImageLoaded.bind(this);
this.createFootageData = createFootageData.bind(this);
this.assetsPath = "";
this.path = "";
this.totalImages = 0;
this.totalFootages = 0;
this.loadedAssets = 0;
this.loadedFootagesCount = 0;
this.imagesLoadedCb = null;
this.images = [];
}
ImagePreloaderFactory.prototype = {
loadAssets,
setAssetsPath,
setPath,
loadedImages,
loadedFootages,
destroy,
getAsset,
createImgData,
createImageData,
imageLoaded,
footageLoaded,
setCacheType
};
return ImagePreloaderFactory;
}();
function BaseEvent() {
}
BaseEvent.prototype = {
triggerEvent: function(eventName, args) {
if (this._cbs[eventName]) {
var callbacks = this._cbs[eventName];
for (var i = 0; i < callbacks.length; i += 1) {
callbacks[i](args);
}
}
},
addEventListener: function(eventName, callback) {
if (!this._cbs[eventName]) {
this._cbs[eventName] = [];
}
this._cbs[eventName].push(callback);
return function() {
this.removeEventListener(eventName, callback);
}.bind(this);
},
removeEventListener: function(eventName, callback) {
if (!callback) {
this._cbs[eventName] = null;
} else if (this._cbs[eventName]) {
var i = 0;
var len = this._cbs[eventName].length;
while (i < len) {
if (this._cbs[eventName][i] === callback) {
this._cbs[eventName].splice(i, 1);
i -= 1;
len -= 1;
}
i += 1;
}
if (!this._cbs[eventName].length) {
this._cbs[eventName] = null;
}
}
}
};
const markerParser = function() {
function parsePayloadLines(payload) {
var lines = payload.split("\r\n");
var keys = {};
var line;
var keysCount = 0;
for (var i = 0; i < lines.length; i += 1) {
line = lines[i].split(":");
if (line.length === 2) {
keys[line[0]] = line[1].trim();
keysCount += 1;
}
}
if (keysCount === 0) {
throw new Error();
}
return keys;
}
return function(_markers) {
var markers = [];
for (var i = 0; i < _markers.length; i += 1) {
var _marker = _markers[i];
var markerData = {
time: _marker.tm,
duration: _marker.dr
};
try {
markerData.payload = JSON.parse(_markers[i].cm);
} catch (_) {
try {
markerData.payload = parsePayloadLines(_markers[i].cm);
} catch (__) {
markerData.payload = {
name: _markers[i].cm
};
}
}
markers.push(markerData);
}
return markers;
};
}();
const ProjectInterface = function() {
function registerComposition(comp) {
this.compositions.push(comp);
}
return function() {
function _thisProjectFunction(name) {
var i = 0;
var len = this.compositions.length;
while (i < len) {
if (this.compositions[i].data && this.compositions[i].data.nm === name) {
if (this.compositions[i].prepareFrame && this.compositions[i].data.xt) {
this.compositions[i].prepareFrame(this.currentFrame);
}
return this.compositions[i].compInterface;
}
i += 1;
}
return null;
}
_thisProjectFunction.compositions = [];
_thisProjectFunction.currentFrame = 0;
_thisProjectFunction.registerComposition = registerComposition;
return _thisProjectFunction;
};
}();
const renderers = {};
const registerRenderer = (key, value) => {
renderers[key] = value;
};
function getRenderer(key) {
return renderers[key];
}
const AnimationItem = function() {
this._cbs = [];
this.name = "";
this.path = "";
this.isLoaded = false;
this.currentFrame = 0;
this.currentRawFrame = 0;
this.firstFrame = 0;
this.totalFrames = 0;
this.frameRate = 0;
this.frameMult = 0;
this.playSpeed = 1;
this.playDirection = 1;
this.playCount = 0;
this.animationData = {};
this.assets = [];
this.isPaused = true;
this.autoplay = false;
this.loop = true;
this.renderer = null;
this.animationID = createElementID();
this.assetsPath = "";
this.timeCompleted = 0;
this.segmentPos = 0;
this.isSubframeEnabled = getSubframeEnabled();
this.segments = [];
this._idle = true;
this._completedLoop = false;
this.projectInterface = ProjectInterface();
this.imagePreloader = new ImagePreloader();
this.audioController = audioControllerFactory();
this.markers = [];
this.configAnimation = this.configAnimation.bind(this);
this.onSetupError = this.onSetupError.bind(this);
this.onSegmentComplete = this.onSegmentComplete.bind(this);
this.drawnFrameEvent = new BMEnterFrameEvent("drawnFrame", 0, 0, 0);
};
extendPrototype([BaseEvent], AnimationItem);
AnimationItem.prototype.setParams = function(params) {
if (params.wrapper || params.container) {
this.wrapper = params.wrapper || params.container;
}
var animType = "svg";
if (params.animType) {
animType = params.animType;
} else if (params.renderer) {
animType = params.renderer;
}
const RendererClass = getRenderer(animType);
this.renderer = new RendererClass(this, params.rendererSettings);
this.imagePreloader.setCacheType(animType, this.renderer.globalData.defs);
this.renderer.setProjectInterface(this.projectInterface);
this.animType = animType;
if (params.loop === "" || params.loop === null || params.loop === void 0 || params.loop === true) {
this.loop = true;
} else if (params.loop === false) {
this.loop = false;
} else {
this.loop = parseInt(params.loop, 10);
}
this.autoplay = "autoplay" in params ? params.autoplay : true;
this.name = params.name ? params.name : "";
this.autoloadSegments = Object.prototype.hasOwnProperty.call(params, "autoloadSegments") ? params.autoloadSegments : true;
this.assetsPath = params.assetsPath;
this.initialSegment = params.initialSegment;
if (params.audioFactory) {
this.audioController.setAudioFactory(params.audioFactory);
}
if (params.animationData) {
this.setupAnimation(params.animationData);
} else if (params.path) {
if (params.path.lastIndexOf("\\") !== -1) {
this.path = params.path.substr(0, params.path.lastIndexOf("\\") + 1);
} else {
this.path = params.path.substr(0, params.path.lastIndexOf("/") + 1);
}
this.fileName = params.path.substr(params.path.lastIndexOf("/") + 1);
this.fileName = this.fileName.substr(0, this.fileName.lastIndexOf(".json"));
dataManager.loadAnimation(params.path, this.configAnimation, this.onSetupError);
}
};
AnimationItem.prototype.onSetupError = function() {
this.trigger("data_failed");
};
AnimationItem.prototype.setupAnimation = function(data) {
dataManager.completeAnimation(data, this.configAnimation);
};
AnimationItem.prototype.setData = function(wrapper, animationData) {
if (animationData) {
if (typeof animationData !== "object") {
animationData = JSON.parse(animationData);
}
}
var params = {
wrapper,
animationData
};
var wrapperAttributes = wrapper.attributes;
params.path = wrapperAttributes.getNamedItem("data-animation-path") ? wrapperAttributes.getNamedItem("data-animation-path").value : wrapperAttributes.getNamedItem("data-bm-path") ? wrapperAttributes.getNamedItem("data-bm-path").value : wrapperAttributes.getNamedItem("bm-path") ? wrapperAttributes.getNamedItem("bm-path").value : "";
params.animType = wrapperAttributes.getNamedItem("data-anim-type") ? wrapperAttributes.getNamedItem("data-anim-type").value : wrapperAttributes.getNamedItem("data-bm-type") ? wrapperAttributes.getNamedItem("data-bm-type").value : wrapperAttributes.getNamedItem("bm-type") ? wrapperAttributes.getNamedItem("bm-type").value : wrapperAttributes.getNamedItem("data-bm-renderer") ? wrapperAttributes.getNamedItem("data-bm-renderer").value : wrapperAttributes.getNamedItem("bm-renderer") ? wrapperAttributes.getNamedItem("bm-renderer").value : "canvas";
var loop = wrapperAttributes.getNamedItem("data-anim-loop") ? wrapperAttributes.getNamedItem("data-anim-loop").value : wrapperAttributes.getNamedItem("data-bm-loop") ? wrapperAttributes.getNamedItem("data-bm-loop").value : wrapperAttributes.getNamedItem("bm-loop") ? wrapperAttributes.getNamedItem("bm-loop").value : "";
if (loop === "false") {
params.loop = false;
} else if (loop === "true") {
params.loop = true;
} else if (loop !== "") {
params.loop = parseInt(loop, 10);
}
var autoplay = wrapperAttributes.getNamedItem("data-anim-autoplay") ? wrapperAttributes.getNamedItem("data-anim-autoplay").value : wrapperAttributes.getNamedItem("data-bm-autoplay") ? wrapperAttributes.getNamedItem("data-bm-autoplay").value : wrapperAttributes.getNamedItem("bm-autoplay") ? wrapperAttributes.getNamedItem("bm-autoplay").value : true;
params.autoplay = autoplay !== "false";
params.name = wrapperAttributes.getNamedItem("data-name") ? wrapperAttributes.getNamedItem("data-name").value : wrapperAttributes.getNamedItem("data-bm-name") ? wrapperAttributes.getNamedItem("data-bm-name").value : wrapperAttributes.getNamedItem("bm-name") ? wrapperAttributes.getNamedItem("bm-name").value : "";
var prerender = wrapperAttributes.getNamedItem("data-anim-prerender") ? wrapperAttributes.getNamedItem("data-anim-prerender").value : wrapperAttributes.getNamedItem("data-bm-prerender") ? wrapperAttributes.getNamedItem("data-bm-prerender").value : wrapperAttributes.getNamedItem("bm-prerender") ? wrapperAttributes.getNamedItem("bm-prerender").value : "";
if (prerender === "false") {
params.prerender = false;
}
this.setParams(params);
};
AnimationItem.prototype.includeLayers = function(data) {
if (data.op > this.animationData.op) {
this.animationData.op = data.op;
this.totalFrames = Math.floor(data.op - this.animationData.ip);
}
var layers = this.animationData.layers;
var i;
var len = layers.length;
var newLayers = data.layers;
var j;
var jLen = newLayers.length;
for (j = 0; j < jLen; j += 1) {
i = 0;
while (i < len) {
if (layers[i].id === newLayers[j].id) {
layers[i] = newLayers[j];
break;
}
i += 1;
}
}
if (data.chars || data.fonts) {
this.renderer.globalData.fontManager.addChars(data.chars);
this.renderer.globalData.fontManager.addFonts(data.fonts, this.renderer.globalData.defs);
}
if (data.assets) {
len = data.assets.length;
for (i = 0; i < len; i += 1) {
this.animationData.assets.push(data.assets[i]);
}
}
this.animationData.__complete = false;
dataManager.completeAnimation(this.animationData, this.onSegmentComplete);
};
AnimationItem.prototype.onSegmentComplete = function(data) {
this.animationData = data;
var expressionsPlugin2 = getExpressionsPlugin();
if (expressionsPlugin2) {
expressionsPlugin2.initExpressions(this);
}
this.loadNextSegment();
};
AnimationItem.prototype.loadNextSegment = function() {
var segments = this.animationData.segments;
if (!segments || segments.length === 0 || !this.autoloadSegments) {
this.trigger("data_ready");
this.timeCompleted = this.totalFrames;
return;
}
var