Updater = new Class({
	initialize: function(func, binding, after, afterBinding)
	{
		this.interval = null;
		this.func = func;
		this.binding = binding;
		this.after = after;
		this.afterBinding = afterBinding;
	},
	
	start: function()
	{
		if (this.interval)
			$clear(this.interval);
			
		this.interval = this.func.periodical(100, this.binding);
	},
	
	stop: function()
	{
		if (this.interval)
		{
			$clear(this.interval);
			this.interval = null;
			
			this.func.delay(100, this.binding);
			this.after.delay(100, this.afterBinding);
		}
	}
});

window.addEvent('domready', function() {
	var aDiv = $('accordion');
	window.accordion = new Fx.Accordion(aDiv.getElements('h1.toggler'), aDiv.getElements('div.panel'), { alwaysHide: true });
	
	var percentDone = 20;
	var bar = $('progressBar');
	var progressBar = new Fx.Tween(bar, { unit: '%', duration: (percentDone / 100 * 5000) });
	var progressText = $('progressText');
	var progressStage = $('progressStage');
	
	progressBar.set('width', 1);
	bar.setProperty('src', 'images/bar-red.png');
	progressText.set('text', '');
	progressStage.hide();
	
	var update = new Updater(function() {
		var bar = $('progressBar');
		var barWidth = bar.getStyle('width').toInt();
		
		if (barWidth > 24)
			bar.setProperty('src', 'images/bar-orange.png');
		if (barWidth > 49)
			bar.setProperty('src', 'images/bar-yellow.png');
		if (barWidth > 74)
			bar.setProperty('src', 'images/bar-green.png');
		
		if (barWidth > 90)
			this.setStyles({ position: 'absolute', right: 5, color: '#FFFFFF' });
		
		this.set('text', barWidth + '%');
	}, progressText, function() {
		this.show();
	}, progressStage);
	
	progressBar.addEvent('start', update.start.pass(progressBar, update));
	progressBar.addEvent('complete', update.stop.bind(update));
	
	progressBar.start('width', percentDone);
});