/*
	<div id="fader_container">
		<div id="fader_banner">
			<img id="fader_image_0" width="480" height="260" src="/images/banner_1.jpg" />
			<img id="fader_image_1" width="480" height="260" src="/images/banner_2.jpg" />
			<img id="fader_image_2" width="480" height="260" src="/images/banner_3.jpg" />
		</div>
		<div id="fader_sidebar">
			<div id="fader_sidebar_0" class="fader_sideblock">
				<h4>Banner 1</h4>
				Description for banner 1
			</div>
			<div id="fader_sidebar_1" class="fader_sideblock">
				<h4>Banner 2</h4>
				Description for banner 2
			</div>
			<div id="fader_sidebar_2" class="fader_sideblock">
				<h4>Banner 3</h4>
				Description for banner 3
			</div>
		</div>
		<div id="fader_bottom"></div> 
	</div>
*/

var fader = {
	fadetime: 300, //fade animation time
	delay: 3000, //delay between images
	clickdelay: 6000, //delay after clicking an item before rotation starts again
	zindex: 100, //dont change this
	
	fader_container: 'fader_container', //fader_container id
	fader_banner: 'fader_banner', //fader_banner id
	fader_sidebar: 'fader_sidebar', //fader_sidebar id
	
	//dont modify below
	fader_data: false,
	fader_length: 0,
	current_fade: -1,
	fadeTimer: false,
	fadeTimers: new Array(),
	sideTimers: new Array(),
	lastFade: false,
	lastSelectedSideDiv: false,
	sideDivs: false,
	
	init: function() {
		this.fader_data = document.getElementById(this.fader_banner).getElementsByTagName('img');;
		this.fader_length = this.fader_data.length;
		this.sideDivs = document.getElementById(this.fader_sidebar).getElementsByTagName('div');
		for (var i=0; i<this.sideDivs.length; i++) {
			this.sideDivs[i].onclick = function(e) {
				var idd = parseInt(this.getAttribute("id").replace("fader_sidebar_", ""));
				fader.goToBanner(idd);
			}
		}
		setTimeout("fader.fadeStep();", 1000)
	},
	
	changeOpacity: function(id, opacity) {
		var object = document.getElementById(id).style;
		object.opacity = (opacity / 100);
		object.MozOpacity = (opacity / 100);
		object.KhtmlOpacity = (opacity / 100);
		object.filter = "alpha(opacity=" + opacity + ")";
	},
	
	goToBanner: function(idx) {
		clearTimeout(this.fadeTimer);
		for (var i=0; i<this.fadeTimers; i++) { clearTimeout(this.fadeTimers[i]); }
		for (var i=0; i<this.sideTimers; i++) { clearTimeout(this.sideTimers[i]); }
		this.fadeTimers = new Array();
		this.sideTimers = new Array();
		if (this.lastSelectedSideDiv !== false) {
			this.sideDivs[this.lastSelectedSideDiv].className = 'fader_sideblock';
		}
		this.sideDivs[idx].className = 'fader_sideblock active';
		this.lastSelectedSideDiv = idx;
		this.lastFade = idx;			
		this.current_fade = idx;
		for (var i=0;i<this.fader_data.length;i++) {
			this.changeOpacity(this.fader_data[i].getAttribute('id'), 0);
			this.fader_data[i].style.zIndex = 50;
			//this.fader_data[this.current_fade].parentNode.style.zIndex = 50;
		}
		//this.doFade(this.fader_data[idx].getAttribute('id'), 0, 99, this.fadetime);
		this.changeOpacity(this.fader_data[idx].getAttribute('id'), 99);
		this.fader_data[idx].style.zIndex = this.zindex++;	
		//this.fader_data[this.current_fade].parentNode.style.zIndex = this.zindex++;
		document.getElementById('fader_link').href = this.fader_data[this.current_fade].alt;
		
		this.fadeTimer = setTimeout("fader.fadeStep();", this.clickdelay);
	},
	
	doFade: function(id, opacStart, opacEnd, millisec) {
		var speed = Math.round(millisec / 100);
		var timer = 0;
		if(opacStart > opacEnd) {
			for(i = opacStart; i >= opacEnd; i--) {
				this.fadeTimers.push(setTimeout("fader.changeOpacity('" + id + "'," + i + ")",(timer * speed)));
				timer++;
			}
		} else if(opacStart < opacEnd) {
			for(i = opacStart; i <= opacEnd; i++)
				{
				this.fadeTimers.push(setTimeout("fader.changeOpacity('" + id + "'," + i + ")",(timer * speed)));
				timer++;
			}
		}
	},
	
	fadeStep: function() {
		if (this.current_fade == this.fader_length-1) {
			this.current_fade = 0;
		}
		else {
			this.current_fade++;
		}
		
		this.doFade(this.fader_data[this.current_fade].getAttribute('id'), 0, 99, this.fadetime);
		this.fader_data[this.current_fade].style.zIndex = this.zindex++;
		document.getElementById('fader_link').href = this.fader_data[this.current_fade].alt;
		//this.fader_data[this.current_fade].parentNode.style.zIndex = this.zindex++;
		
		if (this.lastFade !== false) {
			this.doFade(this.fader_data[this.lastFade].getAttribute('id'), 99, 0, this.fadetime);
			this.fader_data[this.current_fade].style.zIndex = 50;
			//this.fader_data[this.current_fade].parentNode.style.zIndex = 50;
		}

		if (this.lastSelectedSideDiv !== false) {
			fader.sideDivs[this.lastSelectedSideDiv].className = 'fader_sideblock';
		}
		this.sideDivs[this.current_fade].className = 'fader_sideblock active';
		
		this.lastSelectedSideDiv = this.current_fade;
		clearTimeout(this.fadeTimer);
		this.fadeTimer = setTimeout("fader.fadeStep();", this.delay);
		this.lastFade = this.current_fade;
	} 
}