// return a CSS style property for element
function getStyle(element, styleProp) {
	if (element.currentStyle) {
		var IEPropName = "";
		var index = -1;
		
		// isandu -- turn a standard property name into a camel case style name for IE; for example, "padding-left" becomes "paddingLeft"
		do {
			var newIndex = styleProp.indexOf("-", index);
			if (newIndex == index || newIndex == -1)
				newIndex = styleProp.length;
			IEPropName += styleProp.substring(index + 1, newIndex) + styleProp.charAt(newIndex + 1).toUpperCase();
			index = newIndex + 1;
		} while (index < styleProp.length);
	
		return element.currentStyle[IEPropName];
	} else 
		if (window.getComputedStyle) {
			return window.getComputedStyle(element, "").getPropertyValue(styleProp);
		}
	
	return "";
}

function getElementInfo(element) {
	var offsetTop = 0, offsetLeft = 0;
	var elWidth = element.offsetWidth, elHeight = element.offsetHeight;
	var parent = element;
	
	while (parent) {
		offsetLeft += parent.offsetLeft * 1;
		offsetTop += parent.offsetTop * 1;
		parent = parent.offsetParent;
	}
	
	return {left : offsetLeft, top : offsetTop, width: elWidth, height: elHeight, 
		clientWidth: elWidth - parseInt(getStyle(element, "padding-left")) - parseInt(getStyle(element, "padding-right")), 
		clientHeight: elHeight - parseInt(getStyle(element, "padding-top")) - parseInt(getStyle(element, "padding-bottom")),
		textAlign: getStyle(element, "text-align"),
		padding: getStyle(element, "padding-top") + " " + getStyle(element, "padding-right") + " " +
			getStyle(element, "padding-bottom") + " " + getStyle(element, "padding-left")};
}

function processElement(element, hasStretchedBg, roundedCorners) {
	var smallCorners = !hasClass(element, "panel");
	
	if (!hasStretchedBg && !roundedCorners)
		return;
	
	var r = getElementInfo(element);
	
	element.style.padding = "0px";
	element.style.border = "none";
	element.style.textAlign = "left";
	element.style.width = r.width + "px";
	element.style.height = "auto";
	
	var cornerSrc = smallCorners ? 
		{topLeft: "images/round_rect_top_left_small.gif", topRight: "images/round_rect_top_right_small.gif", 
		bottomLeft: "images/round_rect_bottom_left_small.gif", bottomRight: "images/round_rect_bottom_right_small.gif"} : 
		{topLeft: "images/round_rect_top_left_large.gif", topRight: "images/round_rect_top_right_large.gif", 
		bottomLeft: "images/round_rect_bottom_left_large.gif", bottomRight: "images/round_rect_bottom_right_large.gif"};
		
	var maskHeight = smallCorners ? 8 : 16;
	
	var imgSrc = getStyle(element, 'background-image');
	var imgHTML = '';
	
	var hasBorder = element.tagName.toLowerCase() != "td";
	var bgWidth = r.width - (hasBorder ? 2 : 0);
	var bgHeight = r.height - (hasBorder ? 2 : 0);
	
	if (hasStretchedBg && imgSrc && imgSrc.toLowerCase() != "none") {
		imgSrc = imgSrc.substring(imgSrc.indexOf('(') + 1, imgSrc.lastIndexOf(')'));
		
		if (imgSrc.charAt(0) == '"') imgSrc = imgSrc.substring(1);
		if (imgSrc.charAt(imgSrc.length - 1) == '"') imgSrc = imgSrc.substring(0, imgSrc.length - 1);
		
		imgHTML = '<img src="' + imgSrc + '" galleryimg="no" style="position: absolute; margin: 0px; top: inherit; width: ' + (bgWidth) + 'px; height: ' + (bgHeight) + 'px; ' + (hasBorder ? 'border: 1px solid #DDD;' : '') + '"/>';
		
		element.style.backgroundImage = "none";
	} else 
		if (hasBorder) {
			imgHTML = '<div style="position: absolute; margin: 0px; padding: 0px; width: ' + (bgWidth) + 'px; height: ' + (bgHeight) + 'px; ' + (hasBorder ? 'border: 1px solid #DDD;' : '') + '"></div>';
		}
	
	
	
	element.innerHTML = 
		'<div style="padding: 0px; margin: 0px; width: ' + r.width + 'px; height: ' + r.height + 'px; ">' + 
			imgHTML + 
			
			(roundedCorners ? '<div style="position: absolute; background: url(\'' + cornerSrc.topLeft + '\') no-repeat top left; width: ' + (r.width) + 'px; height: ' + (maskHeight) + 'px;">' + 
			'<div style="font-size: 0px; height: ' + maskHeight + 'px; background: url(\'' + cornerSrc.topRight + '\') no-repeat top right;"></div></div>' : '') +
			
			'<div style="position: absolute; margin: 0px; padding: ' + r.padding + '; width: ' + (r.clientWidth) + 'px; height: ' + (r.clientHeight) + 'px; text-align: ' + r.textAlign + ';">' + element.innerHTML + '</div>' +
			
			(roundedCorners ? '<div style="position: relative; background: url(\'' + cornerSrc.bottomLeft + '\') no-repeat bottom left; top: ' + (r.height - maskHeight) + 'px; width: ' + (r.width) + 'px; height: ' + (maskHeight) + 'px;">' + 
			'<div style="font-size: 0px; height: ' + maskHeight + 'px; background: url(\'' + cornerSrc.bottomRight + '\') no-repeat bottom right;"></div></div>' : '') +
		'</div>';
}


function hasClass(element, className) {
	if (element.className && element.className.indexOf(className) >= 0)
		return true;
	else
		return false;
}

function recTraversal(elem) {
	var nodes = elem.childNodes;
	for (var i = 0; i < nodes.length; i++) {
		var hasStretchedBg = hasClass(nodes[i], "stretched");
		var roundedCorners = hasClass(nodes[i], "rounded");
		
		if (hasStretchedBg || roundedCorners) {
			processElement(nodes[i], hasStretchedBg, roundedCorners);
		}
			
		if (nodes[i].childNodes.length > 0)
			recTraversal(nodes[i]);
	}
}

function preloadImage(path) {
	if (!window.preloadedImgs) {
		preloadedImgs = [];
	}
	
	var img = new Image();
	img.src = path;
	
	preloadedImgs.push(img);
}

function preloadImages() {
	preloadImage("images/nav_menu_hover.gif");
	preloadImage("images/button_right_over.gif");
	preloadImage("images/submenu_hover.gif");
}

// fix cursor flicker in IE
try {
	document.execCommand("BackgroundImageCache", false, true);
} catch(err) {}

preloadImages();

function init() {
	recTraversal(document.getElementById('page-body'));
}

window.onload = init;
