function toggleList(e){
	element = document.getElementById(e).style;
	element.display == 'none' ? element.display = 'block' :
	element.display='none';
}
function selectTab(id) {
	var i = 1;
	var obj = document.getElementById("content" + i);
	while (obj != null) {
		if (obj.style.display == "block" && id != i) {
			unselectTab(i);
		}
		i++;
		obj = document.getElementById("content" + i);
	}
	var tab = document.getElementById("tab" + id);
	var content = document.getElementById("content" + id);
	tab.style.border = "solid 2px #ff6900";
	tab.style.backgroundImage = "url('/public/images/orangeArrow.gif')";
	tab.style.backgroundRepeat = "no-repeat";
	tab.style.backgroundPosition = "right top";
	tab.style.backgroundColor = "#eeeeee";
//	content.style.display = "block";
	appear("content" + id);
}
function unselectTab(id) {
	var tab = document.getElementById("tab" + id);
	var content = document.getElementById("content" + id);
	tab.style.border = "solid 2px blue";
	tab.style.backgroundImage = "";
	tab.style.backgroundColor = "#ffffff";
//	content.style.display = "none";
	fade("content" + id);
}
function appear(domId){
	var obj = document.getElementById(domId); 
	if (obj.style.display != "none") 
		return false; 
	//Return if it is already being	displayed 
	obj.style.display = ''; 
	//Un-hide the object before its animation 
	var alpha = 0; 
	//Set the initial value of alpha to 0 (invisible) 
	function a(){ 
		//Internal function  
		alpha++; 
		//Increment alpha  
		setOpacity(domId, alpha); 
		//Set the opacity of our element to the specified alpha  
		if (alpha < 10) {
			setTimeout(a, 100);
		} else { 
			obj.style.display = "block";
		}
		/*Till alpha is 10, keep calling thea() function after 100 milliseconds */
	}
	setTimeout(a, 100); 
	//This is where we call the a() function for the first time
}
function setOpacity(domId, val) {
	var obj = document.getElementById(domId);
	obj.style.MozOpacity = val;
	obj.style.opacity = val/10;
	obj.style.filter = 'alpha(opacity=' + val*10 + ')';
}
function fade(domId){
	var obj = document.getElementById(domId); 
	//Get the Element 
	if (obj.style.display == "none") 
		return false; 
	//Return false if the element is already hidden 
	var alpha = 10; 
	//Set the initial value of alpha to 10 (Opaque) 
	function f(){ 
		//Internal function  
		alpha--; 
		//Decrement the alpha value  
		setOpacity(domId, alpha); 
		//Set the opacity of our element to the specified alpha  
		if (alpha > -1){ 
			//If alpha is still bigger than -1 then..   
			setTimeout(f, 100); 
			//..then call the function again after 100 milliseconds  
		} else { 
			obj.style.display = 'none'; 
			//..otherwise now that we cant see the element anyways, hide it  
		}
	}
	setTimeout(f, 100); 
	//This is where we call the f() function for the first time
}	
function getWindowWidth() {
    var x = 0;
    if (self.innerHeight)
    {
            x = self.innerWidth;
    }
    else if (document.documentElement && document.documentElement.clientHeight)
    {
            x = document.documentElement.clientWidth;
    }
    else if (document.body)
    {
            x = document.body.clientWidth;
    }
    return x;
}

function getWindowHeight() {
    var y = 0;
    if (self.innerHeight)
    {
            y = self.innerHeight;
    }
    else if (document.documentElement && document.documentElement.clientHeight)
    {
            y = document.documentElement.clientHeight;
    }
    else if (document.body)
    {
            y = document.body.clientHeight;
    }
    return y;
}

function convertCssPxToInt(cssPxValueText) {

    // Set valid characters for numeric number.
    var validChars = "0123456789.";

    // If conversion fails return 0.
    var convertedValue = 0;

    // Loop all characters of
    for (i = 0; i < cssPxValueText.length; i++) {

        // Stop search for valid numeric characters,  when a none numeric number is found.
        if (validChars.indexOf(cssPxValueText.charAt(i)) == -1) {

            // Start conversion if at least one character is valid.
            if (i > 0) {
                // Convert validnumbers to int and return result.
                convertedValue = parseInt(cssPxValueText.substring(0, i));
                return convertedValue;
            }
        }
    }

    return convertedValue;
}

function showPopup(id) {
	var popupBackground = document.getElementById("popupBackground");
	if (popupBackground != null) {
		if (document.body.scrollWidth) {  
			popupBackground.style.width = document.body.scrollWidth;
			popupBackground.style.height = document.body.scrollHeight;
		}
		popupBackground.style.display = "block";
	}
	var popup = document.getElementById(id);
	if (popup != null) {
		popup.style.display = "block";
		popup.style.zIndex = 1000;
		var width = convertCssPxToInt(popup.style.width);
		if (width == 0) {
			width = 500;
		}
		var height = convertCssPxToInt(popup.style.height);
		if (height == 0) {
			height = 600;
		}
		popup.style.left = parseInt((getWindowWidth() - width) / 2);
		popup.style.top = parseInt((getWindowHeight() - height) / 2);
	}
}
function hidePopup(id) {
	var popupBackground = document.getElementById("popupBackground");
	if (popupBackground != null) {
		popupBackground.style.display = "none";
	}
	var popup = document.getElementById(id);
	if (popup != null) {
		popup.style.display = "none";
	}
}

function centerElement(id, width, height) {
	var obj = document.getElementById(id);
	if (obj != null) {
		obj.style.width = width;
		obj.style.height = height;
		obj.style.left = parseInt((getWindowWidth() - width) / 2);
		obj.style.top = parseInt((getWindowHeight() - height) / 2);
	}
}

function showCenteredElement(id, width, height) {
	var obj = document.getElementById(id);
	if (obj != null) {
		obj.style.display = "block";
		obj.style.width = width;
		obj.style.height = height;
		obj.style.left = parseInt((getWindowWidth() - width) / 2);
		obj.style.top = parseInt((getWindowHeight() - height) / 2);
	}
}
function highlightRow(obj) {
	obj.style.background = "#CCFFFF";
}
function unhighlightRow(obj) {
	if (obj.id % 2 == 1) {
		obj.style.background = "white";
	} else {
		obj.style.background = "#dddddd";
	}
}

