// slidepanel.js
// Functions for use by sliding div panel menus.

var containerActive = false;
var contentActive = false;

var originalPanel = null;
var currentPanel = null;
var originalItem = null;
var currentItem = null;

var contentHeight = 150;
var contentHeightUnit = "px";

var slideStep = 15;
var slideSpeed = 40;
var slideTimer = null;
var sliding = false;

var headerPreIconNormal = "";
var headerPreIconHover = "";
var headerPreIconActive = "";
var headerPostIconNormal = "";
var headerPostIconHover = "";
var headerPostIconActive = "";

var itemPreIconNormal = "";
var itemPreIconHover = "";
var itemPreIconActive = "";
var itemPostIconNormal = "";
var itemPostIconHover = "";
var itemPostIconActive = "";

var itemImage = {};

function _getElementById(e) {
	if (typeof(e) != 'string') {
		return e;
	}
 	if (document.getElementById) {
		return document.getElementById(e);
	}
	else if (document.all) {
		return document.all[e];
	}
	return null;
}

function getPanelContent(panel) {
	var content = null;
	var contentId = "";
	if (panel) {
		contentId = panel.id + "-content";
		content = _getElementById(contentId);
	}
	return content;
}

function processContainerOver(panel) {
	if (sliding) {
		return;
	}
	if (containerActive) {
		panel.className = panel.className.replace('-active', '-hover');
	}
	else {
		panel.className = panel.className.replace('-normal', '-hover');
	}
}

function processContainerOut(panel) {
	if (sliding) {
		return;
	}
	if (containerActive) {
		panel.className = panel.className.replace('-hover', '-active');
	}
	else {
		panel.className = panel.className.replace('-hover', '-normal');
	}
}

function processContainerClick(panel) {
	if (sliding) {
		return;
	}
	containerActive = !containerActive;
	if (containerActive) {
		panel.className = panel.className.replace('-hover', '-active');
	}
	else {
		panel.className = panel.className.replace('-hover', '-normal');
	}
}

function processHeaderOver(panel) {
	if (sliding) {
		return;
	}
	var preIcon = _getElementById(panel.id + "_pre_icon");
	var postIcon = _getElementById(panel.id + "_post_icon");
	
	if (panel == currentPanel) {
		panel.className = panel.className.replace('-active', '-hover');
	}
	else {
		panel.className = panel.className.replace('-normal', '-hover');
	}
	if (preIcon && headerPreIconHover) {
		preIcon.src = headerPreIconHover;
	}
	if (postIcon && headerPostIconHover) {
		postIcon.src = headerPostIconHover;
	}
}

function processHeaderOut(panel) {
	if (sliding) {
		return;
	}
	var preIcon = _getElementById(panel.id + "_pre_icon");
	var postIcon = _getElementById(panel.id + "_post_icon");
	
	if (panel == currentPanel) {
		panel.className = panel.className.replace('-hover', '-active');
		if (preIcon && headerPreIconActive) {
			preIcon.src = headerPreIconActive;
		}
		if (postIcon && headerPostIconActive) {
			postIcon.src = headerPostIconActive;
		}
	}
	else {
		panel.className = panel.className.replace('-hover', '-normal');
		if (preIcon && headerPreIconNormal) {
			preIcon.src = headerPreIconNormal;
		}
		if (postIcon && headerPostIconNormal) {
			postIcon.src = headerPostIconNormal;
		}
	}
}

function processHeaderClick(panel) {
	if (sliding) {
		return;
	}
	var currentContent = getPanelContent(panel);
	if (!currentContent) {
		return;
	}
	if (currentContent.style.display == 'block') {
		return;
	}
	
	var preIcon = null;
	var postIcon = null;
	currentPanel = panel;
	sliding = true;
	
	if (originalPanel) {
		originalPanel.className = originalPanel.className.replace('-active', '-normal');
		preIcon = _getElementById(originalPanel.id + "_pre_icon");
		postIcon = _getElementById(originalPanel.id + "_post_icon");
		if (preIcon && headerPreIconNormal) {
			preIcon.src = headerPreIconNormal;
		}
		if (postIcon && headerPostIconNormal) {
			postIcon.src = headerPostIconNormal;
		}
	}
	
	currentPanel.className = currentPanel.className.replace('-hover', '-active');
	preIcon = _getElementById(currentPanel.id + "_pre_icon");
	postIcon = _getElementById(currentPanel.id + "_post_icon");
	if (preIcon && headerPreIconActive) {
		preIcon.src = headerPreIconActive;
	}
	if (postIcon && headerPostIconActive) {
		postIcon.src = headerPostIconActive;
	}
	slideTimer = window.setInterval("slidePanel()", slideSpeed);
}

function processItemOver(panel) {
	if (sliding) {
		return;
	}
	var preIcon = _getElementById(panel.id + "_pre_icon");
	var postIcon = _getElementById(panel.id + "_post_icon");
	var image = _getElementById(panel.id + "_image");
	
	if (panel == currentItem) {
		panel.className = panel.className.replace('-active', '-hover');
	}
	else {
		panel.className = panel.className.replace('-normal', '-hover');
	}
	if (preIcon && itemPreIconHover) {
		preIcon.src = itemPreIconHover;
	}
	if (postIcon && itemPostIconHover) {
		postIcon.src = itemPostIconHover;
	}
	if (image && itemImage[self.id + "_image_hover"]) {
		image.src = itemImage[self.id + "_image_hover"];
	}
}

function processItemOut(panel) {
	if (sliding) {
		return;
	}
	var preIcon = _getElementById(panel.id + "_pre_icon");
	var postIcon = _getElementById(panel.id + "_post_icon");
	var image = _getElementById(panel.id + "_image");
	
	if (panel == currentItem) {
		panel.className = panel.className.replace('-hover', '-active');
		if (preIcon && itemPreIconActive) {
			preIcon.src = itemPreIconActive;
		}
		if (postIcon && itemPostIconActive) {
			postIcon.src = itemPostIconActive;
		}
		if (image && itemImage[self.id + "_image_active"]) {
			image.src = itemImage[self.id + "_image_active"];
		}
	}
	else {
		panel.className = panel.className.replace('-hover', '-normal');
		if (preIcon && itemPreIconNormal) {
			preIcon.src = itemPreIconNormal;
		}
		if (postIcon && itemPostIconNormal) {
			postIcon.src = itemPostIconNormal;
		}
		if (image && itemImage[self.id + "_image_normal"]) {
			image.src = itemImage[self.id + "_image_normal"];
		}
	}
}

function processItemClick(panel) {
	if (sliding) {
		return;
	}
	var preIcon;
	var postIcon;
	var image;
	
	currentItem = panel;
	if (currentItem == originalItem) {
		return;
	}
	
	if (originalItem) {
		preIcon = _getElementById(originalItem.id + "_pre_icon");
		postIcon = _getElementById(originalItem.id + "_post_icon");
		image = _getElementById(originalItem.id + "_image");
		
		originalItem.className = originalItem.className.replace('-active', '-normal');
		if (preIcon && itemPreIconNormal) {
			preIcon.src = itemPreIconNormal;
		}
		if (postIcon && itemPostIconNormal) {
			postIcon.src = itemPostIconNormal;
		}
		if (image && itemImage[originalItem.id + "_image_normal"]) {
			image.src = itemImage[originalItem.id + "_image_normal"];
		}
	}
	
	preIcon = _getElementById(currentItem.id + "_pre_icon");
	postIcon = _getElementById(currentItem.id + "_post_icon");
	image = _getElementById(currentItem.id + "_image");
	
	currentItem.className = currentItem.className.replace('-hover', '-active');
	if (preIcon && itemPreIconActive) {
		preIcon.src = itemPreIconActive;
	}
	if (postIcon && itemPostIconActive) {
		postIcon.src = itemPostIconActive;
	}
	if (image && itemImage[originalItem.id + "_image_active"]) {
		image.src = itemImage[originalItem.id + "_image_active"];
	}
	
	originalItem = currentItem;
}

function slidePanel() {
	var originalContent = getPanelContent(originalPanel);
	var currentContent = getPanelContent(currentPanel);
	var originalHeight;
	var currentHeight;
	
	if (!currentContent) {
		return;
	}
	
	currentContent.style.display = "block";
	if (originalContent) {
		originalHeight = parseFloat(originalContent.style.height) - slideStep;
		if (originalHeight > 0) {
			originalContent.style.height = "" + originalHeight + contentHeightUnit;
		}
	}
	
	currentHeight = parseFloat(currentContent.style.height) + slideStep;
	if (currentHeight < contentHeight) {
		currentContent.style.height = "" + currentHeight + contentHeightUnit;
	}
	else {
		if (originalContent) {
			originalContent.style.display = "none";
			originalContent.style.height = "0" + contentHeightUnit;
		}
		currentContent.style.height = "" + contentHeight + contentHeightUnit;
		originalPanel = currentPanel;
		sliding = false;
		window.clearInterval(slideTimer);
	}
}
