click to reach 100% with a progress bar / html5 canvas

create a bar movieclip that contains a fill movieclip (with bottom or left scale point) and a button b:

var emptyRate = -.005;  // more neg, quicker it empties
var fillRate = .1;  // more pos, quicker it fills
this.bar.fill.scaleY = 0;
var tl = this;

this.b.addEventListener("click",clickF);
createjs.Ticker.addEventListener("tick", tickF);

function clickF(){
fillF(fillRate);
}
function tickF(){
fillF(emptyRate);
}

function fillF(amt){
tl.bar.fill.scaleY+= amt;
if(tl.bar.fill.scaleY<0){
tl.bar.fill.scaleY = 0;
} else {
if(tl.bar.fill.scaleY>=1){
tl.bar.fill.scaleY = 1
tl.b.removeEventListener("click",clickF);
createjs.Ticker.removeEventListener("tick", tickF);
// do whatever. bar filled
}
}
}