var Billboard = Class.create();
Billboard.prototype = {
	lead: null,
	effect: null,
	timer1: null,
	timer2: null,
	
	initialize: function () {
		this.lead = 1;
		
		// Prepare new image container
		var divhtml = $('billboard').innerHTML;
		$('billboard').innerHTML += '<div id="leaddiv"></div>';
		Effect.BlindUp($('leaddiv'));
		this.effect = 'down';
		$('leaddiv').innerHTML = divhtml;
		
		// Start rolling
		this.timer1 = setTimeout('billboard.preload()', timer * 500);
		this.timer2 = setTimeout('billboard.toggle()', timer * 1000);
	},
	
	preload: function () {
		// Define next lead
		this.lead++;
		if (this.lead>11) this.lead = 1;
		var element = (Element.getStyle($('leaddiv'), 'display')=='none') ? $('leaddiv') : $('billboard');
		
		// Preload it
		for (var i=0; i<element.childNodes.length; i++) {
			if (element.childNodes[i].nodeType == 1)
				if (element.childNodes[i].tagName.toLowerCase() == "img") {
					element.childNodes[i].src = '/images/billboard/image-'+this.lead+'.jpg';
				}
		}
	},
	
	toggle: function () {
		// Blind up or down
		if (this.effect=='down') {
			Effect.BlindDown($('leaddiv'));	
			this.effect = 'up';
		}
		else {
			Effect.BlindUp($('leaddiv'));
			this.effect = 'down';
		}
		
		// Next rolling
		this.timer1 = setTimeout('billboard.preload()', timer * 500);
		this.timer2 = setTimeout('billboard.toggle()', timer * 1000);
	}
	
}

var billboard;
var timer = 4;

function initPage() {
	billboard = new Billboard();
}

Event.observe(window, 'load', initPage, false);