Keyframe rules are not deleted #34

Open
maciej-franecki opened this Issue Aug 9, 2012 · 0 comments

Projects

None yet

1 participant

@maciej-franecki

I just found out that Alice.js does not always delete the keyframe rules it creates.
Alice.js uses the "webkitAnimationEnd" event to clear the keyframes rules it created and inserted to the css document. Unfortunately this event isn't fired after every animation completion - at least on my playbook (same story with webkitTransitionEnd event).

To fix this issue I've changed a few lines starting from the line: 234 in alice.cheshire.js so it's using setTimeout insted, like so:
// Add listener to clear animation after it's done
//if ("MozAnimation" in elem.style) {
// elem.addEventListener("animationend", alice.clearAnimation, false);
//}
//else {
// elem.addEventListener(alice.prefixJS + "AnimationEnd", alice.clearAnimation, false);
//}
setTimeout(function () {
alice.clearAnimation2(elem, animId);
}, parseInt(calc.delay) + parseInt(calc.duration));

And in alice.core.js added a method "clearAnimation2":
clearAnimation2: function (elem, animId) {
elem.style[alice.prefixJS + "AnimationName"] = "";
elem.style[alice.prefixJS + "AnimationDelay"] = "";
elem.style[alice.prefixJS + "AnimationDuration"] = "";
elem.style[alice.prefixJS + "AnimationTimingFunction"] = "";
elem.style[alice.prefixJS + "AnimationIterationCount"] = "";
elem.style[alice.prefixJS + "AnimationDirection"] = "";
elem.style[alice.prefixJS + "AnimationPlayState"] = "";

alice.keyframeDelete(animId);

return;

},

After those modifications I have the same number of css rules insertions and deletes.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment