var box = 0;
var timeout_id = 0;
var timeOuts= new Array();
var timeOutsWork = new Array();
var columns = 0
var lines = 0;
var fadeInCount = 1;
var workFadeIn = 1;
var total_work = 0;
var total_boxes = 0;
var background = 0;
var stage = "intro";
var stagePrevious = "home";
var stop_animation = 1;
var isStageRedraw = 0;
var isBackRedraw = 0;
var redrawComplete = 1;
var updateUrl = 0;
var backgrounds = ["","bg1.png","bg2.jpg", "bg3.jpg", "bg4.jpg", "bg5.jpg", "bg6.jpg", "bg7.jpg"];
var StageBackground = {"intro" : 1, "about" : 2, "work": 3, "contact_me": 4 };
var cache = [];
var cacheImage = new Array();



$(document).ready(function(){
	if(agent == "old_ie") {
		window.location = "old_browsers.html";

	} else {
$('#logo-intro, #logo-intro2, #work, #contact_me').click(function() {  
    $.address.value($(this).attr('href'));  
    return false;
});  	  
	$.address.change(function(event) {  
    // do something depending on the event.value property, e.g.
    	console.log(event.value);
    	if(redrawComplete == 1) {
    	redrawComplete = 0;
   		stagePrevious = stage;
   		stage = event.value.split("/")[1]; 
   		if(stage == "") {
   		stagePrevious = "home";
   		stage = "intro";
   		}
   		random = Math.ceil(Math.random()*6+1);
 		background = random;
		clearAllTimeouts();
   		unbindMenu();
   		unbindWork();
   		unbindWindowResize();
   		fadeMenu();  
}
	}); 

	hideInactiveSections();
 
	Shadowbox.init({
		overlayOpacity : 0.8,
		overlayColor : "#21AC73",
		handleOversize : "drag",
   		skipSetup: true
	});
	var args_len = backgrounds.length;
    for (var i = args_len; i--; i <= 1) {		
      var cacheImage = document.createElement('img');
      cacheImage.src = "images/"+backgrounds[i];
      cache.push(cacheImage);
    }
}

});
function hideInactiveSections() {
	$('.content, #work_section, .work_block_overlay, .work_content').hide();
	$(".preload").show();
}
function bindWindowResize() {
	$(window).resize(function() {
   		$('.box_overlay').remove();
   		$('.work_block_overlay').hide();
   		alignWorkPosition();
   		clearAllTimeouts();
   		fadeInCount = 1;
		stop_animation = 1;
   		clearTimeout ( timeout_id );
   		$('#box_wrapper').fadeOut(1000);
   		timeout_id = setTimeout("$('#box_wrapper').empty();count_viewport();", 1500);	 
	});
}
function redrawBackground() {
	$('.box_overlay').remove();
   	$('.work_block_overlay').hide();
   	alignWorkPosition();
   	clearAllTimeouts();
   	fadeInCount = 1;
	stop_animation = 1;
   	clearTimeout ( timeout_id );
   	random = Math.ceil(Math.random()*6+1);
 	background = random;
 	isBackRedraw = 1;
 	
	stop_animation = 1;
   	clearTimeout ( timeout_id );
  
   	fadeInCount = 1;
   	stop_animation = 0;
   	fadeOutBoxes(background);
}
function unbindWindowResize() {
	$(window).unbind();
}
function redrawStage() {
	isStageRedraw = 1;
	if(stage == "") {stage = "intro";}
	$('.box_overlay').remove();
   	$('.work_block_overlay').hide();
   	alignWorkPosition();
   	
   	fadeInCount = 1;
	stop_animation = 1;
   	clearTimeout ( timeout_id );
  
   	fadeInCount = 1;
   	stop_animation = 0;
   	fadeOutBoxes(background);
}
function bindMenu() {
	$('#work, #contact_me, #logo-intro2, #logo-intro').unbind();
	$('#logo-intro, #work, #contact_me').click(function() {  
    $.address.value($(this).attr('href'));  
     return false;
});  
$('#logo-intro2').click(function() {  
   redrawBackground();  
     return false;
}); 
$('#logo-intro2').mouseover(function() {  
   $(this).empty();
   $(this).mouseleave(function() {
   	$(this).html('<span class="nikita">nikita.</span><br>graphic designer<br>& web developer');
    });
});
	// $("#logo-intro").click(function(){
	// 	stagePrevious = stage;
	//    		stage= "intro"; 
	//    		background = 5;
	// clearAllTimeouts();
	//    		unbindMenu();
	//    		unbindWork();
	//    		unbindWindowResize();
	//    		fadeMenu();
	//    		window.location = baseUrl + "#intro";
	//    		return false;
	// });
	// $("#logo-intro2").click(function(){
	// 	background = 6;
	// 	stagePrevious = stage;
	//    		stage= "about";
	// 	clearAllTimeouts();
	//    		unbindMenu();
	//    		unbindWork();
	//    		unbindWindowResize();
	//    		fadeMenu();
	//    		window.location = baseUrl + "#about";
	//    		return false;   		
	// });
	// $("#contact_me").click(function(){
	// 	background = 3;
	// 	stagePrevious = stage;
	//    		stage= "contact_me";
	// 	clearAllTimeouts();
	//    		unbindMenu();
	//    		unbindWork();
	//    		unbindWindowResize();
	//    		fadeMenu();
	//    		window.location = baseUrl + "#contact_me";
	//    		return false;
	// });
	// $("#work").click(function(){
	// 	background = 7;
	// 	stagePrevious = stage;
	//    		stage= "work";
	//  		clearAllTimeouts();
	//    		unbindMenu();
	//    		unbindWork();
	//    		unbindWindowResize();
	//    		fadeMenu();
	//    		window.location = baseUrl + "#work";
	//    		return false;
	// });
}
function unbindMenu() {
	$('#work, #contact_me, #logo-intro2, #logo-intro').unbind();
		$('#logo-intro, #logo-intro2, #work, #contact_me').click(function() {  
     return false;
});  
}
function bindWork() {
	$('.work_box, .work_block').mouseover(
	function () {

			$('.box_overlay, .work_block_overlay').unbind('click');
   			$('.box_overlay').stop();
   			$('.work_block_overlay').stop();
   			offset = $(this).parents(".work-wrapper").children(".work_block_mini").eq(0).offset();
   			offset2 = offset.top + 130;
   			offset3 = $(this).parents(".work-wrapper").children(".work_block").offset();
   			project = $(this).parents(".work-wrapper").attr("id");
   			$('#'+project).append("<a href='' class='box_overlay "+project+"_lil1'></a>");
   			$('#'+project).append("<a href='' class='box_overlay "+project+"_lil2'></a>");
   			$('.'+project+'_lil1').css({"left": ""+offset.left+"px", "top" : ""+offset.top+"px", "opacity" : "0"}).animate({opacity: '1'}, 1000);
   			$('.'+project+'_lil2').css({"left": ""+offset.left+"px", "top" : ""+offset2+"px", "opacity" : "0"}).animate({opacity: '1'}, 1000);
   			$('#'+project+' .work_block_overlay').show().css({"left": ""+offset3.left+"px", "top" : ""+offset3.top+"px", "opacity" : "0"}).animate({opacity: '1'}, 1000);
   			
   			//get work content into array that feeds shadowbox
   			var workGallery = new Array();   			
   			workGallery = [];

   			$('#'+project+' .work_content a').each(function(index) {
   			
   				href = $(this).attr('href');
   				title = $(this).text();
   				workGallery[index] = {
   					content: href,
   					player: 'img',
   					title: title
   				}
   			}); 
   			
   			//bind Shadowbox to work
   			$('.box_overlay, .work_block_overlay').click(function(){   		
   				Shadowbox.open(workGallery);
			return false;
			});
   				$('.box_overlay').mouseleave(function(){
					
					
					$('.box_overlay').remove();
   					$('.work_block_overlay').hide();
			});
   		
  	}
	)
	$('.work_block_overlay').mouseleave(function(){
		$('.box_overlay').remove();
   		$('.work_block_overlay').hide();
	});
}
function unbindWork() {
	$('.work_block_overlay, .work_box, .work_block').unbind();
}
function showWork() {
	total_work = 0;
	$('#work_section').show();
	alignWorkPosition();
	$('.work_box, .work_block').each(function(index){
		workIndex = index + 1;
		$(this).css({opacity: '0'});
		$(this).addClass("work"+workIndex);
		total_work++;
	})
	
}
function fadeInWorks() {
	if(workFadeIn <= total_work && workFadeIn <= 100) {
		timeOutsWork[workFadeIn] = setTimeout("fadeInWork();", 50);	
	} else {  bindWork();bindMenu();redrawComplete = 1; }
}
function fadeOutWorks() {
	$(".box_overlay").animate({opacity:'0'}, 1000);
	setTimeout("$('.box_overlay').remove();", 1000);	
   	$('.work_block_overlay').hide();
	if(workFadeIn <= total_work && workFadeIn <= 100) {
		timeOutsWork[workFadeIn] = setTimeout("fadeOutWork();", 50);	
	} else { setTimeout("redrawStage();", 100); }
}
function fadeInWork() {
	$(".work"+workFadeIn).animate({opacity:'1'}, 1000);
    workFadeIn++;
	fadeInWorks();
}
function fadeOutWork() {
	$(".work"+workFadeIn).animate({opacity:'0'}, 1000);
    workFadeIn++;
	fadeOutWorks();
}
function fadeMenu() {	

	if(stagePrevious != "home") {
	$("#logo-intro").animate({opacity: '0'}, 1000);
	setTimeout("$(\"#logo-intro\").animate({opacity: '0'}, 1000);", 100);
   	setTimeout("$(\"#logo-intro2\").animate({opacity: '0'}, 1000);", 200);
   	setTimeout("$(\"#work\").animate({opacity: '0'}, 1000);", 300);
   	setTimeout("$(\"#contact_me\").animate({opacity: '0'}, 1000);", 400);
   	setTimeout("$(\".content\").animate({opacity: '0'}, 1000);", 500);
   	setTimeout("$(\"#intro_section\").hide();", 1500);
   	if(stagePrevious == "work") {
   		clearAllWorkTimeouts();   
   		workFadeIn = 1;
   		setTimeout("fadeOutWorks();", 600);	
   			
	} else {
		setTimeout("redrawStage();", 500);	
	} 
		} else {
			//start home intro 
			stage = "intro";
			$("#logo-intro, #logo-intro2, #work, #contact_me, .content").css({"opacity": "0"});
			$("#intro_section").hide();
			count_viewport();
			bindWindowResize();	
			isStageRedraw = 1;		
		}
}
function fadeInMenu() {
	bindWindowResize();
	$("#intro_section").show();
	$("#logo-intro").animate({opacity: '1'}, 1000);
   	setTimeout("$(\"#logo-intro2\").animate({opacity: '1'}, 1000);", 100); 
   	setTimeout("$(\"#work\").animate({opacity: '1'}, 1000);", 200); 
   	setTimeout("$(\"#contact_me\").animate({opacity: '1'}, 1000);", 300);
  	setTimeout("$(\".content\").animate({opacity: '1'}, 1000);", 300);
  	if(stage == "work") {
  		setTimeout("fadeInWorks();", 400);
  	} else {
  		bindMenu();
  		redrawComplete = 1;
  	}
}
function restructureMenu() {
	if(stage == "intro") {
		$("#logo-intro").css({"left": "160px", "top" : "260px"});
		$("#logo-intro2").css({"left": "320px", "top" : "390px"});
		$("#work").css({"left": "480px", "top" : "260px"});
		$("#contact_me").css({"left": "640px", "top" : "390px"});		
		$(".about").css({"display": "none"});	
		$(".contact_me").css({"display": "none"});	
	} else if (stage == "about") {
		$("#logo-intro").css({"left": "480px", "top" : "0px"});
		$("#logo-intro2").css({"left": "640px", "top" : "130px"});
		$("#work").css({"left": "800px", "top" : "260px"});
		$("#contact_me").css({"left": "960px", "top" : "390px"});		
		$(".about").css({"display": "block", "left" : "0", "top" : "260px", "width" : "640"});
		$(".contact_me").css({"display": "none"});	
	} else if (stage == "contact_me") {
		$("#logo-intro").css({"left": "0px", "top" : "130px"});
		$("#logo-intro2").css({"left": "160px", "top" : "520px"});
		$("#work").css({"left": "160px", "top" : "260px"});
		$("#contact_me").css({"left": "160px", "top" : "390px"});		
		$(".about").css({"display": "none", "left" : "0", "top" : "0"});
		$(".contact_me").css({"display": "block", "left" : "320px", "top" : "260px"});
	} else if (stage == "work") {
		$("#logo-intro").css({"left": "0", "top" : "130px"});
		$("#logo-intro2").css({"left": "0", "top" : "260px"});
		$("#work").css({"left": "0", "top" : "390px"});
		$("#contact_me").css({"left": "0", "top" : "520px"});
		$(".about").css({"display": "none"});	
		$(".contact_me").css({"display": "none"});	
	}
}
function count_viewport() {

	$('#box_wrapper').show();	
	
	$("#wrapper").width(0);	
	$("#box_wrapper").height(0);
	$("#box_wrapper").width(0);
	$("#border_mask").height(0);
	$("#border_mask").width(0);
	
	window_x = $(window).width();		   		
	window_y = $(window).height();
	viewport_y = $("body").height();
	viewport_x = $("body").width();
	 	
	//count lines and columns 
	//if body lesser than window, calculate window height instead
	if(viewport_y < 650) { viewport_y = 650; }	 
	if(window_y < viewport_y) {
		$("#wrapper").height(viewport_y);
		$("#border_mask").height(viewport_y);
		lines = Math.ceil((viewport_y + 10)/130);
	} else {
		$("#border_mask").height(window_y);
		$("#wrapper").height(window_y);
		lines = Math.ceil((window_y + 10)/130);
	}
	columns = Math.ceil((viewport_x + 10)/160);   		

	//calculate width of boxes wrapper
	box_wrapper_x = columns * 160;
	
	box_wrapper_y = lines * 130;
	
	if(window_x < 800) {
		window_x = 800;
	 	}
	 	
		$("#wrapper").width(window_x);
	
	$("#box_wrapper").height(box_wrapper_y);
	$("#box_wrapper").width(box_wrapper_x);	
	$("#border_mask").width(window_x);
		
	total_boxes = lines * columns;
	stop_animation = 0;
	fadeInCount = 1;
	generate_boxes(total_boxes);
	fadeInBoxes(background);
}
function fadeInBoxes(backgroundIns) {
	if(stop_animation != 1) {
	if(fadeInCount <= total_boxes && fadeInCount <= 100 && backgroundIns == 0) {
		
		timeOuts[fadeInCount] = setTimeout("drawBoxes(fadeInCount)", 40);
	} else if(fadeInCount >= total_boxes && backgroundIns == 0) {
		fadeInCount=1;	
		fadeOutBoxes(0);
	} else if(fadeInCount <= total_boxes && backgroundIns > 0) {
		background = backgroundIns;
	
		$("#intro_section").animate({opacity: '1'}, 1500);
		timeOuts[fadeInCount] = setTimeout("redrawBoxes(fadeInCount, background)", 20);
	} else if(isStageRedraw == 1) {
		isStageRedraw = 0;
		restructureMenu();
		fadeInMenu();
		
	} else {
		
	}
}
}
function fadeOutBoxes(backgroundIns) {
	
	if(stop_animation != 1) {
	if(fadeInCount <= total_boxes && fadeInCount <= 100) {
		timeOuts[fadeInCount] = setTimeout("hideBoxes(fadeInCount)", 20);	
	} else {	

		fadeInCount=1;
		if(backgroundIns == 0) {
			$('#work_section').hide();
			if(stage == "work") { workFadeIn = 1;showWork();}
			background = 1;
			setTimeout("$('#box_wrapper').empty();count_viewport();", 500);	
			
			
		} else {
			if(isBackRedraw != 1) {
			$('#work_section').hide();
			background = backgroundIns;
			if(stage == "work") { workFadeIn = 1;showWork();}	
		} else {
			isBackRedraw = 0;
		}
			
			setTimeout("$('#box_wrapper').empty();count_viewport();", 500);
		}
	}
}
}
function drawBoxes(fadeInCountIns) {
	if(stop_animation != 1) {
	
	$(".box"+fadeInCountIns).animate({opacity:'1'}, 1000);
 	var offset = $('.box'+fadeInCountIns).offset();	
 	$('.box'+fadeInCountIns).css("background-position", "0 0");	
	fadeInCount++;
	fadeInBoxes(background);
	}
}
function hideBoxes(fadeInCountIns) {	
	if(stop_animation != 1) {
		
	$(".box"+fadeInCountIns).animate({opacity:'0'}, 1000);
	fadeInCount++;
	fadeOutBoxes(background);
	}
}
function redrawBoxes(fadeInCountIns, backgroundIns) {	
	if(stop_animation != 1) {
	$(".box"+fadeInCountIns).css("background-image", "url('images/"+backgrounds[backgroundIns]+"')");
	var offset = $('.box'+fadeInCountIns).offset();	
	$('.box'+fadeInCountIns).css("background-position", "-"+offset.left+"px -"+offset.top+"px");
	$(".box"+fadeInCountIns).animate({opacity:'0.8'}, 1000);

    fadeInCount++;
	fadeInBoxes(background);
	}
}
function generate_boxes(total_boxes) {
	draw = 1;
	box = 1;
	while (box<=total_boxes && draw==1)
		{
			$('<div class="box box'+box+'" style="opacity:0;"></div>').appendTo('#box_wrapper');
			box++;	
		}	
	 }
function clearAllTimeouts(){
  for(key in timeOuts ){
    clearTimeout(timeOuts[key]);
  }
}
function clearAllWorkTimeouts(){
  for(key in timeOuts ){
    clearTimeout(timeOutsWork[key]);
  }
}
function alignWorkPosition(){
	$('#work_section .work-wrapper .work_block_mini, #work_section .work-wrapper .work_block').css("margin-left", "0px");
	$('#work_section #bright-n-raw').css("margin-left", "160px");
	$('#work_section .work-wrapper .work_block_mini, #work_section .work-wrapper .work_block').each(function() {
		offset = $(this).offset();	
		elemId = $(this).attr('class');
     	if(offset.left == "0" && $(this).attr('id') != "bright-n-raw") {
     		$(this).css("margin-left", "160px");
     		return false;
     	}
     	
  });
}

// function hideSelectBoxesRandom() {
// 	$('.box').fadeOut(5000);
// 	$('.box').promise().done(function() {
// 	$('.box').fadeIn(3000);
//     $(".box").css("background-image", "url(images/box.png)");
// 			$('.box').css("background-position", "-160px -130px");
// 				var max_boxes = 70;
// 				if(total_boxes <= max_boxes) {
// 					max_boxes = total_boxes;
// 				}
// 				var numberOfBoxes = Math.floor(Math.random()*(max_boxes-1));
// 		
// 				for(i=1;i<=numberOfBoxes;i++) {
// 					randomBox = Math.floor(Math.random()*(max_boxes-1)+1);
// 					$(".box"+randomBox).css("background-image", "url(images/bg1.png)");
//    					console.log("random Box:", randomBox); 
//     				var offset = $('.box'+randomBox).offset();	
// 					$('.box'+randomBox).css("background-position", "-"+offset.left+"px -"+offset.top+"px");
// 				}
// 
// 		
// 		
// 		
// 
// 	
// 	timeOuts[3612783] = setTimeout("hideSelectBoxesRandom()", 10000);
//  	 });
// 
// 		
// 
// }
// function hideSelectBoxes() {
// 	$('.box').hide();
// 	$('.box').fadeIn(3000);
// 	var selectBoxes = new Array();
// 	selectBoxes = ["2.1", "3.1", "3.7", "3.8", "3.9", "5.6"];
// 	for(key in selectBoxes ){
// 	box_coord = selectBoxes[key].split(".");	
// 	box_cord_y = parseInt(box_coord[0]);
// 	box_cord_x = parseInt(box_coord[1]);
// 	
//     console.log("key:",box_cord_x, columns, box_cord_y); 
//     
//     if(box_cord_x <= columns && box_cord_y <= lines) {   
//     	
//     var curr_box = box_cord_y*columns - columns + box_cord_x;
//  
//     $(".box"+curr_box).css("background-image", "url(images/bg1.png)");
//     
//     var offset = $('.box'+curr_box).offset();	
// 	$('.box'+curr_box).css("background-position", "-"+offset.left+"px -"+offset.top+"px");
// 
// 	
//   	 console.log("box:", curr_box);
//   	 }
//   		
//   }
// 	 
// 	timeOuts[3612783] = setTimeout("hideSelectBoxesRandom()", 10000);
// }