Thread.js

source

var el = document.querySelector("#progressBar");

var isRunning = false;
function progressSample(){
    if(isRunning){
        return;
    }
    isRunning = true;
    el.textContent = "";
    var thread = new Thread(function(){
        for(var i = 0; i <= 100; i++){
            for(var j = 0; j < 10000000; j++){
                // .. Very slow processing
            }
            notify(i); 
        }
    });
    
    thread.once().progress(function(i){
        updateProgress(i);
    }).done(function(){
        el.textContent = "done!!";
        isRunning = false;
    });
}

function updateProgress(i){
    el.style.width = i + "%";
}