/***********************************************
*	@namespace - Global trs class
* 	@description  - This overall class for the Trisis javascript
***********************************************/
var tools = {};
var trs = 
{

	/***********************************************
	// Define the properties of the class
	***********************************************/

	_aWindowSize : null,
	documentBody : null,
	
	init : function() {
		
		trs.Initials.init();
		if(document.body.id === "index") {
			trs.Overlay.init();
			trs.Links.init();
			if(window.location.toString().indexOf("#") === -1)
			{
				//on a preset ajax page
				$("span.firstWord").animate({color : "#fff"}, 800);
				$("span.secondWord").dAnimate({color : "#FFF"}, 800, null, null, 800);
				$("span.thirdWord").dAnimate({color : "#fff"}, 800, null, null, 1600);
				$("#mainContent").css({opacity: 1, display: "block"});
				$(".initials").css({opacity: 0, display: "block"}).dAnimate({opacity : 1}, 800, null, null, 3200);
			} else {
				$("span.firstWord").css({color : "#fff"});
				$("span.secondWord").css({color : "#fff"});
				$("span.thirdWord").css({color : "#fff"});
				$("#mainContent").css({opacity: 0.8, display: "block"});
				$(".initials").css({opacity: 1, display: "block"});
			}
			
			
			/* preload images */
			setTimeout(trs.preloadImages, 1000);
			
			/* set up the main links */
			$(".mainLinks li.first").bind("click", trs.aboutMe);
			// about me close
			$("#"+trs.Overlay._sOverlayID).bind("click", trs.closeAboutMe);
		}
		
		$(".mainLinks li.second").bind("click", function(){
			trs.blog($(this).find("a").attr("href"), "articles");
			return false;
		});
		
		$(".mainLinks li.third").bind("click", function(){
			trs.blog($(this).find("a").attr("href"), "blog");
			return false;
		});
        
        $(".mainLinks li.fourth a").css({color: "#50303C", opacity: 0.3, cursor: "default"});
		
		$(".mainLinks li.fifth").bind("click", trs.portfolio);
        
        $(".nextPrevousLinks").live("click", trs.changeBlogContents);
		
		if(window.location.toString().indexOf("#aboutMe") !== -1)
		{
			$(".mainLinks li.first").trigger("click");
		}
		
		if(window.location.toString().indexOf("#articles") !== -1)
		{
			$(".mainLinks li.second").trigger("click");
		}
		
		if(window.location.toString().indexOf("#blog") !== -1)
		{
			$(".mainLinks li.third").trigger("click");
		}
	},

	preloadImages : function () {
		//psuedothreaded 
		var aPreloads = ["resources/images/css/bg_circles_large_yellow.png","resources/images/css/bg_circles_large_orange.png"];
		for(var i = 0; i<aPreloads.length; i++)
	  		{
	    	jQuery("<img>").attr("src", aPreloads[i]).attr("id", "circle_"+i);
	 		}
		
	},
	
	aboutMe : function() {
		trs.Overlay.showOverlay();
				var eLightbox = document.createElement("div");
				eLightbox.id = "aboutMe";
				var oIcon =  $(this).find(".icon");
				var oIconOffsets = oIcon.offset();
				var oIconHeight = oIcon.height();
				var oIconWidth = oIcon.width();
				var sFinalWidth = "392px";
				var sFinalHeight = "400px";
				var sFinalLeft = "325px";
				var sFinalTop = "105px";
				var eNewIcon = oIcon.get(0).cloneNode(true);
				var eNewIcon_1 = oIcon.get(0).cloneNode(true);
				var eNewIcon_2 = oIcon.get(0).cloneNode(true);
				$(eNewIcon_1).attr("src", "resources/images/css/bg_circles_large_yellow.png");
				$(eNewIcon_2).attr("src", "resources/images/css/bg_circles_large_orange.png");
				eNewIcon.id = "iconCopy";
				eNewIcon_1.id = "iconCopy_1";
				eNewIcon_2.id = "iconCopy_2";
				trs.setURI("aboutMe");
				$(eNewIcon).css({position: "absolute", top: oIconOffsets.top+"px", left: oIconOffsets.left+"px", width: oIconWidth+"px", height: oIconHeight+"px", zIndex : 99});
				$(eNewIcon_1).css({position: "absolute", top: sFinalTop, left: sFinalLeft, width: sFinalWidth, height: sFinalHeight, zIndex : 98}).hide();
				$(eNewIcon_2).css({position: "absolute", top: sFinalTop, left: sFinalLeft, width: sFinalWidth, height: sFinalHeight, zIndex : 97}).hide();
				$(eLightbox).css({zIndex : 999, position: "absolute", height: "400px", width: "390px", left: "430px", top: "105px"});
				$(eLightbox).fadeOut();
				
				
				$(document.body).append(eNewIcon);
				$(document.body).append(eNewIcon_1);
				$(document.body).append(eNewIcon_2);
				$(document.body).append(eLightbox);
				$(eNewIcon).css({zIndex : 99});
				$(eNewIcon).dAnimate({ height: sFinalHeight, width: sFinalWidth, left: sFinalLeft, top: sFinalTop}, 300, 'easeInSine', function() {
					$(eNewIcon_1).show();
					$(eNewIcon_2).show();
				}, 300).animate({left: "425px"}, 600, 'easeInSine', null);
				$(eNewIcon_1).dAnimate({left: "375px"}, 300, 'easeInSine', function() {
					$(eLightbox).load("aboutMe_data.html", function() {$(this).fadeIn();});
				}, 900);
				
				
				
				return false;
	},
	
	closeAboutMe : function() {
		trs.resetURI();
		trs.Overlay.hideOverlay();
		$("#aboutMe").fadeOut("fast").remove("#aboutMe");
		$("#iconCopy").fadeOut("fast").remove("#iconCopy");
		$("#iconCopy_1").fadeOut("fast").remove("#iconCopy_1");
		$("#iconCopy_2").fadeOut("fast").remove("#iconCopy_2");
		$("#portfolio").fadeOut("fast").remove("#portfolio");
	},
	
	blog : function(sURL, sURI) {
		var eArticleContainer = $(document.createElement("div")).attr("id", "articles");
		var eCloseButton = $(document.createElement("div")).attr("id", "close").html("<span>c</span><span>l</span><span>o</span><span>s</span><span>e</span>");
		var iHeight = 10;
		//set the height
		var iWindowHeight = $(window).height();
		var iWindowWidth = $(window).width();
		$(eArticleContainer).css({position: "absolute", opacity: 0, height: iHeight, top:  iWindowHeight-iHeight});
		$(eCloseButton).css({opacity: 0});
		$(document.body).append(eCloseButton);
		$(document.body).append(eArticleContainer);
		//set the left pos
		var iLeftPos =  (iWindowWidth - $(eArticleContainer).innerWidth())/2;
		var iCloseWidth = $(eCloseButton).innerWidth();
		$(eArticleContainer).css({left: iLeftPos});
		$(eCloseButton).css({left: iLeftPos});
		$(eCloseButton).click(trs.closeArticles);
		$(eArticleContainer).addClass("loading");
		trs.setURI(sURI);
			
		$(eArticleContainer).animate({opacity: 1, top: "0", height: "100%"}, 600, null, function() {

				trs.loadBlogData(sURL, eArticleContainer, iCloseWidth);
			
		}); 
		return false;
	},
    
    showCloseButton : function(iCloseWidth) {
        var eCloseButton = "#close";
            $(eCloseButton).animate({
                        left: "-="+iCloseWidth,
                        opacity: 1
            });
    },
    
    loadBlogData : function(sURL, eArticleContainer, iCloseWidth) {
        $.get(sURL,{ajax : true}, function(data) {
                $(eArticleContainer).removeClass("loading");
                $(eArticleContainer).append(data);
               
                $(eArticleContainer).animate({opacity: 1}, 300, null, function(){
                    if(iCloseWidth) {
                        trs.showCloseButton(iCloseWidth);
                    }
                });
                $(".dragScrollerV").dragScroller({
                        axis: "y",
                        inertia : true
                    });


                    $(".dragScrollerH").dragScroller({
                        axis: "x",
                        inertia : true
                    });
			});
    },
    
    changeBlogContents : function(event) {
        event.preventDefault();
        var sURL = $(this).find("a").attr("href");
        $("#articles").empty().addClass("loading");
        trs.loadBlogData(sURL, $("#articles"), null); 
    },
	
	closeArticles : function() {
		//fisrt slide in the close button
		var iCloseWidth  = $(this).innerWidth();
		$(this).animate({opacity: 0, left: "+="+iCloseWidth});
		$("#articles").children().animate({opacity: 0}, 300, null, function() {
			//for youtube flash that will not fade out
			$(this).css({display: "none"});
		});
		var iWindowHeight = $(window).height()-2;
		
		$("#articles").dAnimate({top: iWindowHeight, height: 0}, 500, null, function() {
			//remove the html from the page
			$("#articles").remove();
			$("#close").remove();
			trs.resetURI();
		}, 300);
		
	},
	
	portfolio : function() {
		trs.Overlay.showOverlay();
		var ePortContainer = $(document.createElement("div")).attr("id", "portfolio");
		$(ePortContainer).css({visibility: "hidden"});
		$(ePortContainer).append('<span id="spotLight"></span>');
		$(document.body).append(ePortContainer);
		$(ePortContainer).bind("mouseenter", trs.activateSpotLight);
		$(ePortContainer).bind("mouseleave", trs.deActivateSpotLight);
		//get the window height to figure out where to put it.
		var iWindowHeight = $(window).height();
		trs.iwindowWidth = $(window).width();
		var iStripHeight = $(ePortContainer).innerHeight();
		var iTop = (iWindowHeight - iStripHeight) / 2;
		$(ePortContainer).css({visibility: "visible", top: iTop});
		$(ePortContainer).addClass("loading");
		$(ePortContainer).animate({width: trs.iwindowWidth}, 600, null, function() {

				
			$.get("portfolio_data.html",{ajax : true}, function(data) {
					setTimeout(function() {
						$(ePortContainer).removeClass("loading");
						$(ePortContainer).append(data);
						$(document.body).css({overflow : "hidden"});
						$(ePortContainer).css({width: 10000});
						trs.iPortfolioWidth = $(ePortContainer).find("ul").width();
						$(ePortContainer).find("ul").css({width: trs.iPortfolioWidth+10});
						$(ePortContainer).css({width: trs.iwindowWidth});
						$(document.body).css({overflow : "auto"});
							
						$(ePortContainer).animate({opacity: 1}, 300, null, function(){
							/*
							var iWidth = $(eCloseButton).innerWidth();
							$(eCloseButton).animate({
								left: "-="+iWidth,
								opacity: 1
							});
							*/
						});
						
							
				}, 1000); 

				
				
			});
		});
		
	},
	
	activateSpotLight : function(event) {
		if($("#spotLight").css("display") !== "block") {
			$("#spotLight").css({opacity: 0, display: "block"});
		}
		$("#spotLight").css({left: event.pageX-75});
		$("#spotLight").stop().animate({opacity: 1});
		$("#portfolio").bind("mousemove", trs.moveSpotLight);
		trs.ivSportLight = setInterval(trs.portfolioScroll, 50);
	},
	
	deActivateSpotLight : function() {
		$("#spotLight").stop().animate({opacity: 0});
		trs.residualScroll();
		clearInterval(trs.ivSportLight);
	},
	
	moveSpotLight : function(event) {
		trs.iLastMousPos = event.pageX;
		if(event.pageX > trs.iwindowWidth-75) {
			event.pageX = trs.iwindowWidth-75;
		} else if (event.pageX < 75) {
			event.pageX = 75;
		}
		$("#spotLight").css({left: event.pageX-75});
	},
	
	portfolioScroll : function() { 
		var iNewScroll = trs.calculateScroll();
		if(iNewScroll) {
			$("#portfolio ul").stop().css({marginLeft: iNewScroll});
		}
	},
	
	calculateScroll : function() { 
		var iScrollSpeed = null;
		var newScroll = parseInt($("#portfolio ul").eq(0).css("marginLeft"), 10);
		if(trs.iLastMousPos > trs.iwindowWidth-300) {
			iScrollSpeed = trs.iLastMousPos-(trs.iwindowWidth-300);
			newScroll -= (iScrollSpeed/10);
		} else if (trs.iLastMousPos < 300) {
			iScrollSpeed = 300-trs.iLastMousPos;
			newScroll += (iScrollSpeed/10);
		}
		if(iScrollSpeed) {
			if(newScroll > 0) {
				newScroll = 0;
			} else if (newScroll < -trs.iPortfolioWidth+trs.iwindowWidth) {
				newScroll = -trs.iPortfolioWidth+trs.iwindowWidth;
			}
			return newScroll;
			 
		}
		return false;
	},
	
	
	residualScroll : function() {
		trs.iLastMousPos = trs.iLastMousPos*1.2;
		var iScrollAmount = trs.calculateScroll();
		var iscrollDuration = iScrollAmount
		console.log(iScrollAmount);
		$("#portfolio ul").stop().animate({marginLeft: iScrollAmount}, 1200);
	},
	
	resetURI : function() {
		window.location.hash = "main";
	},
	
	setURI : function(sLocation) {
		window.location.hash = sLocation;
	}
	
//--closes class
};

/***********************************************
*	@namespace trs.Template
*	@description  - This is a template file for setting out a javascript class
***********************************************/
trs.Initials = 
{
	/***********************************************
	* 	@description - Define the properties of the class
	***********************************************/
	
	_examplePrivateProperty : null,
	_initialsRef : ".initials",
	_eCurrentInitalsOverlay : null,
	examplePublicProperty : null,
	
	/***********************************************
	* trs.Initials.initialization : @constructor  (description)
	***********************************************/
	
	init : function() 
	{
		//get the initals element
		
		trs.Initials.bindEvents();
			
	},
    
    bindEvents : function() {
    
        var aInitials = $(trs.Initials._initialsRef);
        aInitials.bind("click", trs.Initials.showInitials);
    
    },
	
	/***********************************************
	*	@function - trs.Initials.showInitials
	* 	@description  - This is an example method for the class
	* 	@param - void
	* 	@returns - false
	***********************************************/
	showInitials : function(event) 
	{
		/* show the initals in full word form */
		var iExpand = 400;
        //create a copy of the node
        var aInitials = $(trs.Initials._initialsRef);
        aInitials.unbind("click", trs.Initials.showInitials);
		$(this).find(".wrapper").animateToClass(".wrapperOpen");
		$(this).animateToClass(".initialsOpen");
		$(this).find("span.hidden").show("slow");
		$(this).find("span.mainChar").animateToClass(".mainCharLarge");
		var eContainer = this;
		setTimeout(function() {
			$(eContainer).find("span.jobTitle").show(0);	
		}, 800);
		
		setTimeout(trs.Initials.hideInitials, 4000);
		
	},
	
	/***********************************************
	*	@function - trs.Initials.hideInitials
	* 	@description  - This is an example method for the class
	* 	@param - void
	* 	@returns - false
	***********************************************/
	hideInitials : function() 
	{
		var eOverlay = $(trs.Initials._initialsRef);
		$(eOverlay).find("span.jobTitle").hide(0);
		$(eOverlay).find("span.hidden").hide("slow");
		setTimeout(function() {
			$(eOverlay).find("span.mainChar").animateToClass(".mainCharLarge", 250);
			$(eOverlay).find(".wrapper").animateToClass(".wrapperOpen", 300);
			$(eOverlay).animateToClass(".initialsOpen", 300);
            trs.Initials.bindEvents();
		}, 400);	
	}

/*--closes class--*/
};

/***********************************************
*	@namespace trs.Links
*	@description  - This is a template file for setting out a javascript class
***********************************************/
trs.Links = 
{
	/***********************************************
	* 	@description - Define the properties of the class
	***********************************************/
	
	_examplePrivateProperty : null,
	_sHoverColor : "#d66043",
	_sNormalColor : "#FBAD44",
	_oHoverCache : {},
	examplePublicProperty : null,
	
	/***********************************************
	* trs.Links.initialization : @constructor  (description)
	***********************************************/
	
	init : function() 
	{
		$(".mainLinks li:not(.fourth)").bind("mouseenter", trs.Links.rollOn);
		$(".mainLinks li:not(.fourth)").bind("mouseleave", trs.Links.rollOff);
	},
	
	/***********************************************
	*	@function - trs.Links.rollOn
	* 	@description  - This is an example method for the class
	* 	@param - void
	* 	@returns - false
	***********************************************/
	rollOn : function() 
	{
		$(this).find("a").stop().animate({color: trs.Links._sHoverColor});
		var sID = $(this).identify().attr("id");
		trs.Links._oHoverCache[sID] = {};
		trs.Links._oHoverCache[sID].state = true;
		trs.Links._oHoverCache[sID].hoverEffect = setTimeout(function() {
			if(trs.Links._oHoverCache[sID].state === true) {
			$("#"+sID).find("a").stop()
			.animate({color: trs.Links._sNormalColor})
			.animate({color: trs.Links._sHoverColor})
			.animate({color: trs.Links._sNormalColor})
			.animate({color: trs.Links._sHoverColor})
			.animate({color: trs.Links._sNormalColor})
			.animate({color: trs.Links._sHoverColor})
			.animate({color: trs.Links._sNormalColor})
			.animate({color: trs.Links._sHoverColor});
			}
		}, 2000);
		$(this).find(".icon").show();			
	},
	
	/***********************************************
	*	@function - trs.Links.rollOff
	* 	@description  - This is an example method for the class
	* 	@param - void
	* 	@returns - false
	***********************************************/
	rollOff : function() 
	{
        var sID = $(this).attr("id");
		$(this).find("a").stop().animate({color: trs.Links._sNormalColor});
        clearTimeout(trs.Links._oHoverCache[sID].hoverEffect);
		trs.Links._oHoverCache[$(this).attr("id")] = false;
		$(this).find(".icon").hide();
	}

/*--closes class--*/
};

/***********************************************
*	@namespace - vdf.Tools.Overlay
* 	@description  - This is the class for creating the screen overlay for ligh box behaviours
***********************************************/
trs.Overlay = 
{

	/***********************************************
	// Define the properties of the class
	***********************************************/
	_sOverlayID : "lightBoxOverlay",
	_sOverlayIE6ID : "lightBoxOverlayIE6Hack",
	_eOverlay : null,
	_eOverlayIFrame : null,
	examplePublicProperty : null,
	
	/***********************************************
	// trs.Overlay.initialization : class constructor (description)
	***********************************************/
	init : function() 
	{
		trs.Overlay.createOverlay();
	},
	
	/***********************************************
	* 	@function - trs.Overlay.createOverlay
	* 	@description  - This gets fired the first time a lightbox is used
	* 	@param- void
	* 	@returns - false
	***********************************************/
	createOverlay : function() 
	{
		//create the overlay div at the bottom of the body
		trs.Overlay._eOverlay = document.createElement("div");
		trs.Overlay._eOverlay.id = trs.Overlay._sOverlayID;
		$(trs.Overlay._eOverlay).css({
			position: "absolute",
			top : "0px",
			left : "0px",
			width: "100%",
			opacity: 0
		});
		//create the horrible IFrame hack for IE6, GRRRR I hate you IE6
		
		document.body.appendChild(trs.Overlay._eOverlay);
	},
	
	/***********************************************
	* 	@function - trs.Overlay.showOverlay
	* 	@description  - This shows the overlay
	* 	@param- void
	* 	@returns - false
	***********************************************/
	showOverlay : function() 
	{
		if(!trs.Overlay._eOverlay) {trs.Overlay.createOverlay();}
		//get the window scrollHeight
		var scrollHeight = document.scrollHeight;
		var windowHeight = $(window).height();
		console.log(scrollHeight, windowHeight);
		var iCurrentPageHeight = windowHeight;
		if (scrollHeight > windowHeight) {
			//page is longer than viewport
			iCurrentPageHeight = scrollHeight;
		}
		
		$(trs.Overlay._eOverlay).css({
			position:  "fixed",
			height:  "10000px",
			display : "block"
		});
		$(trs.Overlay._eOverlayIFrame).css({
			height: iCurrentPageHeight + "px",
			display : "block"
		});
		//animate the showing of the overlay
		$(trs.Overlay._eOverlay).animate(
				{
					opacity: "0.7"
					
				}, 400);
						
	},
	
	/***********************************************
	* 	@function - trs.Overlay.hideOverlay
	* 	@description  - This is an example method for the class
	* 	@param- void
	* 	@returns - false
	***********************************************/
	hideOverlay : function() 
	{
		//hides the overlay
		$(trs.Overlay._eOverlay).css({height : "", display: "none", opacity : 0});
		$(trs.Overlay._eOverlayIFrame).css({height : "", display: "none"});
	}

//--closes class
};

$(document).ready(trs.init);