﻿var arrImgId = new Array();
var arrBars = new Array();
var currentBar = null;
var currentImg = null;
var contentPane = null;
var arrMovingBars = null;
var newUrl = "";

function SetImages(imgs)
{
	arrImgId = imgs;
}

function MouseOverBar(cImg)
{
	var arrImgs = new Array();
	cImg = document.getElementById(cImg);
	
	for (var i = 0; i < arrImgId.length; i++)
	{
		arrImgs[i] = document.getElementById(arrImgId[i]);
		if (arrImgs[i] != currentImg)
		{
			arrImgs[i].src = "/Images/Bars/ledOff.gif";
			//arrImgs[i].parentNode.style.backgroundColor = "#000000";
			arrImgs[i].parentNode.style.backgroundColor = arrImgs[i].parentNode.originalColour;
		}
	}
	
	for (var i = 0; i < arrImgs.length; i++)
	{		
		if (arrImgs[i] == cImg)
		{
			if (i-2 >= 0 && arrImgs[i-2] != currentImg)
				arrImgs[i-2].src = "/Images/Bars/ledDark.gif";
			if (i-1 >= 0 && arrImgs[i-1] != currentImg)
				arrImgs[i-1].src = "/Images/Bars/ledMedium.gif";
				
			if (cImg != currentImg)
			{
				arrImgs[i].src = "/Images/Bars/ledBright.gif";
				arrImgs[i].parentNode.originalColour = arrImgs[i].parentNode.style.backgroundColor;
				arrImgs[i].parentNode.style.backgroundColor = "#CCCCCC";
			}
			
			if (i+1 < arrImgs.length && arrImgs[i+1] != currentImg)
				arrImgs[i+1].src = "/Images/Bars/ledMedium.gif";
			if (i+2 < arrImgs.length && arrImgs[i+2] != currentImg)
				arrImgs[i+2].src = "/Images/Bars/ledDark.gif";
		}
	}
}

function SetBars(bars, content)
{
	for (var i = 0; i < bars.length; i++)
		arrBars[i] = document.getElementById(bars[i]);
		
	contentPane = document.getElementById(content);
}

function SetupBars(cBar, cImg)
{	
	var xPos = 0;
	currentBar = document.getElementById(cBar);
	currentImg = document.getElementById(cImg);
	
	for (var i = 0; i < arrBars.length; i++)
	{
		xPos += 5;
		arrBars[i].style.left = xPos + "px";
		xPos += arrBars[i].offsetWidth;
		
		if (arrBars[i] == currentBar)
		{
			xPos += 15;
			contentPane.style.left = xPos + "px";
			xPos += contentPane.offsetWidth;
			xPos += 15;
		}
		
		// Locate a elements in divs
		for (j in arrBars[i].childNodes)
		{
			var el = arrBars[i].childNodes[j];
			if (el.nodeName == 'A')
			{
				//el.parentNode.setAttribute("onclick", "ClickBar('" + el.parentNode.id + "', '" + el.href + "');");
				//el.setAttribute("onclick", "ClickBar('" + el.parentNode.id + "', '" + el.href + "');")
				//el.parentNode.onclick = ClickBar("'" + el.parentNode.id + "'", "'" + el.href + "'");
				//el.onclick = ClickBar("'" + el.parentNode.id + "'", "'" + el.href + "'");
				el.parentNode.newUrl = el.href;
				el.newUrl = el.href;
				el.href = "javascript:void(0);";
				el.parentNode.onclick = function(evt) {ClickBar(this.id, this.newUrl)};
				el.onclick = function(evt) {ClickBar(this.parentNode.id, this.newUrl)};
			}	
				
		}
	}
	currentImg.src = "/Images/Bars/ledBright.gif";
	currentBar.style.borderColor = "#999999";
}

function ClickBar(id, url)
{
	if (arrMovingBars == null)
	{
		newUrl = url;
		
		var div = document.getElementById(id);
		var cPos = -1;
		var nPos = -1;
		for (i in arrBars)
		{
			if (arrBars[i] == currentBar)
				cPos = parseInt(i);
			if (arrBars[i] == div)
				nPos = parseInt(i);
		}
		
		if (nPos < cPos)
		{
			arrMovingBars = new Array();
			var count = 0;
			for (var i = (nPos + 1); i <= cPos; i++)
			{
				arrMovingBars[count] = arrBars[i];
				count++;
			}
			var wmb = ((count+1) * (39 + 5));
			//var distance = (arrBars[cPos].offsetLeft - arrBars[nPos].offsetLeft) + (arrBars[nPos].offsetWidth + 5);
			var distance = 0;
			if ((cPos + 1) < arrBars.length)
				distance = (arrBars[cPos+1].offsetLeft) - ((arrBars[nPos].offsetLeft + 5) + wmb);
			else
				distance = (contentPane.offsetLeft + contentPane.offsetWidth + 15) - ((arrBars[nPos].offsetLeft + 5) + wmb);
				
			contentPane.style.width = contentPane.offsetWidth + "px";
			MoveBars(distance, 20);
		}
		else if (nPos > cPos)
		{
			// Move everything after the cPos, including the nPos left
			arrMovingBars = new Array();
			var count = 0;
			for (var i = (cPos + 1); i <= nPos; i++)
			{
				arrMovingBars[count] = arrBars[i];
				count++;
			}
			var wmb = (count * (39 + 5));
			var distance = arrBars[nPos].offsetLeft - ((arrBars[cPos].offsetLeft) + wmb);
			contentPane.style.width = contentPane.offsetWidth + "px";
			MoveBars(distance, -20);
		}
	}
}

function MoveBars(distance, inc)
{	
	if ((distance - Math.abs(inc) < 0))
	{
		if (inc < 0)
			inc = -distance;
		else
			inc = distance;
	}
		
	for (i in arrMovingBars)
	{
		var div = document.getElementById(arrMovingBars[i]);
		arrMovingBars[i].style.left = (parseInt(arrMovingBars[i].style.left) + inc) + "px";
	}
	
	if (inc > 0)
		contentPane.style.left = (parseInt(contentPane.style.left) + inc) + "px";
	
	if (contentPane.style.width <= 0)
		contentPane.style.display = 'none';
	else
	{
		var wm = Math.abs(inc);
		var newWidth = parseInt(contentPane.style.width) - wm;
		if (newWidth < 0)
			newWidth = 0;
		contentPane.style.width = newWidth + "px";
	}
	
	distance -= Math.abs(inc);
	
	if (distance > 0)
		setTimeout('MoveBars(' + distance + ',' + inc + ')', 10);
	else
		window.location = newUrl;
}