var _logo1 = document.getElementById('rotateLogo1'); // get logo elements as objects
var _logo2 = document.getElementById('rotateLogo2');
var _logo3 = document.getElementById('rotateLogo3');

var _i1 = new loopIndex(0); // get logo indices
var _i2 = new loopIndex(1);
var _i3 = new loopIndex(2);

var _opacityRef = 0;
var _opacityIncr = 0.05;
var _opacityIncrNew = false;
var _ie = '\v'=='v';

function loopIndex(start){ // set logo index value
	this.value = start;
}

function addToIndex(obj,array){ // increase logo index value by 3, or circle around
	obj.value += 3;
	if (obj.value>array.length-1) obj.value -= array.length;
}

function fadeIn() { // if not full opacity, fade in; otherwise queue logo rotation
	if (_opacityRef < 1) { 
		_opacityRef += _opacityIncr;
		if (_ie) { 
			_logo1.style.filter = _logo2.style.filter = _logo3.style.filter = 'alpha(opacity='+(_opacityRef*100)+')'; 
		} else { 
			_logo1.style.opacity = _logo2.style.opacity = _logo3.style.opacity = _opacityRef; 
		}
		setTimeout(fadeIn, 50);			
	} else { 
		if (_opacityIncrNew == false) {
			_opacityIncrNew = true;
			var endDate = new Date();
			var endTime = endDate.getTime();
			_opacityIncr = (endTime - startTime) / 20000;
		}
		setTimeout(rotateLogos, 2500);
	}
}

function doRotate(logoObj, index) { // get new logo index, reset opacity, set new logos
	addToIndex(index, pageLogos);
	var logoRow = pageLogos[index.value];
	if (_ie) { 
		logoObj.style.filter = 'alpha(opacity=0)'; 
	} else { 
		logoObj.style.opacity = 0; 
	}			
	logoObj.width = logoRow[1]; 
	logoObj.height = logoRow[2];
	logoObj.style.margin = (80 - logoObj.height)/2 + 'px ' + (130 - logoObj.width)/2 + 'px';
	logoObj.src = path+logoRow[0];
}

function rotateLogos(){ // reset opacity reference, switch logos, fade in
	_opacityRef = 0;
	doRotate(_logo1, _i1);
	doRotate(_logo2, _i2);
	doRotate(_logo3, _i3);
	fadeIn();
}

var startDate = new Date();
var startTime = startDate.getTime();
fadeIn(); // begin fade in