var eye_startx = new Array();
var eye_starty = new Array();
var eye_x = new Array();
var eye_y = new Array();
var eye_dir = new Array();
var max_x = new Array();
var max_y = new Array();
var face_x, face_y;
var mdir = new Array();
var tinyfaceFrame = 0;

var mouse_x, mouse_y;

var tongueState = "closed";
var tongueMarginT = 0;
var tongueMargin = 0;

eye_startx[0] = 102;
eye_starty[0] = 78;

eye_startx[1] = 248;
eye_starty[1] = 82;

function mouseInit(){
	eye_x[0] = eye_startx[0];
	eye_x[1] = eye_startx[1];
	eye_y[0] = eye_starty[0];
	eye_y[1] = eye_starty[1];
	
	moveElement('eye0',eye_x[0],eye_y[0]);
	moveElement('eye1',eye_x[1],eye_y[1]);
	
	face_x = getX(document.getElementById('face'));
	face_y = getY(document.getElementById('face'));
}

function moveElement(element,xpos,ypos){
	var el = document.getElementById(element);
	el.style.left = xpos + 'px';
	el.style.top = ypos + 'px';
}

var IE;
var tempX = 0
var tempY = 0

function init(){
	
	if(document.getElementById('face')){
		IE = document.all?true:false
		if (IE) {
			document.onmousemove = getMouseXY;
		}else{
			document.addEventListener('mousemove',getMouseXY,false);
		}
	
		mouseInit();
		blinkInit();
		animateTongue();
	
		var eyepoke1 = document.getElementById('eyepoke1').getElementsByTagName('img')[0];
		eyepoke1.onmousedown = function(){
			var img = this.parentNode.getElementsByTagName('img');
			img[1].style.display = 'inline-block';
		}
	
		var eyepoke1 = document.getElementById('eyepoke2').getElementsByTagName('img')[0];
		eyepoke1.onmousedown = function(){
			var img = this.parentNode.getElementsByTagName('img');
			img[1].style.display = 'inline-block';
		}
	
		var nose = document.getElementById('nose');
		nose.onclick = toggleTongue;
		nose.onmouseover = hoverNose;
		nose.onmouseout = hoverNose;
	
		moveEverything();
		
	}
	if(document.getElementById('tinyface')){
		tinyface_post = 64;
		tinyface_pos = 64;
		el = document.getElementById('tinyface');
		el.style.top = tinyface_pos + 'px';
		setTimeout('tinyfaceAnim();',Math.random() * 20000);
		animate_tinyface();
	}
	if(document.getElementById('portfolio_image')){
		portfolio_init();
	}
}

function tinyfaceAnim(){
	switch(tinyfaceFrame){
		case 0:
			document.getElementById('tinyface0').style.display='block';
			document.getElementById('tinyface1').style.display='none';
			document.getElementById('tinyface2').style.display='none';
			document.getElementById('tinyface').parentNode.style.left = Math.random() * 90 + '%';
			tinyface_post = 0;
			tinyfaceFrame = 1;
			setTimeout('tinyfaceAnim();',1000);
		break;
		case 1:
			document.getElementById('tinyface0').style.display='none';
			document.getElementById('tinyface1').style.display='block';
			document.getElementById('tinyface2').style.display='none';
			tinyfaceFrame = 2;
			setTimeout('tinyfaceAnim();',400);
		break;
		case 2:
			document.getElementById('tinyface0').style.display='block';
			document.getElementById('tinyface1').style.display='none';
			document.getElementById('tinyface2').style.display='none';
			tinyfaceFrame = 3;
			setTimeout('tinyfaceAnim();',400);
		break;
		case 3:
			document.getElementById('tinyface0').style.display='none';
			document.getElementById('tinyface1').style.display='none';
			document.getElementById('tinyface2').style.display='block';
			tinyfaceFrame = 4;
			setTimeout('tinyfaceAnim();',400);
		break;
		case 4:
			document.getElementById('tinyface0').style.display='block';
			document.getElementById('tinyface1').style.display='none';
			document.getElementById('tinyface2').style.display='none';
			tinyfaceFrame = 5;
			setTimeout('tinyfaceAnim();',1000);
		break;
		case 5:
			document.getElementById('tinyface0').style.display='block';
			document.getElementById('tinyface1').style.display='none';
			document.getElementById('tinyface2').style.display='none';
			tinyface_post = 64;
			tinyfaceFrame = 0;
			setTimeout('tinyfaceAnim();',Math.random() * 30000);
		break;
	}
}

function animate_tinyface(){
	dif = tinyface_post - tinyface_pos;
	dif = dif / 10;
	tinyface_pos += dif;
	tinyface_pos = tinyface_pos;
	var el = document.getElementById('tinyface');
	el.style.top = Math.round(tinyface_pos) + 'px';
	setTimeout('animate_tinyface()',10);
}

function getY( oElement ){
	var iReturnValue = 0;
	while( oElement != null ) {
		iReturnValue += oElement.offsetTop;
		oElement = oElement.offsetParent;
	}
	return iReturnValue;
}

function getX( oElement ){
	var iReturnValue = 0;
	while( oElement != null ) {
		iReturnValue += oElement.offsetLeft;
		oElement = oElement.offsetParent;
	}
	return iReturnValue;
}

window.onload = init;

function moveEverything(){
	face_x = getX(document.getElementById('face'));
	face_y = getY(document.getElementById('face'));
	
	moveElement('eyelid1',face_x + eye_startx[0],face_y + eye_starty[0]);
	moveElement('eyelid2',face_x + eye_startx[1],face_y + eye_starty[1]);
	
	moveElement('eyepoke1',face_x + eye_startx[0],face_y + eye_starty[0]);
	moveElement('eyepoke2',face_x + eye_startx[1],face_y + eye_starty[1]);
	
	moveElement('tongue',face_x,face_y);
	moveElement('nose',face_x,face_y);
}

function getMouseXY(e) {
	
	moveEverything();
	
	if (IE) { // grab the x-y pos.s if browser is IE
		tempX = event.clientX + document.body.scrollLeft;
		tempY = event.clientY + document.body.scrollTop;
	} else {  // grab the x-y pos.s if browser is NS
		tempX = e.pageX;
		tempY = e.pageY;
	}  
	// catch possible negative values in NS4
	if (tempX < 0){tempX = 0}
	if (tempY < 0){tempY = 0}  
	// show the position values in the form named Show
	// in the text fields named MouseX and MouseY
	mouse_x = tempX;
	mouse_y = tempY;
	
	dir = point_direction(face_x + eye_startx[0],face_y + eye_starty[0],mouse_x,mouse_y);
	dx = (face_x + eye_startx[0]) + 24 * Math.cos(dir * Math.PI / 180);
	dy = (face_y + eye_starty[0]) - 24 * Math.sin(dir * Math.PI / 180);
	
	if(mouse_x > face_x + eye_startx[0]){
		dx = min(mouse_x,dx);
	}else{
		dx = max(mouse_x,dx);
	}
	if(mouse_y > face_y + eye_starty[0]){
		dy = min(mouse_y,dy);
	}else{
		dy = max(mouse_y,dy);
	}
	
	eye_x[0] = dx;
	eye_y[0] = dy;
	
	dir = point_direction(face_x + eye_startx[1],face_y + eye_starty[1],mouse_x,mouse_y);
	dx = (face_x + eye_startx[1]) + 20 * Math.cos(dir * Math.PI / 180);
	dy = (face_y + eye_starty[1]) - 20 * Math.sin(dir * Math.PI / 180);
	
	if(mouse_x > face_x + eye_startx[1]){
		dx = min(mouse_x,dx);
	}else{
		dx = max(mouse_x,dx);
	}
	if(mouse_y > face_y + eye_starty[1]){
		dy = min(mouse_y,dy);
	}else{
		dy = max(mouse_y,dy);
	}
	
	eye_x[1] = dx;
	eye_y[1] = dy;

	moveElement('eye0',eye_x[0],eye_y[0]);
	moveElement('eye1',eye_x[1],eye_y[1]);
	return true
}

function debug(text){
	document.getElementById('debug').innerHTML = text;
}

function min(val1,val2){
	switch(val1 > val2){
		case true:
			return val2;
		break;
		case false:
			return val1;
		break;
	}
}

function max(val1,val2){
	switch(val1 > val2){
		case false:
			return val2;
		break;
		case true:
			return val1;
		break;
	}
}

function point_direction(x1,y1,x2,y2){
	var dir;
	
	dir = Math.atan2(y2-y1,x2-x1)*180/Math.PI;
	dir = dir % 360;
	if(dir < 0){
		dir += 360;
	}
	
	return 360 - dir;
}

function blinkInit(){
	document.getElementById('eyelid1').style.display='none';
	document.getElementById('eyelid2').style.display='none';
	
	setTimeout('closeEyes()',Math.random() * 10000);
}

function closeEyes(){
	document.getElementById('eyelid1').style.display='block';
	document.getElementById('eyelid2').style.display='block';
	
	setTimeout('openEyes()',200);
}

function openEyes(){
	document.getElementById('eyepoke1').getElementsByTagName('img')[1].style.display = 'none';
	document.getElementById('eyepoke2').getElementsByTagName('img')[1].style.display = 'none';
	
	document.getElementById('eyelid1').style.display='none';
	document.getElementById('eyelid2').style.display='none';
	
	setTimeout('closeEyes()',Math.random() * 10000);
}

function toggleTongue(){
	switch(tongueState){
		case 'closed':
			tongueState = 'open';
			tongueMarginT = 188;
		break;
		case 'open':
			tongueState = 'closed';
			tongueMarginT = 0;
		break;
	}
}

function animateTongue(){
	dist = tongueMarginT - tongueMargin;
	dist = dist / 15;
	tongueMargin += dist;
	document.getElementById('tongue').style.marginTop = tongueMargin + 'px';
	setTimeout('animateTongue()',10);
}

function hoverNose(){
	var el = this.getElementsByTagName('img')[0];
	old = el.src;
	el.src = el.alt;
	el.alt = old;
}

function sendEmail(){
	var url = 'ajax-mail.php';
	var params = '';
	params += '?name=' + document.contactForm.name.value;
	params += '&email=' + document.contactForm.email.value;
	params += '&subject=' + document.contactForm.subject.value;
	params += '&message=' + document.contactForm.message.value;
	url = url + params;
	
	document.getElementById('emailSending').style.display = 'block';
	document.getElementById('emailSuccess').style.display = 'none';
	document.getElementById('emailFail').style.display = 'none';
	
	var xmlhttp;
	if (window.XMLHttpRequest)
	{
		// code for IE7+, Firefox, Chrome, Opera, Safari
		xmlhttp=new XMLHttpRequest();
	}else if (window.ActiveXObject){
		// code for IE6, IE5
		xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
	}else{
		alert("Your browser does not support XMLHTTP!");
	}

	xmlhttp.onreadystatechange=function()
	{
		if(xmlhttp.readyState==4)
		{
			if(xmlhttp.responseText=='success'){
				document.getElementById('emailSending').style.display = 'none';
				document.getElementById('emailSuccess').style.display = 'block';
				document.getElementById('emailFail').style.display = 'none';
			}else{
				document.getElementById('emailSending').style.display = 'none';
				document.getElementById('emailSuccess').style.display = 'none';
				document.getElementById('emailFail').style.display = 'block';
				//document.getElementById('emailFail').innerHTML = xmlhttp.responseText;
			}
		}
	}

	xmlhttp.open("GET",url,true);
	xmlhttp.send(null);
	return false;
}

function portfolio_init(){
	var el = document.getElementById('portfolio_thumbs').getElementsByTagName('a');
	for(i=0;i<el.length;i+=1){
		el[i].onclick = function(){
			element = this.getElementsByTagName('img')[0].getAttribute('alt');
			portfolio_set(this,element);
			return false;
		};
	}
	
	var el = document.getElementById('portfolio_large').onmouseover = function(){
		scrollIn('portfolio_case');
	};
	
	var el = document.getElementById('portfolio_large').onmouseout = function(){
		scrollOut('portfolio_case');
	};
}

function portfolio_set(obj,element){
	href = obj.href;
	pos = href.indexOf('img=') + 4;
	href = href.substr(pos);
	document.getElementById('portfolio_image').style.display='none';
	document.getElementById('portfolio_image').src='images/' + href;
	document.getElementById('portfolio_image').onload = function(){
		fade_in('portfolio_image');
	};
	document.getElementById('portfolio_overlay').href=obj.getAttribute('title');
	var el = document.getElementById('portfolio_case_' + element);
	a = document.getElementById('portfolio_case').getElementsByTagName('div');
	for(i=0;i<a.length;i+=1){
		if(a[i].className==""){
			a[i].style.display = 'none';
		}
	}
	el.style.display = 'block';
}

function fade_in(element){
	var el = document.getElementById(element);
	el.style.display='block';
	if(el){
		el.style.opacity = 0;
		el.style.filter = 'Alpha(opacity=0)';
		for(i=0;i<=100;i+=5){
			setTimeout('changeOpacity(\'' + element + '\',' + i + ')',i*5);
		}
		return true;
	}else{
		return false;
	}
}

function changeOpacity(element,opacity){
	var el = document.getElementById(element);
	el.style.opacity = opacity / 100;
	el.style.filter = 'Alpha(opacity=' + opacity + ')';
}

function scrollIn(element){
	var el = document.getElementById(element);
	if(el){
		el.style.top = '85%';
		for(i=0;i<=80;i+=5){
			setTimeout('changeVPos(\'' + element + '\',' + i + ')',i*2);
		}
		return true;
	}else{
		return false;
	}
}

function scrollOut(element){
	var el = document.getElementById(element);
	if(el){
		el.style.top = '5%';
		for(i=0;i<=85;i+=5){
			setTimeout('changeVPos2(\'' + element + '\',' + i + ')',i*2);
		}
		return true;
	}else{
		return false;
	}
}

function changeVPos(element,vpos){
	var el = document.getElementById(element);
	el.style.top = 85 - vpos + '%';
}

function changeVPos2(element,vpos){
	var el = document.getElementById(element);
	el.style.top = vpos + '%';
}