window.onload = init;

function init()
{
	var objContent = document.getElementById('content');
	var objSide = document.getElementById('sidebar');
	var objPanel = document.createElement('div');
	var objButton = document.createElement('input');
	var objImage = document.createElement('img');
	var iHeight = objSide.offsetHeight + 'px';

	objPanel.setAttribute('id', 'slide');
	objButton.style.height = iHeight;
	objButton.setAttribute('type', 'image');
	
	objButton.setAttribute('src', 'transparent.gif');
	objButton.setAttribute('alt', 'close panel');

	objButton.onclick = function(){return togglePanel(this);};
	objButton.onfocus = function(event){return focusPanel(this, event);};
	objButton.onblur = function(event){return focusPanel(this, event);};
	objButton.onmouseover = function(event){return focusPanel(this, event);};
	objButton.onmouseout = function(event){return focusPanel(this, event);};

	objPanel.appendChild(objButton);

	objSide.style.display = 'block';
	objContent.parentNode.insertBefore(objPanel, objContent);
}

function togglePanel(objElement)
{
	var objSide = document.getElementById('sidebar');
	var objContent = document.getElementById('content');

	if (objSide.style.display == 'none')
	{
		objSide.style.display = 'block';
		objContent.style.marginLeft = '10em';
		objElement.style.background = '#ccc url(closefocus.gif) no-repeat 0 50%';
		objElement.setAttribute('alt', 'Close panel');
	}
	else
	{
		objSide.style.display = 'none';
		objContent.style.marginLeft = '2em';
		objElement.style.background = '#ccc url(openfocus.gif) no-repeat 0 50%';
		objElement.setAttribute('alt', 'Open panel');
	}

	return false;
}

function focusPanel(objElement, objEvent)
{
	var objSide = document.getElementById('sidebar');

	objEvent = objEvent || event;

	if (objEvent.type == 'blur' || objEvent.type == 'mouseout')
	{
		if (objSide.style.display == 'block')
		{
			objElement.style.background = '#e1e3e5 url(close.gif) no-repeat 0 50%';
			objElement.setAttribute('alt', 'Close panel');
		}
		else
		{
			objElement.style.background = '#e1e3e5 url(open.gif) no-repeat 0 50%';
			objElement.setAttribute('alt', 'Open panel');
		}
	}
	else
	{
		if (objSide.style.display == 'block')
		{
			objElement.style.background = '#ccc url(closefocus.gif) no-repeat 0 50%';
			objElement.setAttribute('alt', 'Close panel');
		}
		else
		{
			objElement.style.background = '#ccc url(openfocus.gif) no-repeat 0 50%';
			objElement.setAttribute('alt', 'Open panel');
		}
	}
}
