Function executeElementAnimation

src/js/WinJS/Animations/_TransitionAnimation.js:275–349

(elem, index, anims, promises, animate)

    };

    function executeElementAnimation(elem, index, anims, promises, animate) {
        if (animate && anims.length > 0) {
            var style = elem.style;
            var id = _ElementUtilities._uniqueID(elem);
            anims = anims.map(copyWithEvaluation(index, elem));
            var styleElem;
            var listener = elem.disabled ? _Global.document : elem;
            anims.forEach(function (anim) {
                if (!anim.keyframe) {
                    if (!styleElem) {
                        styleElem = _Global.document.createElement("STYLE");
                        _Global.document.documentElement.appendChild(styleElem);
                    }
                    anim.keyframe = getUniqueKeyframeName();
                    var kf = "@" + browserStyleEquivalents["keyframes"] + " " + anim.keyframe + " { from {" + anim.property + ":" + anim.from + ";} to {" + anim.property + ":" + anim.to + ";}}";
                    styleElem.sheet.insertRule(kf, 0);
                } else {
                    anim.keyframe = browserStyleEquivalents.animationPrefix + anim.keyframe;
                }
            });
            var styleCache = setTemporaryStyles(elem, id, style, anims, elementAnimationProperties),
                animationsToCleanUp = [],
                animationPromises = [];
            anims.forEach(function (anim) {
                var finish;
                animationPromises.push(new Promise(function (c) {
                    finish = function (reason) {
                        if (onAnimationEnd) {
                            listener.removeEventListener(_BaseUtils._browserEventEquivalents["animationEnd"], onAnimationEnd, false);
                            _Global.clearTimeout(timeoutId);
                            onAnimationEnd = null;
                        }
                        completePromise(c, reason === reason_canceled);
                    };

                    var onAnimationEnd = function (event) {
                        if (event.target === elem && event.animationName === anim.keyframe) {
                            finish();
                        }
                    };

                    registerAction(id, anim.property, finish);
                    // Firefox will stop all animations if we clean up that animation's properties when there're other CSS animations still running
                    // on an element. To work around this, we delay animation style cleanup until all parts of an animation finish.
                    animationsToCleanUp.push({
                        id: id,
                        property: anim.property,
                        style: style,
                        keyframe: anim.keyframe
                    });
                    var timeoutId = _Global.setTimeout(function () {
                        timeoutId = _Global.setTimeout(finish, anim.delay + anim.duration);
                    }, 50);
                    listener.addEventListener(_BaseUtils._browserEventEquivalents["animationEnd"], onAnimationEnd, false);
                }, function () { finish(reason_canceled); }));
            });
            if (styleElem) {
                _Global.setTimeout(function () {