JSFiddle - React, Tailwind, and code Playground
HTML
<script src="http://underscorejs.org/underscore.js"></script>
<div id="proggie"></div>
<div id="console"></div>
JavaScript
function executePromiseQueueSync(queue, beacon){
var seed = $.Deferred(),
le = queue.length,
memo = seed.promise();
function do_iter (memo, ent, ind){
// close beacon, le
var df = $.Deferred(); // new deferred
df.then(function(){
console.log("DBG proggie");
beacon.notify((ind+1)/le*100, "done task "+(ind+1)+"/"+le);
});
df.progress(function(pct, msg){
beacon.notify((ind+1)/le*100 - (100-pct)/le, msg );
});
console.log("DBG hook funk "+ind);
memo.then(function(){
console.log("DBG exec func "+ind);
var dff = ent.funct.apply(null, ent.argmnt);
if (dff && dff.done) { // jic ducking
// func returnes a deferred, she will notify us
dff.done(df.resolve)
.progress(df.notify);
}
else {
df.resolve();
}
});
return df.promise();
} // do_iter
beacon.notify(0); // proggie 0
for (var i=0,l=queue.length; i<l; i++) {
memo = do_iter(memo, queue[i], i);
}
memo.then(function(){
beacon.resolve(100)
});
// all hooked
seed.resolve(); // trigger
return beacon.promise();
}
function x(){
// do stuff
console.log("blah");
}
function y(){
var df = $.Deferred();
// do a log deferred proccess
function setProgF(topct, msg){
return function(){
df.notify(topct, msg);
}
}
setTimeout(setProgF(10, "drawing holder"),300);
setTimeout(setProgF(30, "downloading assets"),600);
setTimeout(setProgF(50, "setting sound system"),900);
setTimeout(setProgF(60, "hooking up user events"),1200);
setTimeout(setProgF(70, "loading sprites"),1400);
setTimeout(setProgF(90, "setting preferences"),1700);
setTimeout(function(){
setProgF(100, "initialize ok");
...