var reel;
var reelMoving;
var fx;
var intervalID;
var personalOpen = false;
var personalInMotion = false;



window.addEvent('domready', function() {
	
	Lightbox.init();
	reelMoving = false;
	reel = $('reel');

	
	fx = new Fx.Styles(reel, {
		duration: 2000,
		wait: false,
		transition: Fx.Transitions.Quad.easeOut,
		'onComplete': function(){
			reelMoving = false;	
		}
	});		
	
	$('reelLeftBtn').addEvents({
		'click': function() {
			var reelPos = reel.getLeft();
			if((reelMoving == false) && (reelPos < 0)){
				reelMoving = true;
				fx.start({
					'left': [reelPos, reelPos + 580]
				});
			}
		}
	});


	$('reelRightBtn').addEvents({
		'click': function() {
			var reelPos = reel.getLeft();
			if((reelMoving == false) && (reelPos > -4640)){
				reelMoving = true;
				fx.start({
					'left': [reelPos, reelPos - 580]
				});
			}
		}
	});
    
    $('obnoxiousLeft').addEvents({
        'click': function() {
            var reelPos = reel.getLeft();
            if((reelMoving == false) && (reelPos < 0)){
                reelMoving = true;
                fx.start({
                    'left': [reelPos, reelPos + 580]
                });
            }
        }
    });


    $('obnoxiousRight').addEvents({
        'click': function() {
            var reelPos = reel.getLeft();
            if((reelMoving == false) && (reelPos > -4640)){
                reelMoving = true;
                fx.start({
                    'left': [reelPos, reelPos - 580]
                });
            }
        }
    });    
	
	if(window.ie6){
		correctPNG();
	}
	
});

function getMovieName(movieName){
	if(navigator.appName.indexOf("Microsoft")!=-1){
		return window[movieName]
	}
	else{
			return document[movieName]
	}
}

function changeFace(imgURL){
	var robot = getMovieName("robot");
	robot.changeFace(imgURL);
}

function openImageUpload(){
	var windowWidth = 300;
	var windowHeight = 200;
	var theTop=(screen.height/2)-(windowHeight/2);
	var theLeft=(screen.width/2)-(windowWidth/2);
	var features="height=" + windowHeight + ",width=" + windowWidth + ",top="+theTop+",left="+theLeft+",status=yes,toolbar=no,menubar=no,location=no";
	window.open("uploadImage.php","_blank",features);
}

function beginDeleteImage(imgURL){
	requestImages = new Ajax('deleteImage.php', {
		method: 'post',
		data: 'imgURL=' + imgURL,
		onComplete: deleteImageResponse.bind(this),
		evalScripts: false
	}).request();	
}

function deleteImageResponse(Response){
	
}

function togglePersonal(){
	if(personalInMotion == false){
		personalInMotion = true;
		
		if(personalOpen == false){
			personalOpen = true;
			viewPersonal();
		}
		else{
			personalOpen = false;
			hidePersonalContent();
		}
	}
}

function viewPersonal(){
	var containerSize = $('weeMenuContainer').getCoordinates();
	var currentHeight = containerSize['height'];
	
	var reelSize = $('htmlcontent').getCoordinates();
	var currentReelHeight = reelSize['height'];	
	
	var newHeight = currentHeight + 390;
	var newReelHeight = currentReelHeight - 390;
	var currentOpacity = 1;
	var newOpacity = 0;	
	
	var heightChange = new Fx.Style($('weeMenuContainer'), 'height', {duration:500, onComplete:showPersonalContent.bind(this)});
	heightChange.start(currentHeight, newHeight);	
	
	var reelChange = new Fx.Style($('htmlcontent'), 'height', {duration:500});
	reelChange.start(currentReelHeight, newReelHeight);		
	
	var opacityChange = new Fx.Style($('reelPadding'), 'opacity', {duration:500});
	opacityChange.start(currentOpacity, newOpacity);		
}

function hidePersonalContent(){
	var personalFadeIn = new Fx.Style($('personalContainer'), 'opacity', {duration:500,onComplete:hidePersonal.bind(this)});
	personalFadeIn.start(1, 0);		
}

function hidePersonal(){
	$('personalContainer').setStyle('display', 'none');
	var containerSize = $('weeMenuContainer').getCoordinates();
	var currentHeight = containerSize['height'];
	
	var reelSize = $('htmlcontent').getCoordinates();
	var currentReelHeight = reelSize['height'];	
	
	var newHeight = currentHeight - 390;
	var newReelHeight = currentReelHeight + 378;
	var currentOpacity = 0;
	var newOpacity = 1;	
	
	var heightChange = new Fx.Style($('weeMenuContainer'), 'height', {duration:500, onComplete:clearPersonalMotion.bind(this)});
	heightChange.start(currentHeight, newHeight);	
	
	var reelChange = new Fx.Style($('htmlcontent'), 'height', {duration:500});
	reelChange.start(currentReelHeight, newReelHeight);		
	
	var opacityChange = new Fx.Style($('reelPadding'), 'opacity', {duration:500});
	opacityChange.start(currentOpacity, newOpacity);	
}

function clearPersonalMotion(){
	personalInMotion = false;
	$('reelPadding').setStyle('opacity', 1);
}

function showPersonalContent(){
	if(personalOpen == true){
		$('personalContainer').setStyle('opacity', 0);
		$('personalContainer').setStyle('display', 'block');
		var personalFadeIn = new Fx.Style($('personalContainer'), 'opacity', {duration:500,onComplete:clearPersonalMotion.bind(this)});
		personalFadeIn.start(0, 1);			
	}
}

function viewProject(){
	reel.setStyle('left', 0);
	
	if(personalOpen == true){
		personalInMotion	= true;
		personalOpen		= false;
		hidePersonalContent();		
	}
	
}

function viewPhotos(){
	reel.setStyle('left', -3480);
}

function moveReelTo(num){
	reel.setStyle('left', num);
}

function correctPNG(){
   for(var i=0; i<document.images.length; i++)
      {
	  var img = document.images[i]
	  var imgName = img.src.toUpperCase()
	  if (imgName.substring(imgName.length-3, imgName.length) == "PNG")
	     {
		 var imgID = (img.id) ? "id='" + img.id + "' " : ""
		 var imgClass = (img.className) ? "class='" + img.className + "' " : ""
		 var imgTitle = (img.title) ? "title='" + img.title + "' " : "title='" + img.alt + "' "
		 var imgStyle = "display:inline-block;" + img.style.cssText 
		 if (img.align == "left") imgStyle = "float:left;" + imgStyle
		 if (img.align == "right") imgStyle = "float:right;" + imgStyle
		 if (img.parentElement.href) imgStyle = "cursor:hand;" + imgStyle		
		 var strNewHTML = "<span " + imgID + imgClass + imgTitle
		 + " style=\"" + "width:" + img.width + "px; height:" + img.height + "px;" + imgStyle + ";"
	     + "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader"
		 + "(src=\'" + img.src + "\', sizingMethod='scale');\"></span>" 
		 img.outerHTML = strNewHTML
		 i = i-1
	     }
      }
}

function showProjectHighlights(){
	$('projectsContainer').setStyle('display', 'inline');
	var position = $('projectLink').getPosition();
	
	var containerSize = $('projectsContainer').getCoordinates();
	var newX = position['x'];
	var newY = position['y'] + 15; 
	var currentWidth = containerSize['width'];
	var currentHeight = containerSize['height'];
	
	$('projectsContainer').setStyles({
	   left: newX,
	   top: newY
	});	
	
	$('menuShadow').setStyle('display', 'inline');
	$('menuShadow').setStyles({
	   left: newX + 3,
	   top: newY + 3,
	   width: currentWidth,
	   height: currentHeight
	});		
}

function hideProjectHighlights(){
	 clearInterval(intervalID);
	 intervalID = setInterval ( "removeProjectHighlights()", 500 );
}

function removeProjectHighlights(){
	clearInterval(intervalID);
	$('projectsContainer').setStyle('display', 'none');
	$('menuShadow').setStyle('display', 'none');
}

function overProjectHighlights(){
	clearInterval(intervalID);
}

function outProjectHighlights(){
	hideProjectHighlights();
}
