JQuerry Deferred

[alexandr2006]

Имеется 3 блока по горизонтали, в которые надо запихать блоки с новостями. Новостные блоки разной высоты, подгружаются ajax, число подгружаемых блоков ограничено (т.е. нельзя за один проход подгрузить новости на всю страницу)

function load_elem(items){
if (app.calcul) return;

app.calcul = true;

var promise = $.when();
$.each(items, function(index, item){
    promise = promise.then(function(){
        return $.getJSON(item.url);
    }).then(function(data){

        $('#'+item.id).append(Mustache.render($('#'+item.template).html(),view));
        //*****
    });
});
promise.then(function(){
    console.log('OK');
    app.calcul = false;
});
}

Исходные данные

    var items_collection = [{
        "id" : "mini-article",
        "template" : "mini-article-template",
        "url" : "bla-bla",
        "autocomplete": false // - значит новости не нужно подгружать до конца страницы
    },
    {
        "id" : "popular-lists",
        "template" : "popular-lists-template",
        "url" : "bla-bla",
        "autocomplete": true  
    },
    {
        "id" : "pic-day-lists",
        "template" : "pic-day-lists-template",
        "url" : "bla-bla",
        "autocomplete": true   
    }];

Запуск:

    load_elem([items_collection[0], items_collection[1], items_collection[2]]);

И вот я не пойму как сделать, чтобы там, где //***** - в случае если есть свободное место под новости и utocomplete=true, запускался бы этот же запрос и пока он не выполнился - никакие другие новости не подгружались бы, а потом наступал черед items_collection[1] и по аналогии..