var tile1, tile2, tile3;

function homeSetup() {
	VS_preloadImages('images/hpnav/hpnav_lcd_on.gif','images/hpnav/hpnav_atv_on.gif','images/hpnav/hpnav_prj_on.gif','images/hpnav/hpnav_finder_on.gif');
	/* tile1 = new vsFader("tile1_1", "tile1_2", 5000, 500);
	tile2 = new vsFader("tile2_1", "tile2_2", 5000, 500); */
}

var gLines, gCurLine, gTickerTO;

function tickerAnimate() {
	loadRemoteData("/ticker.php");
	gLines = req.responseText.split('\r\n');
	gCurLine = 0;
	animateTicker();
}

function animateTicker() {
	var e = document.getElementById('tickers');
	linkTitle = gLines[gCurLine].split('\t');
	e.innerHTML = '<a href="' + linkTitle[0] + '" onMouseOver="delTickerOut()" onMouseOut="addTickerOut()">' + linkTitle[1] + '</a>';
	gTickerTO = setTimeout(animateTickerOut, 5000);
}

function animateTickerOut() {
	var e = document.getElementById('tickers');
	e.innerHTML = '';
	gCurLine++;
	if (gCurLine >= gLines.length)
		gCurLine = 0;
	setTimeout(animateTicker, 500);
}

function delTickerOut() {
	if (gTickerTO != undefined)
		clearTimeout(gTickerTO);
}

function addTickerOut() {
	gTickerTO = setTimeout(animateTickerOut, 5000);
}

// this function will be called every 100ms after transition starts
function fading(self) {
	// var self = tile1;
	self.curOpacity -= self.deltaOpacity;
	self.nextOpacity += self.deltaOpacity;
	self.setOpacity(self.curDiv, self.curOpacity);
	self.setOpacity(self.nextDiv, self.nextOpacity);
	if (self.curOpacity <= 0) {
		// swap elements
		var tempDiv = self.curDiv;
		self.curDiv = self.nextDiv;
		self.nextDiv = tempDiv;
		self.curOpacity = 100;
		self.nextOpacity = 0;
		self.nextDiv.style.display = "none";
		self.curDiv.style.display = "block";
		setTimeout(function() { fading(self) }, self.showTime);
	} else
		setTimeout(function() { fading(self) }, 50);
}
function vsFader(id1, id2, showTime, transTime) {
	this.curDiv = document.getElementById(id1);
	this.nextDiv = document.getElementById(id2);
	this.showTime = showTime;
	this.transTime = transTime;
	this.deltaTiming = (transTime / 50);
	this.deltaOpacity = (100 / this.deltaTiming);
	this.curOpacity = 100;
	this.nextOpacity = 0;
	this.setOpacity(this.curDiv, this.curOpacity);
	this.setOpacity(this.nextDiv, this.nextOpacity);
	var self = this;
	this.timeout = setTimeout(function() { fading(self) }, showTime);
	
}

// op is 0-100 number
vsFader.prototype.setOpacity = function (div, op) {
	if (op > 0)
		div.style.display = "block";
	else
		div.style.display = "none";
	div.style.opacity = (op / 100);
	div.style.MozOpacity = (op / 100);
	div.style.KhtmlOpacity = (op / 100);
	div.style.filter = "alpha(opacity=" + op + ")";
}