var ProgressBar=new Class({ initialize:function(value,parameters){ var vals={ 'id':'progressbar_'+(ProgressBars++), 'value':$pick(value,0), 'width':0, 'height':0, 'darkbg':'#006', 'darkfg':'#fff', 'lightbg':'#fff', 'lightfg':'#000' }; if(parameters && $type(parameters)=='object')$extend(vals,parameters); if(vals.height<12)vals.height=12; var obj=new Element('div',{ 'id':vals.id, 'class':'progressbar_wrapper', 'styles':{ 'border':'1px solid #000', 'width':vals.width, 'height':vals.height, 'position':'relative' } }); obj.vals=vals; obj.vals.value = $pick(value, 0); // Fix by Chris obj.vals.dark=new Element('div',{ 'id':vals.id+'_dark', 'class':'progressbar_dark', 'styles':{ 'width':vals.width, 'height':vals.height, 'background':vals.darkbg, 'color':vals.darkfg, 'position':'absolute', 'text-align':'center', 'left':0, 'top':0, 'line-height':vals.height-2 } }); obj.vals.light=new Element('div',{ 'id':vals.id+'_light', 'class':'progressbar_light', 'styles':{ 'width':vals.width, 'height':vals.height, 'background':vals.lightbg, 'color':vals.lightfg, 'position':'absolute', 'text-align':'center', 'left':0, 'top':0, 'line-height':vals.height-2 } }); obj.appendChild(obj.vals.dark); obj.appendChild(obj.vals.light); obj.getValue=ProgressBar_getValue; obj.setValue=ProgressBar_setValue; if(vals.width)obj.setValue(vals.value); else setTimeout('ProgressBar_checkForParent("'+obj.id+'")',1); return obj; } }); function ProgressBar_getValue(){ return this.vals.value; } function ProgressBar_setValue(value){ value=parseFloat(value); if(isNaN(value))value=0; if(value>100)value=100; if(value<0)value=0; this.vals.value=value; this.vals.dark.empty(); this.vals.light.empty(); this.vals.dark.appendText(value+'%'); this.vals.light.appendText(value+'%'); var r=parseInt(this.vals.width*(value/100)); this.vals.dark.setStyle('clip','rect(0,'+r+'px,'+this.vals.height+'px,0)'); this.vals.light.setStyle('clip','rect(0,'+this.vals.width+'px,'+this.vals.height+'px,'+r+'px)'); } function ProgressBar_checkForParent(id){ var obj=$(id); if(!obj)return; if(!obj.parentNode)return setTimeout('ProgressBar_checkForParent("'+id+'")',1); obj.setStyle('width','100%'); var w=obj.offsetWidth; obj.vals.dark.setStyle('width',w); obj.vals.light.setStyle('width',w); obj.vals.width=w; obj.setValue(obj.vals.value); } var ProgressBars=0;