var selectedLogo = -1;
var numLogos = 0;

function convertToGrid(id) {
	if (document.getElementById && document.createElement) {
	
		//  Prep  ###################################
		
		var shell = document.getElementById(id);
		
		//Gets the first unordered list node
		var firstUl = shell.firstChild;
		firstUl = nextTag(firstUl);
		
		//Gets the first list node
		var firstLi = firstUl.firstChild;
		firstLi = nextTag(firstLi);
		
		//Create a new list to hold the reorganized content
		var newList = document.createElement('UL');
		
		
		//  Reorganize  ###################################
		
		var logoNum = 0;
		var numDesc = 0;
		var logo = true;
		
		
		//Run through all nodes of the list to strip out text nodes
		for(var i = 0; i < firstUl.childNodes.length; i++) {
			if (firstUl.childNodes[i].nodeName == '#text') {
				firstUl.removeChild(firstUl.childNodes[i]);
				i --;
			}
		}
		
		//Run through all nodes of the list to move them to the new list
		for(var i = 0; i < firstUl.childNodes.length; i++) {
							
			//Attach the logos to the new list
			if (logo == true) {
			
				//Change the class and id of the logos
				firstUl.childNodes[i].className = 'logo' + logoNum;
				firstUl.childNodes[i].id = numLogos;
				
				newList.appendChild(firstUl.childNodes[i]);
				
				logoNum ++;
				numLogos ++;
				logo = false;
				i --;
				
				if (firstUl.childNodes.length < 3) {
					for (var j = logoNum; j < 3; j++) {
						var filler = document.createElement('li');
						filler.className = 'filler';
						newList.appendChild(filler);
					}
				}
			}
			else {
				if (logoNum == 3 || firstUl.childNodes.length < 3) {
					//Attach a set of descriptions to the new list
					for (var j = 0; j < logoNum; j++) {
					
						firstUl.childNodes[0].className = 'hidden';
						firstUl.childNodes[0].id = 'desc' + numDesc;
						
						newList.appendChild(firstUl.childNodes[0]);
						
						numDesc ++;
					}
					
					i = -1;
					logoNum = 0;
				}
				
				logo = true
			}
		}
		
		
		//  Display  ###################################
		
		firstUl.className = 'hidden';
		shell.insertBefore(newList, firstUl);
		
	}
}


//finds the next sibling of the passed text node that isn't a text node.
function nextTag(node) {
	var searchLimit = 5;
	while (node.nodeName == '#text' && searchLimit > 0) {
		node = node.nextSibling;
		searchLimit --;
	}
	return(node);
}


function showDescription(obj) {
	var n = obj.id;
	
	//If a logo description is already open
	if (selectedLogo != -1) {
		//If the selected logo was clicked again
		if (selectedLogo == n) {
			var desc = document.getElementById('desc' + n);
			desc.className = 'hidden';
			obj.style.borderBottomColor = '#cccccc';
			obj.style.backgroundImage = 'url(/images/oatv/investments/open_over.gif)';
			
			//Fade in all the logos
			var imgToFade;
			for (var i = 0; i < numLogos; i++) {
				imgToFade = document.getElementById(i).firstChild;					
				new Effect.Opacity(imgToFade, {duration:.5, to:1});
			}
			
			selectedLogo = -1;
		}
		else {
			//  Hide  ###################################
			
			var desc = document.getElementById('desc' + selectedLogo);
			desc.className = 'hidden';
			var logo = document.getElementById(selectedLogo);
			logo.style.borderBottomColor = '#cccccc';
			logo.style.backgroundImage = 'url(/images/oatv/investments/open_off.gif)';
			
			//Fade out the last selected logo
			
			var imgToFade = document.getElementById(selectedLogo).firstChild;					
			new Effect.Opacity(imgToFade, {duration:.5, to:.5});
			
			
			
			//  Display  ###################################
			
			desc = document.getElementById('desc' + n);
			desc.className = 'desc';				
			obj.style.borderBottomColor = '#ffffff';
			obj.style.backgroundImage = 'url(/images/oatv/investments/close_over.gif)';
			
			//Fade in the new selected logo
			imgToFade = document.getElementById(n).firstChild;					
			new Effect.Opacity(imgToFade, {duration:.5, to:1});
			
			selectedLogo = n;
		}
	}
	else {
		var desc = document.getElementById('desc' + n);
		desc.className = 'desc';				
		obj.style.borderBottomColor = '#ffffff';
		obj.style.backgroundImage = 'url(/images/oatv/investments/close_over.gif)';
		
		//Fade out all the other logos
		var imgToFade;
		for (var i = 0; i < numLogos; i++) {
			if (i != n) {
				imgToFade = document.getElementById(i).firstChild;					
				new Effect.Opacity(imgToFade, {duration:.5, to:.5});
			}
		}
		
		selectedLogo = n;
	}
}


function hoverOver(obj) {
	var n = obj.id;
	
	if (selectedLogo != n) {
		obj.style.backgroundImage = 'url(/images/oatv/investments/open_over.gif)';
	}
	else {
		obj.style.backgroundImage = 'url(/images/oatv/investments/close_over.gif)';
	}
	
}

function hoverOff(obj) {
	var n = obj.id;
	
	if (selectedLogo != n) {
		obj.style.backgroundImage = 'url(/images/oatv/investments/open_off.gif)';
	}
	else {
		obj.style.backgroundImage = 'url(/images/oatv/investments/close_off.gif)';
	}
}