if(document.getElementById && document.createTextNode) Event.observe(window, 'load', function()
{
	document.body.setAttribute('id', "js");
    var portfolio = $('portfolio');
	var portfolio2 = $('portfolio2');
    $A($$('#portfolio2 li p')).each(function(p){p.style.padding = '5px 15px'});
	var btn_x = $('btn_x');
	var btn_webDesign = $('btn_webDesign');
	var btn_webDevelopment = $('btn_webDevelopment');
    var btn_viewExample = $('btn_viewExample');
    
    resetIt();//start fresh
	
	//Define the event listeners
	var portLinks = $A(portfolio.getElementsByTagName('a'));//design
	portLinks.each
	(
		function(portLink)
		{
			Event.observe(portLink, 'click', displayDesign, false);
		}
	);
	var portLinks2 = $A(portfolio2.getElementsByTagName('a'));//nav
	portLinks2.each
	(
	 	function(portLink2)
		{
			Event.observe(portLink2, 'click', displayDevelop, false);
		}
	);
	Event.observe(btn_x, 'click', resetEverything);
    Event.observe(btn_webDevelopment,'click',jsEnabled, false);
    Event.observe(btn_viewExample,'click',displayNav, false);
    Event.observe(btn_webDesign,'click',resetEverything, false);
    
});
function resetIt()
{
	
    $('sidebar').style.display = 'inline';
	$('footer').style.position='static';
	$('footer').style.right='';
	$('largeImage').src = 'images/blank.gif';
	$('portfolio').style.display = 'block';
	$('img_portfolio').style.left = '-9999px';
	$('portfolio2').style.left = '';
	$('portfolio2').style.top = '';
	
	closeNav();
	closeP();
};
function resetEverything(e)
{
	resetIt();
    $('container').style.background = 'none';
    $('container').className = '';
	if($('btn_webDesign').parentNode.style.top == '299px')
    {
    	new Effect.Appear($('btn_webDesign'),{duration:1});
        new Effect.Move($('btn_webDesign').parentNode,{mode:'absolute', y:0});
        new Effect.Move($('portfolio'),{mode:'absolute', y:0});
    }
	if(e)
	{
		Event.stop(e);
	}
};
function closeNav()
{
	var children = $A($('portfolio2').childNodes);
	children.each(function(child){if(child.childNodes[1]){child.childNodes[1].style.display='none';}});
};
function closeP()
{
	var children = $A($('portfolio').childNodes[0].childNodes);
	children.each(function(child){if(child.childNodes[1]){child.childNodes[1].style.display='none';}});
};
function getHTML(loc, src)
{
	var url = 'includes/getData.php';
	var pars = 'obj=' + src;
	
	var myAjax = new Ajax.Updater(
		loc, 
		url, 
		{
			method: 'get', 
			parameters: pars,
			onFailure: showError
		});
};
function showError()
{
	alert('sorry there was an error');
};
function jsEnabled(e)
{
	Event.stop(e);	
};
function displayDesign(e) 
{
	Event.stop(e);	
	if(this.firstChild.nodeName == 'IMG')
	{
		resetIt();
		//move large image into place
		$('sidebar').style.display = 'none';
		var srcThumb = this.firstChild.src;
		srcThumb.toString();
		$('largeImage').src = srcThumb.replace('thumb', 'large');
		$('img_portfolio').style.left = '53px';
		//close all the paragraphs for the design
		closeP();
		//show the new one
		getHTML(this.nextSibling, srcThumb);
		this.nextSibling.style.display = 'block';
	}
    
};

function displayNav(e){
	
	Event.stop(e);
    if( $('container').className == 'displayNav')
    {
    	resetEverything();
    }
    else
    {
        $('container').style.background = 'url(images/bg_container.gif) repeat-y 449px';
        $('container').className = 'displayNav';
        //hide the sidebar and the footer
        $('sidebar').style.display = 'none';
        $('footer').style.position='relative';
        $('footer').style.right='315px';
        //keep the nav in place
        $('portfolio2').style.left = '448px';
        //reset the nav
        
        closeP();
        
        //move the web design header down
        new Effect.Fade($('btn_webDesign'),{duration:2, to:0.3});
        new Effect.Move($('btn_webDesign').parentNode,{mode:'absolute', y:299});
        //clear the image
        $('largeImage').src = 'images/choose.gif';
        //move into position
        $('img_portfolio').style.left = '53px';
        new Effect.Move($('portfolio'),{mode:'absolute', y:-65});
  	}
}
function displayDevelop(e)
{
	Event.stop(e);	
	if(this.nextSibling.style.display=='block')//if open
	{	
		this.nextSibling.style.display='none';
        $('portfolio2').style.top = '-3px';
        $('largeImage').src = 'images/choose.gif';
        //resetEverything();
	}
	else//if closed or other is open
	{
		var num = this.getAttribute('tabindex');
        var i = 30 - 48*num;
        if(num > 1){i = i - 4;};
        $('portfolio2').style.top = i + 'px';
        //reset the nav
		closeNav();
		//clear the image
		$('largeImage').src = 'images/blank.gif';
		//display large image
		var srcThumb = this.firstChild.src;
		srcThumb.toString();
		$('largeImage').src = srcThumb.replace('thumb', 'large');
		
		getHTML(this.nextSibling, srcThumb);
		
		this.nextSibling.style.display = 'block';
	}
   					
};