function start()
{
	shadows.start();
	popup.start();
	contact.start();
}

var shadows =
{
	'start': function()
	{
		shadows.data.ids = shadowsdata;
		shadows.getObjects();
		shadows.place();
	},
	
	'getObjects': function()
	{
		for(var i = 0; i < shadows.data.ids.length; i++)
		{
			shadows.data.thumbs[ shadows.data.ids[i] ]  = document.getElementById('thumb_'  + shadows.data.ids[i]);
			shadows.data.shadows[ shadows.data.ids[i] ] = document.getElementById('shadow_' + shadows.data.ids[i]);
		}
	},
	
	'place': function()
	{
		for(var i = 0; i < shadows.data.ids.length; i++)
		{
			shadows.data.shadows[ shadows.data.ids[i] ].style.top  = findPosY( shadows.data.thumbs[ shadows.data.ids[i] ] ) + 'px';
			shadows.data.shadows[ shadows.data.ids[i] ].style.left = findPosX( shadows.data.thumbs[ shadows.data.ids[i] ] ) + 'px';
			shadows.data.shadows[ shadows.data.ids[i] ].style.height = shadows.data.thumbs[ shadows.data.ids[i] ].offsetHeight + 'px';
			shadows.data.shadows[ shadows.data.ids[i] ].style.width = shadows.data.thumbs[ shadows.data.ids[i] ].offsetWidth + 'px';
			opacity(shadows.data.shadows[ shadows.data.ids[i] ], shadows.data.opacity);
		}
	},
	
	'mouseover': function(id)
	{
		shadows.data.status[id] = 'mouseover';
		shadows.up(id);
	},
	'mouseout': function(id)
	{
		shadows.data.status[id] = 'mouseout';
		shadows.down(id);
	},
	
	'up': function(id)
	{
		if(shadows.data.status[id] == 'mouseover')
		{
			if(	shadows.data.shadows[id].style.opacity > 0 )
			{
				opacity( shadows.data.shadows[id], parseInt(shadows.data.shadows[id].style.opacity * 100) - shadows.data.step );
				setTimeout('shadows.up(' + id + ');', shadows.data.interval);
			}
		}
	},
	
	'down': function(id)
	{
		if(shadows.data.status[id] == 'mouseout')
		{
			if(	shadows.data.shadows[id].style.opacity * 100 < shadows.data.opacity )
			{
				opacity( shadows.data.shadows[id], parseInt(shadows.data.shadows[id].style.opacity * 100) + shadows.data.step );
				setTimeout('shadows.down(' + id + ');', shadows.data.interval);
			}
		}
	},
	
	'data':
	{
		'ids'     : undefined,
		'shadows' : Array(),
		'thumbs'  : Array(),
		'status'  : Array(),
		'step'    : 1,
		'opacity' : 30,
		'interval': 10
	}
}

var contact =
{
	'start': function()
	{
		contact.data.container = document.getElementById('contact');
	},
	
	'open': function()
	{
		contact.data.container.style.display = 'block';
		contact.down();
	},
	
	'close': function()
	{
		contact.data.container.style.display = 'none';
		contact.data.container.style.height = '0px';
		shadows.place();
	},
	
	'down': function()
	{
		if(contact.data.container.offsetHeight < contact.data.height)
		{
			contact.data.container.style.height = parseInt(contact.data.container.offsetHeight + contact.data.step) + 'px';
			shadows.place();
			setTimeout('contact.down();', contact.data.interval);
			
			//hoogte van de overlay fixen
			//dmv hoogte van image + panel.style.top van 
			//dit moet gebeuren bij het openen en sluiten
		}
        else
        {
            popup.getObjects();
        }
	},
	
    'submit': function()
    {
        var name = document.getElementById('form_name');
        var email = document.getElementById('form_email');
        var message = document.getElementById('form_message');
        var result = document.getElementById('form_result');
        if(name.value != "" && email.value != "" && message.value != "")
        {
            result.innerHTML = 'Sending message, please be patient.';
            ajax('contact.php', 'name=' + name.value + '&email=' + email.value + '&message=' + message.value, 'contact.result');
        }
        else
        {
            //alert(name.value);
            //alert(email.value);
            //alert(message.value);
            result.innerHTML = 'Please fill in all fields.';
        }
    },

    'result': function(value)
    {
        value = value.split('<!>');
        if(value[0] == 'OK')
        {
            var name = document.getElementById('form_name');
            var email = document.getElementById('form_email');
            var message = document.getElementById('form_message');
            var reslt = document.getElementById('form_result');
            name.value = "";
            email.value = "";
            message.value = "";
            reslt.innerHTML = value[1];
        }
        else
        {
            var reslt = document.getElementById('form_result');
            reslt.innerHTML = value[1];
        }
    },

	'data':
	{
		'container': undefined,
		'step': 5,
		'interval': 1,
		'height': 220
	}
}

var popup =
{
	'start': function()
	{
		popup.getObjects();
		popup.data.info = imageinfo;
	},
	
	'getObjects': function()
	{
		popup.data.head = document.getElementById('popup_head');
		popup.data.body = document.getElementById('popup_body');
		popup.data.overlay = document.getElementById('overlay');
		popup.data.panel   = document.getElementById('panel');
		popup.data.image   = document.getElementById("panel_image");
		popup.data.overlay.style.height = document.getElementById('body').offsetHeight + 'px';
		opacity(popup.data.overlay, 0);
	},
	
	'open': function(id)
	{
		popup.data.overlay.style.display = 'block';
		popup.data.overlayStatus = "open";
		popup.overlayUp();
		popup.panelStart(id);
		popup.data.panel.innerHTML = "<img id='panel_image' src='content/" + popup.data.info[id][4] + "/" + popup.data.info[id][0] + ".png' onload='popup.showImage();' onclick='popup.hide();' />";
	},
	
	'overlayUp': function()
	{
		if(popup.data.overlayStatus == "open")
		{
			if(popup.data.overlay.style.opacity * 100 < popup.data.opacity)
			{			
				opacity(popup.data.overlay, (popup.data.overlay.style.opacity * 100) + popup.data.step);
				setTimeout('popup.overlayUp();', popup.data.interval);
			}
		}
	},
	
	'panelStart': function(id)
	{
		popup.data.panel.style.display = "block";
		popup.data.panelStatusX = "opening";
		popup.data.panelStatusY = "opening";
		popup.data.activeid    = id;
		//get the middle of the page
		var center = findPosX(document.getElementById('worklayer')) + (document.getElementById('worklayer').offsetWidth / 2);
		var xStart = center - (popup.data.info[popup.data.activeid][2] / 2);
		var yStart = document.documentElement.scrollTop + ((document.documentElement.clientHeight - popup.data.info[popup.data.activeid][3]) / 2);
		
		popup.data.panel.style.left    = xStart + 'px';
		popup.data.panel.style.top     = yStart + 'px';
		popup.data.panel.style.display = 'block';
		popup.data.panel.style.width   = "0px";
		popup.data.panel.style.height  = "0px";
		
		opacity(popup.data.panel, 100);
		
		popup.panelHorizontal();
		popup.panelVertical();
	},
	
	'panelHorizontal': function()
	{
		if(popup.data.panelStatusX = "opening")
		{
			if(popup.data.panel.offsetWidth >= popup.data.info[popup.data.activeid][2])
			{
				popup.data.panelStatusX = "open";
				popup.showInfo();
			}
			else
			{
				popup.data.panel.style.width = parseInt(popup.data.xstep + popup.data.panel.offsetWidth) + 'px';
				setTimeout('popup.panelHorizontal();', (popup.data.interval * (popup.data.opacity / popup.data.step) / (popup.data.info[popup.data.activeid][2] / popup.data.xstep)));
			}
		}
	},
	
	'panelVertical': function()
	{
		if(popup.data.panelStatusY = "opening")
		{
			
			if(popup.data.panel.offsetHeight >= popup.data.info[popup.data.activeid][3])
			{
				popup.data.panelStatusY = "open";
				popup.showInfo();
			}
			else
			{
				popup.data.panel.style.height = parseInt(popup.data.xstep + popup.data.panel.offsetHeight) + 'px';
				setTimeout('popup.panelVertical();', (popup.data.interval * (popup.data.opacity / popup.data.step) / (popup.data.info[popup.data.activeid][3] / popup.data.xstep)));
			}
		}
	},
	
	'showImage': function()
	{
		if(popup.data.panelStatusX == "open")
		{
			if(popup.data.panelStatusY == "open")
			{
				document.getElementById('panel_image').style.width  = "100%";
				document.getElementById('panel_image').style.height = "100%";
			}
			else
			{
				setTimeout("popup.showImage();", 10);
			}
		}
		else
		{
			setTimeout("popup.showImage();", 10);
		}
	},
	
	'showInfo': function()
	{
		if(popup.data.panelStatusX == "open" && popup.data.panelStatusY == "open")
		{
			popup.data.head.innerHTML = popup.data.info[popup.data.activeid][5];
			popup.data.body.innerHTML = popup.data.info[popup.data.activeid][1];
			
			popup.data.head.style.left  = parseInt(findPosX(popup.data.panel) + 3)+ 'px';
			popup.data.head.style.top   = parseInt(findPosY(popup.data.panel) + 3) + 'px';
			popup.data.head.style.width = parseInt(popup.data.panel.offsetWidth - 6) + 'px';
			
			popup.data.body.style.left  = findPosX(popup.data.panel) + 'px';
			popup.data.body.style.top   = parseInt(findPosY(popup.data.panel) + popup.data.panel.offsetHeight - 3) + 'px';
			popup.data.body.style.width = parseInt(popup.data.panel.offsetWidth - 16) + 'px';
			
			
			popup.data.head.style.display = 'block';
			opacity(popup.data.head, 50);
			opacity(popup.data.body, 100);
			popup.data.body.style.display = 'block';
		}
		else
		{
			setTimeout('popup.showInfo();', 250);	
		}
	},
	
	'hide': function()
	{
		popup.data.panelStatusX  = "closing";
		popup.data.panelStatusY  = "closing";
		popup.data.overlayStatus = "closing";
		if(popup.data.overlay.style.opacity > 0)
		{
			opacity(popup.data.overlay, (popup.data.overlay.style.opacity * 100) - 10);
		}
		else
		{
			popup.data.overlay.style.display = "none";
			popup.data.overlayStatus = "closed";
		}
		if(popup.data.panel.style.opacity > 0)
		{
			opacity(popup.data.panel, (popup.data.panel.style.opacity * 100) - 10);
			opacity(popup.data.head, (popup.data.panel.style.opacity * 100) - 10);
			opacity(popup.data.body, (popup.data.panel.style.opacity * 100) - 10);
		}
		else
		{
			popup.data.head.style.display = "none";
			popup.data.body.style.display = "none";
			popup.data.panel.style.display = "none";
			popup.data.panelStatusX = "closed";
			popup.data.panelStatusY = "closed";
		}
		if(popup.data.panelStatusX != "closed" || popup.data.overlayStatus != "closed")
		{
			setTimeout("popup.hide();", 10);	
		}
		
	},
	
	'data':
	{
		'overlayStatus': undefined, 
		'panelStatusX' : undefined,
		'panelStatusY' : undefined,
		'overlay'      : undefined,
		'panel'        : undefined,
		'image'        : undefined,
		'step'         : 10,
		'interval'     : 50,
		'opacity'      : 70,
		'xstep'		   : 25,
		'activeid'     : undefined,
		'head'		   : undefined,
		'body'         : undefined,
		'info'	       : //id{name,description,x,y}
		{
			1: {0: 'marble', 1:'this is the description', 2:450, 3:325, 4:'print', 5: 'TITLEE'}
		}
	}
}

function findPosX(obj)
{
	var curleft = 0;
	if(obj.offsetParent)
	while(1) 
	{
		curleft += obj.offsetLeft;
		if(!obj.offsetParent)
			break;
		obj = obj.offsetParent;
	}
	else if(obj.x)
		curleft += obj.x;
	return curleft;
}

function findPosY(obj)
{
	var curtop = 0;
	if(obj.offsetParent)
	while(1)
	{
		curtop += obj.offsetTop;
		if(!obj.offsetParent)
			break;
		obj = obj.offsetParent;
	}
	else if(obj.y)
		curtop += obj.y;
	return curtop;
}

function opacity( object, level )
{
	object.style.opacity      = ( level / 100 );
	object.style.MozOpacity   = ( level / 100 );
	object.style.KhtmlOpacity = ( level / 100 );
	object.style.filter       = "alpha(opacity=" + level + ")";
}

function getHTTP() 
{
    var r;
    
    try 
    {
        r = new XMLHttpRequest();
    }
    catch (e1)
    {
        try
        {
            r = new ActiveXObject("Msxml2.XMLHTTP");
        } 
        catch (e2)
        {
            try
            {
                r = new ActiveXObject("Microsoft.XMLHTTP");
            } 
            catch (e3)
            {
                r = false;
            }
        }
    }
    
    if (!r)
    {
        r = null;
    }
    return r;
}

function ajax(page, vars, callback)
{
    //xmlhttp object aanmaken.
    var xmlhttp = getHTTP();

    //POSTEN, pagina versturen, asynchronous
    xmlhttp.open("POST", page, true);
    //Header versturen
    xmlhttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
    
    //Onreadystate functie
    xmlhttp.onreadystatechange = function()
    {
        //Controleren of de functie succesvol is geladen.
        if(xmlhttp.readyState == 4)
        {
            eval(callback + '("' + xmlhttp.responseText + '");');
        }
    }
    //Vars door sturen.
    xmlhttp.send(vars);
}