Promises and resolving Array of Deferreds

by spring1975

HTML

<button class="start">start</button>
<button class="resolveLast">resolve last</button>
<button class="resolveNextToLast">resolve next to last</button>
<button class="resolveOldest">revolve oldest</button>
<button class="resolveAll">resolve all</button>
<button class="third">Third</button>
<div class="output">nothing setup yet</div>
<ul class="deferredList"></ul>

JavaScript

var x = [],
    p = [],
    e = {};

e.deferredArray = [];

if (!jQuery.when.all) {
    jQuery.when.all = function(deferreds) {
        var deferred = new jQuery.Deferred();
        $.when.apply(jQuery, deferreds).then(
            function() {
                deferred.resolve(Array.prototype.slice.call(arguments));
            },
            function() {
                deferred.fail(Array.prototype.slice.call(arguments));
            });

        return deferred;
    }
}

function setupPromise(){
    var dfd = new $.Deferred();
    x.push(dfd);
    if (x.length == 2){
        e.deferredArray.push(dfd);
    }
    p.push(dfd.promise());
    return dfd.promise();
}

function resolveOldestDeferred(){
   for (var i = 0; i < x.length; i++) {
        if (x[i].state() === 'pending'){
            x[i].resolve();
            break;
        }
    }

    showStatuses();
}

function resolveThird(){
    e.deferredArray[0].resolve();

    showStatuses();
}
        
function resolveLastDeferred(){
    x[x.length-1].resolve();
    showStatuses();
}

function resolveNextToLastDeferred(){
   for (var i = (x.length-1); i < x.length; i--) {
        if (x[i].state() === 'pending'){
            x[i].resolve();
            break;
        }
    }

    showStatuses();
}

function resolveAll(){
    $.each(x, function(){
        this.resolve();
    });
    showStatuses();
}

function showStatuses() {
    $('.deferredList').html('');

    for (i = 0; i < x.length; i++) {
        var s = x[i].state(),
            item = $('<li>').text(s);
        
        $('.deferredList').append(item);
    }
}

function go(){
    setupPromise();
       
    $.when.all(x)
        .done(function(){
            $.when.all(x)
                .done(function(){
                    $('.output').text('done');
                });
        });
    
    showStatuses();
}

$('document').ready(function() {
    $('.start').click(function(){
       $('.output').text('started again');
        go();
    });
    
   ...