window.addEvent('domready', function()
{
    initialise();
});


function initialise()
{
    handleContextMenu();
    handleFunctionMenu();    
    handleIncoming();
}

function handleContextMenu() {
	handleMenuButton('li1', 'content01', 'bck1', '', '');
	handleMenuButton('li2', 'content02', 'bck2', 'context1', 'img1');
	handleMenuButton('li3', 'content03', 'bck3', 'context5', 'img5');
	handleMenuButton('li4', 'content04', 'bck4', 'context9', 'img9');
	handleMenuButton('li5', 'content05', 'bck5', 'context13', 'img13');
}

function handleFunctionMenu()
{
    handleClick('b1', 'content02', 'img1', 'context1');
    handleClick('b2', 'content02', 'img2', 'context2');
    handleClick('b3', 'content02', 'img3', 'context3');
    handleClick('b4', 'content02', 'img4', 'context4');

    handleClick('c1', 'content03', 'img5', 'context5');
    handleClick('c2', 'content03', 'img6', 'context6');
    handleClick('c3', 'content03', 'img7', 'context7');
    handleClick('c4', 'content03', 'img8', 'context8');

    handleClick('d1', 'content04', 'img9', 'context9');
    handleClick('d2', 'content04', 'img10', 'context10');
    handleClick('d3', 'content04', 'img11', 'context11');
    handleClick('d4', 'content04', 'img12', 'context12');

    handleClick('e1', 'content05', 'img13', 'context13');
    handleClick('e2', 'content05', 'img14', 'context14');
    handleClick('e3', 'content05', 'img15', 'context15');
    handleClick('e4', 'content05', 'img16', 'context16');    
}

function resetAll()
{
    removeClasses('li1');
    removeClasses('li2');
    removeClasses('li3');
    removeClasses('li4');
    removeClasses('li5');
    removeClasses('li6');

    setInvis('content01');    
    setInvis('content02');    
    setInvis('content03');    
    setInvis('content04');    
    setInvis('content05');    
    
    removeClasses('content01');    
    removeClasses('content02');    
    removeClasses('content03');    
    removeClasses('content04');    
    removeClasses('content05');
   }

function handleIncoming() {
	var inc = queryString('id');

	switch (inc) {
		case '2':
			resetAll();
			$('li2').addClass('alt');
			$('content02').addClass('img1');
			$('content-bck').addClass('bck2');
			removeClasses('context-div');
			$('context-div').addClass('context1');
			setVis($('content02'));
			break;
		case '3':
			resetAll();
			$('li3').addClass('alt');
			$('content03').addClass('img1');
			$('content-bck').addClass('bck3');
			removeClasses('context-div');
			$('context-div').addClass('context5');
			setVis($('content03'));
			break;
		case '4':
			resetAll();
			$('li4').addClass('alt');
			$('content04').addClass('img1');
			$('content-bck').addClass('bck4');
			removeClasses('context-div');
			$('context-div').addClass('context9');
			setVis($('content04'));
			break;
		case '5':
			resetAll();
			$('li5').addClass('alt');
			$('content05').addClass('img1');
			$('content-bck').addClass('bck5');
			removeClasses('context-div');
			$('context-div').addClass('context13');
			setVis($('content05'));
			break;
		default:
	}
}
   
function handleClick(bt, el, cls, ccls) {
   	var btn = $(bt);
   	var myEl = $(el);
    var ctxt = $('context-div');

   	btn.addEvents({
   		click: function() {
   			var currCls = myEl.className;
   			var cclss = ctxt.className;
   			
   			myEl.removeClass(currCls);
            ctxt.removeClass(cclss);
            
   			myEl.addClass(cls);
   			ctxt.addClass(ccls);
   		}
   	});
}

function queryString(val) {
	var q = unescape(location.search.substr(1)).split('&');

	for (var i = 0; i < q.length; i++) {
		var t = q[i].split('=');
		if (t[0].toLowerCase() == val.toLowerCase()) return t[1];
	}
	return '';
}

function removeClasses(el)
{
    var myEl = $(el);
    
    if(myEl != null)
    {
        var clss = myEl.className;
        myEl.removeClass(clss)
    }
}

function setVis(el)
{
    var myEl = $(el);
    
    if(myEl != null)
    {
        myFx = new Fx.Morph(myEl);
        myFx.start({'opacity' : 1});
    }
}

function setInvis(el)
{
    var myEl = $(el);
    
    if(myEl != null)
    {
        myFx = new Fx.Morph(myEl);
        myFx.set({'opacity' : 0});
    }
}

function handleMenuButton(el, content, bck, sub, def)
{
    var myEl = $(el);
    var myEl2 = $(content);
    var bckg = $('content-bck');
    var contxt = $('context-div');
    
    myFx = new Fx.Morph(myEl);
        myEl.addEvents({
	    mouseenter: function ()
	        {
	            myEl.addClass('selected');
            },
	    mouseleave: function ()
	        {
	            myEl.removeClass('selected');
            },
	    click: function ()
	        {
	            resetAll();
	            myEl.addClass('alt');
	            if(myEl2 != null)
	            {
	                myEl2.addClass(def);
	                setVis(myEl2);
	            }	
                removeClasses(bckg);
	            bckg.addClass(bck);	 
	            
	            removeClasses(contxt);
	            contxt.addClass(sub);
            }
   	});  
}