/**
 * Interface for a control item, which will be used from the layout
 * controller.
 */
function ILayoutControllerItem()
{
	/**
	 * Enables the current item in order to display the required information.
	 */
	this.enable = function enable() { };
	
	/**
	 * Enables the current item in order to hide the required information.
	 */
	this.disable = function disable() { };
	
	/**
	 * Returns the unique id of the current controller item.
	 */
	this.getId = function getId() { };
	
	/**
	 * Returns the unique id of the html-element representing the title.
	 */
	this.getTitleId = function getTitleId() { };
}

/**
 * Represents the layout controller, which is used to display and hide
 * its items. The implementation follows the MVC pattern.
 */
function LayoutController()
{
	var _layoutItems = [ ];
		
	/**
	 * Adds a new item to the controller.
	 */
	function addItem(objILayoutControllerItem)
	{
		if (objILayoutControllerItem && typeof(objILayoutControllerItem) == 'object')
			_layoutItems[objILayoutControllerItem.getId()] = _layoutItems[_layoutItems.length] = objILayoutControllerItem;
	}
	this.addItem = addItem;
	
	/**
	 * Returns the item which contains the given title-text
	 */
	function getItemByTitle(title)
	{
		for (var i = 0; i < _layoutItems.length; ++i)
		{
		    var item = document.getElementById(_layoutItems[i].getTitleId());
			if(
			    (item.text && item.text == title)
			    || (item.textContent && item.textContent == title)
			    || (item.innerHTML && item.innerHTML.indexOf(title) >= 0)
			)
			    return _layoutItems[i];
		}	
	}
	this.getItemByTitle = getItemByTitle;
	
	/**
	 * Returns the item identified by the given name
	 */
	function getItemByName(name)
	{
		for (var i = 0; i < _layoutItems.length; ++i)
		{
		    if(name == _layoutItems[i].getName())
			    return _layoutItems[i];
		}	
	}
	this.getItemByName = getItemByName;
	
	/**
	 * Changes the focus to the given item.
	 */
	function changeToItem(strItemId)
	{
		strItemId = String(strItemId);
		var changeToNone = !Boolean(_layoutItems[strItemId]);

		for (var i = 0; i < _layoutItems.length; ++i)
		{
			if (_layoutItems[i].getId() != strItemId)
				_layoutItems[i].disable(changeToNone);
			else
				_layoutItems[i].enable();
		}
	}
	this.changeToItem = changeToItem;
}
LayoutController.Instance = new LayoutController();


function PermaPackLayoutControllerItem(
	strName,
	strId,
	strTitleId,
	strTitleActiveStyle,
	strTitleInActiveStyle,
	strImageId,
	strImageActiveURL,
	strImageInActiveURL,
	strImageActiveStyle,
	strImageInActiveStyle,
	strBlockToDisplayId)
{
	
	var _name = String(strName);
	var _id = String(strId);
	var _titleId = String(strTitleId);
	var _titleActiveStyle = String(strTitleActiveStyle);
	var _titleInActiveStyle = String(_titleInActiveStyle);
	var _imageId = String(strImageId);
	var _imageActive = null;
	var _imageInActive = null;
	var _imageActiveStyle = String(strImageActiveStyle);
	var _imageInActiveStyle = String(strImageInActiveStyle);
	var _blockToDisplayId = String(strBlockToDisplayId);
	
	var _isEnabled = false;
	
	function Ctor()
	{
		_imageActive = new Image();
		_imageInActive = new Image();
		initImages(strImageActiveURL, strImageInActiveURL);
    }
    
    function initImages(strImageActiveURL, strImageInActiveURL)
    {
		if (strImageActiveURL)
		{
			_imageActive.src = String(strImageActiveURL);
			_imageActive.id = _imageId;
			if (document.getElementById && document.getElementById(_titleId))
		    {
		        document.getElementById(_titleId).appendChild(_imageActive);
		    }
        }
        
		if (strImageInActiveURL)
			_imageInActive.src = String(strImageInActiveURL);
	}
	this.initImages = initImages;
	
	function enable()
	{
		if (document.images[_imageId])
		{
			document.images[_imageId].src = _imageActive.src;
			document.images[_imageId].className = _imageActiveStyle;
		}
		
		if (document.getElementById && document.getElementById(_titleId))
		{
			document.getElementById(_titleId).className = _titleActiveStyle;
		}

		if (document.getElementById && document.getElementById(_blockToDisplayId))
		{
			document.getElementById(_blockToDisplayId).style.visibility = "visible";
		}
		
		_isEnabled = true;
		
	}
	this.enable = enable;

	function disable(blnChangeToNone)
	{
		if (document.images[_imageId])
		{
			if (!blnChangeToNone)
			{
				document.images[_imageId].src = _imageInActive.src;
				document.images[_imageId].className = _imageInActiveStyle;
			}
			else
			{
				document.images[_imageId].src = _imageActive.src;
				document.images[_imageId].className = _imageActiveStyle;
			}
		}

		if (document.getElementById && document.getElementById(_titleId))
		{
			if (!blnChangeToNone)
				document.getElementById(_titleId).className = _titleInActiveStyle;
			else
				document.getElementById(_titleId).className = _titleActiveStyle;
		}
		
		if (document.getElementById && document.getElementById(_blockToDisplayId))
		{
			document.getElementById(_blockToDisplayId).style.visibility = "hidden";
		}
		
		_isEnabled = false;
		
	}
	this.disable = disable;

	function getId()
	{
			return _id;
	}
	this.getId = getId;
	
	function getTitleId()
	{
			return _titleId;
	}
	this.getTitleId = getTitleId;
	
	function setImages(strImageActiveURL, strImageInActiveURL)
	{
		    initImages(strImageActiveURL, strImageInActiveURL);
	}
	this.setImages = setImages;
	
		
	function getName()
	{
			return _name;
	}
	this.getName = getName;
	
	Ctor();
}
PermaPackLayoutControllerItem.prototype = new ILayoutControllerItem();

LayoutController.Instance.addItem(new PermaPackLayoutControllerItem(
    /*name*/               "",
    /*id*/                 "hnavitem0",
    /*titleId*/            "hnavitem0Title",
    /*titleActiveStyle*/   "aktiv",
    /*titleInActiveStyle*/ "",
    /*imageId*/            "",
    /*imageActiveURL*/     "",
    /*imageInActiveURL*/   "",
    /*imageActiveStyle*/   "",
    /*imageInActiveStyle*/ "",
    /*blockToDisplayId*/   "" ));


LayoutController.Instance.addItem(new PermaPackLayoutControllerItem(
    /*name*/               "flexverpackung",
    /*id*/                 "hnavitem1",
    /*titleId*/            "hnavitem1Title",
    /*titleActiveStyle*/   "aktiv",
    /*titleInActiveStyle*/ "",
    /*imageId*/            "hnavitem1Image",
    /*imageActiveURL*/     "",
    /*imageInActiveURL*/   "",
    /*imageActiveStyle*/   "img_flexverpackung_aktiv",
    /*imageInActiveStyle*/ "img_flexverpackung",
    /*blockToDisplayId*/   "hnavitem1Sub" ));

LayoutController.Instance.addItem(new PermaPackLayoutControllerItem(
    /*name*/               "bau",
    /*id*/                 "hnavitem2",
    /*titleId*/            "hnavitem2Title",
    /*titleActiveStyle*/   "aktiv",
    /*titleInActiveStyle*/ "",
    /*imageId*/            "hnavitem2Image",
    /*imageActiveURL*/     "",
    /*imageInActiveURL*/   "",
    /*imageActiveStyle*/   "img_bau_aktiv",
    /*imageInActiveStyle*/ "img_bau",
    /*blockToDisplayId*/   "hnavitem2Sub" ))
	
LayoutController.Instance.addItem(new PermaPackLayoutControllerItem(
    /*name*/               "industrie",
    /*id*/                 "hnavitem3",
    /*titleId*/            "hnavitem3Title",
    /*titleActiveStyle*/   "aktiv",
    /*titleInActiveStyle*/ "",
    /*imageId*/            "hnavitem3Image",
    /*imageActiveURL*/     "",
    /*imageInActiveURL*/   "",
    /*imageActiveStyle*/   "img_industrie_aktiv",
    /*imageInActiveStyle*/ "img_industrie",
    /*blockToDisplayId*/   "hnavitem3Sub" ))
		
LayoutController.Instance.addItem(new PermaPackLayoutControllerItem(
    /*name*/               "retail",
    /*id*/                 "hnavitem4",
    /*titleId*/            "hnavitem4Title",
    /*titleActiveStyle*/   "aktiv",
    /*titleInActiveStyle*/ "",
    /*imageId*/            "hnavitem4Image",
    /*imageActiveURL*/     "",
    /*imageInActiveURL*/   "",
    /*imageActiveStyle*/   "img_retail_aktiv",
    /*imageInActiveStyle*/ "img_retail",
    /*blockToDisplayId*/   "hnavitem4Sub" ))