Question

First of all, this code, as ugly as it is, works, for all intents and purposes. However, it really makes me both sick and mad to look at.

For the lazy, the main portion of the code that sucks is this:

setTimeout(function() {
    toggle(); //off
    setTimeout(function() {
        toggle(); //on
        setTimeout(function() {
            toggle(); //off
            setTimeout(function() {
                toggle(); //on, stays for stallTime
                setTimeout(function() {
                    toggle(); //off
                    callback();
                }, stallTime);
            }, 300);
        }, 300);
    }, 300);
}, 300);

I would, of course, love to control my animations just by changing the CSS class on an element. However, transitionend and webkitTransitionEnd and the like are not reliable in the least. Am I forced to resorting to this kind of hideous code? Ideally I’d like to be able to set a variable number of “flashes”, but this code is too stodgy for that.

Please rescue me from my filth.

Answer 1

var count = 5;
var i = setInterval(function() {
    toggle();
    count--;
    if(count == 0) {
        clearInterval(i);
        callback();
    }
}, 300);