You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
249 lines
6.1 KiB
249 lines
6.1 KiB
import createTag from '../utils/helpers/html_elements';
|
|
import AnimationItem from './AnimationItem';
|
|
|
|
const animationManager = (function () {
|
|
var moduleOb = {};
|
|
var registeredAnimations = [];
|
|
var initTime = 0;
|
|
var len = 0;
|
|
var playingAnimationsNum = 0;
|
|
var _stopped = true;
|
|
var _isFrozen = false;
|
|
|
|
function removeElement(ev) {
|
|
var i = 0;
|
|
var animItem = ev.target;
|
|
while (i < len) {
|
|
if (registeredAnimations[i].animation === animItem) {
|
|
registeredAnimations.splice(i, 1);
|
|
i -= 1;
|
|
len -= 1;
|
|
if (!animItem.isPaused) {
|
|
subtractPlayingCount();
|
|
}
|
|
}
|
|
i += 1;
|
|
}
|
|
}
|
|
|
|
function registerAnimation(element, animationData) {
|
|
if (!element) {
|
|
return null;
|
|
}
|
|
var i = 0;
|
|
while (i < len) {
|
|
if (registeredAnimations[i].elem === element && registeredAnimations[i].elem !== null) {
|
|
return registeredAnimations[i].animation;
|
|
}
|
|
i += 1;
|
|
}
|
|
var animItem = new AnimationItem();
|
|
setupAnimation(animItem, element);
|
|
animItem.setData(element, animationData);
|
|
return animItem;
|
|
}
|
|
|
|
function getRegisteredAnimations() {
|
|
var i;
|
|
var lenAnims = registeredAnimations.length;
|
|
var animations = [];
|
|
for (i = 0; i < lenAnims; i += 1) {
|
|
animations.push(registeredAnimations[i].animation);
|
|
}
|
|
return animations;
|
|
}
|
|
|
|
function addPlayingCount() {
|
|
playingAnimationsNum += 1;
|
|
activate();
|
|
}
|
|
|
|
function subtractPlayingCount() {
|
|
playingAnimationsNum -= 1;
|
|
}
|
|
|
|
function setupAnimation(animItem, element) {
|
|
animItem.addEventListener('destroy', removeElement);
|
|
animItem.addEventListener('_active', addPlayingCount);
|
|
animItem.addEventListener('_idle', subtractPlayingCount);
|
|
registeredAnimations.push({ elem: element, animation: animItem });
|
|
len += 1;
|
|
}
|
|
|
|
function loadAnimation(params) {
|
|
var animItem = new AnimationItem();
|
|
setupAnimation(animItem, null);
|
|
animItem.setParams(params);
|
|
return animItem;
|
|
}
|
|
|
|
function setSpeed(val, animation) {
|
|
var i;
|
|
for (i = 0; i < len; i += 1) {
|
|
registeredAnimations[i].animation.setSpeed(val, animation);
|
|
}
|
|
}
|
|
|
|
function setDirection(val, animation) {
|
|
var i;
|
|
for (i = 0; i < len; i += 1) {
|
|
registeredAnimations[i].animation.setDirection(val, animation);
|
|
}
|
|
}
|
|
|
|
function play(animation) {
|
|
var i;
|
|
for (i = 0; i < len; i += 1) {
|
|
registeredAnimations[i].animation.play(animation);
|
|
}
|
|
}
|
|
function resume(nowTime) {
|
|
var elapsedTime = nowTime - initTime;
|
|
var i;
|
|
for (i = 0; i < len; i += 1) {
|
|
registeredAnimations[i].animation.advanceTime(elapsedTime);
|
|
}
|
|
initTime = nowTime;
|
|
if (playingAnimationsNum && !_isFrozen) {
|
|
window.requestAnimationFrame(resume);
|
|
} else {
|
|
_stopped = true;
|
|
}
|
|
}
|
|
|
|
function first(nowTime) {
|
|
initTime = nowTime;
|
|
window.requestAnimationFrame(resume);
|
|
}
|
|
|
|
function pause(animation) {
|
|
var i;
|
|
for (i = 0; i < len; i += 1) {
|
|
registeredAnimations[i].animation.pause(animation);
|
|
}
|
|
}
|
|
|
|
function goToAndStop(value, isFrame, animation) {
|
|
var i;
|
|
for (i = 0; i < len; i += 1) {
|
|
registeredAnimations[i].animation.goToAndStop(value, isFrame, animation);
|
|
}
|
|
}
|
|
|
|
function stop(animation) {
|
|
var i;
|
|
for (i = 0; i < len; i += 1) {
|
|
registeredAnimations[i].animation.stop(animation);
|
|
}
|
|
}
|
|
|
|
function togglePause(animation) {
|
|
var i;
|
|
for (i = 0; i < len; i += 1) {
|
|
registeredAnimations[i].animation.togglePause(animation);
|
|
}
|
|
}
|
|
|
|
function destroy(animation) {
|
|
var i;
|
|
for (i = (len - 1); i >= 0; i -= 1) {
|
|
registeredAnimations[i].animation.destroy(animation);
|
|
}
|
|
}
|
|
|
|
function searchAnimations(animationData, standalone, renderer) {
|
|
var animElements = [].concat([].slice.call(document.getElementsByClassName('lottie')),
|
|
[].slice.call(document.getElementsByClassName('bodymovin')));
|
|
var i;
|
|
var lenAnims = animElements.length;
|
|
for (i = 0; i < lenAnims; i += 1) {
|
|
if (renderer) {
|
|
animElements[i].setAttribute('data-bm-type', renderer);
|
|
}
|
|
registerAnimation(animElements[i], animationData);
|
|
}
|
|
if (standalone && lenAnims === 0) {
|
|
if (!renderer) {
|
|
renderer = 'svg';
|
|
}
|
|
var body = document.getElementsByTagName('body')[0];
|
|
body.innerText = '';
|
|
var div = createTag('div');
|
|
div.style.width = '100%';
|
|
div.style.height = '100%';
|
|
div.setAttribute('data-bm-type', renderer);
|
|
body.appendChild(div);
|
|
registerAnimation(div, animationData);
|
|
}
|
|
}
|
|
|
|
function resize() {
|
|
var i;
|
|
for (i = 0; i < len; i += 1) {
|
|
registeredAnimations[i].animation.resize();
|
|
}
|
|
}
|
|
|
|
function activate() {
|
|
if (!_isFrozen && playingAnimationsNum) {
|
|
if (_stopped) {
|
|
window.requestAnimationFrame(first);
|
|
_stopped = false;
|
|
}
|
|
}
|
|
}
|
|
|
|
function freeze() {
|
|
_isFrozen = true;
|
|
}
|
|
|
|
function unfreeze() {
|
|
_isFrozen = false;
|
|
activate();
|
|
}
|
|
|
|
function setVolume(val, animation) {
|
|
var i;
|
|
for (i = 0; i < len; i += 1) {
|
|
registeredAnimations[i].animation.setVolume(val, animation);
|
|
}
|
|
}
|
|
|
|
function mute(animation) {
|
|
var i;
|
|
for (i = 0; i < len; i += 1) {
|
|
registeredAnimations[i].animation.mute(animation);
|
|
}
|
|
}
|
|
|
|
function unmute(animation) {
|
|
var i;
|
|
for (i = 0; i < len; i += 1) {
|
|
registeredAnimations[i].animation.unmute(animation);
|
|
}
|
|
}
|
|
|
|
moduleOb.registerAnimation = registerAnimation;
|
|
moduleOb.loadAnimation = loadAnimation;
|
|
moduleOb.setSpeed = setSpeed;
|
|
moduleOb.setDirection = setDirection;
|
|
moduleOb.play = play;
|
|
moduleOb.pause = pause;
|
|
moduleOb.stop = stop;
|
|
moduleOb.togglePause = togglePause;
|
|
moduleOb.searchAnimations = searchAnimations;
|
|
moduleOb.resize = resize;
|
|
// moduleOb.start = start;
|
|
moduleOb.goToAndStop = goToAndStop;
|
|
moduleOb.destroy = destroy;
|
|
moduleOb.freeze = freeze;
|
|
moduleOb.unfreeze = unfreeze;
|
|
moduleOb.setVolume = setVolume;
|
|
moduleOb.mute = mute;
|
|
moduleOb.unmute = unmute;
|
|
moduleOb.getRegisteredAnimations = getRegisteredAnimations;
|
|
return moduleOb;
|
|
}());
|
|
|
|
export default animationManager;
|