// extend jquery easing effects
	jQuery.extend( jQuery.easing,
	{
		def: 'easeOutQuad',
		easeInQuad: function (x, t, b, c, d) {
				t/=d; return c*t*t + b;
		},
		easeOutQuad: function (x, t, b, c, d) {
				t/=d; t--; return c*(t*t*t + 1) + b;
		},
		easeInOutQuad: function (x, t, b, c, d) {
				t /= d/2; if (t < 1) return c/2*t*t*t + b;
				t -= 2;	return c/2*(t*t*t + 2) + b;
		}
	});

// spin.js function (loading animation)
	var loading_opts = {
	  lines: 16, // The number of lines to draw
	  length: 0, // The length of each line
	  width: 4, // The line thickness
	  radius: 20, // The radius of the inner circle
	  color: '#666', // #rbg or #rrggbb
	  speed: 1, // Rounds per second
	  trail: 100, // Afterglow percentage
	  shadow: false // Whether to render a shadow
	};
	$.fn.spin = function(opts) {
	  this.each(function() {
		var $this = $(this),
			data = $this.data();
	
		if (data.spinner) {
		  data.spinner.stop();
		  delete data.spinner;
		}
		if (opts !== false) {
		  data.spinner = new Spinner($.extend({color: $this.css('color')}, opts)).spin(this);
		}
	  });
	  return this;
	};


//  preload Images
	jQuery.preloadImages = function(){
	  for(var i = 0; i<arguments.length; i++){
		jQuery("<img>").attr("src", arguments[i]);
	  }
	}
	
	
	 function scrolltopage(pagename){
		$.scrollTo("#"+pagename, 800);
	}

$(document).ready(function() {

//$("#slider_loading").spin({lines: 16, length: 0, width: 4, radius: 20, color: '#fff', speed: 1, trail: 100,  shadow: false});
$.preloadImages("./images/slide1.jpg","./images/slide2.jpg","./images/slide3.jpg","./images/slide4.jpg","./images/slide5.jpg" )


// Keyboard Nav
	var a;
	var pages = $(".page");
	var current_page = 0;
	var scrollable_pages = new Array(pages.length);
	for(var i = 0; i<pages.length; i++){
		scrollable_pages[i] = 0;
    }
	var scrollbars_ratio = new Array(pages.length);
	for(var i = 0; i<pages.length; i++){
		a = pages[i];
		var overview = $(a).find(".overview");
		var viewport =  $(a).find(".viewport");
		var thumb =  $(a).find(".thumb");
		var track =  $(a).find(".track");
		var scrollbar =  $(a).find(".scrollbar");
		if(overview.length > 0){
		viewport['y'] = viewport[0].offsetWidth;
		overview['y'] = overview[0].offsetWidth;
		overview.ratio = viewport['y'] / overview['y'];
		scrollbar.toggleClass('disable', overview.ratio >= 1);
		track['y'] = viewport['y'];
		thumb['y'] = Math.min(track['y'], Math.max(0, 100)); //100 is sizethumb
		scrollbar.ratio = (overview['y'] - viewport['y']) / (track['y'] - thumb['y']);
		scrollbars_ratio[i] = scrollbar.ratio;
		}
    }
		
	$(document).keydown(function (d) {
		switch (d.keyCode) {
		case 32: //space - act as down
				a = pages[++current_page];
				if (a) {$.scrollTo.window().queue([]).stop(); $.scrollTo(a, 300); d.preventDefault();
				} else { current_page = pages.length - 1;}
				break;
		case 40 ://down
				a = pages[++current_page];
				if (a) {$.scrollTo.window().queue([]).stop(); $.scrollTo(a, 300); d.preventDefault();
				} else { current_page = pages.length - 1;}
				break;
		case 38 ://up
				a = pages[--current_page];
				if (a) {$.scrollTo.window().queue([]).stop(); $.scrollTo(a, 300); d.preventDefault();
				} else { current_page = 0 ;}
				break
		case 37 ://left
				a = pages[current_page];
				if ($(a).find(".scrollarea").length>0){
				--scrollable_pages[current_page];
				var current_item = $(a).find(".image_container:eq("+ scrollable_pages[current_page]+")");
				if (current_item.length > 0) {d.preventDefault();
				} else { scrollable_pages[current_page] = 0 }
				var iScroll = $(a).find(".image_container:eq("+ scrollable_pages[current_page]+")").position().left;
				var iPosition_now = iScroll / scrollbars_ratio[current_page];
				$(a).find(".overview").stop().animate({left:-iScroll},500,'easeInOutQuad' );
				$(a).find(".thumb").stop().animate({left:iPosition_now},500,'easeInOutQuad' );
				}
				break
		case 39 ://right
				a = pages[current_page];
				if ($(a).find(".scrollarea").length>0){
				++scrollable_pages[current_page];
				var current_item = $(a).find(".image_container:eq("+ scrollable_pages[current_page]+")");
				if (current_item.length > 0) { d.preventDefault();
				} else { scrollable_pages[current_page]-- }
				var iScroll = $(a).find(".image_container:eq("+ scrollable_pages[current_page]+")").position().left;
				var iPosition_now = iScroll / scrollbars_ratio[current_page];
				$(a).find(".overview").stop().animate({left:-iScroll},400,'easeInQuad' );
				$(a).find(".thumb").stop().animate({left:iPosition_now},400,'easeInQuad' );
				}
				break
		}
	})


	// update current_page while scrolling with mouse
/*	$('.page').waypoint({ offset:1 });
	$('body').delegate('.page', 'waypoint.reached', function(event, direction) {
		var $active = $(this);
		if (direction === "up") {
			$active = $active.prev();
		}
		if (!$active.length) $active.end();
	
		$active.addClass('section-active');
		current_page = parseInt($active.attr('pagenum'));
		if (isNaN(current_page)) current_page = 0;
	});*/
		


// adding horizontal scrollbar + lazyload + loading(spin.js)
	$('.scrollarea').tinyscrollbar({ axis: 'x', sizethumb:100});
  	$(".scrollarea img[original]").lazyload({         
		 placeholder : "./images/1x1.gif",
		 container: $(".overview"),
		 effect : "fadeIn",
		 event : "scrolled"
		 
	});
	$(".scrollarea .overview").watch("left", function(data, i){
		$(this).find("img[original]:not(.loading-added)").addClass('loading-added').closest(".image_container").find(".loading").spin(loading_opts);
		$(this).find("img[original]").trigger("scrolled");
	})
	
	$(".image_container").prepend("<span class='loading'></span>");
	$(".scrollarea img:not([original])").closest(".image_container").find(".loading").spin(loading_opts);
	
	$('.image_container').css('width',function(index) {return $(this).find('img').attr('width');}).find('img').fadeOut(0,function(){if($.browser.msie && parseFloat($.browser.version) < 9){$(this).css({"display":"block"})}});
	$('.overview img').load(function () {
	if ($(this).attr('src') !="./images/1x1.gif"){
		$(this).closest(".image_container").find(".loading").data().spinner.stop();
	}
	 $(this).fadeIn(1000)
	});
	
	//Resize window
	function Resize() {
	var window_height = $(window).height();
	var height  =  window_height < 640 ? 640 : window_height;
	$('.page').css('height',height);
	}
	$(window).resize(function(e) {
		Resize();
	}); Resize();
	
	
	$("#main_nav .nav_item").hover(
	  function () {
		if ($(this).hasClass("sticky") == false){
		$(this).find(".letter").stop(true,true).css({"display":"block","opacity":0}).animate({opacity: 0.25},400,'easeInQuad');
		//$(this).find(".letter").stop(true,true).fadeIn();
		}
	  },
	  function () {
		 if ($(this).hasClass("sticky") == false){
		$(this).find(".letter").delay(2000).fadeOut();
		 }
	  }
	);
	
/*	$('#main_nav').waypoint({ offset:-10 });
	$('body').delegate('#main_nav', 'waypoint.reached', function(event, direction) {
		$(this).find(".nav_item").toggleClass('sticky');
		$(this).toggleClass('sticky');
		$("#top_bar_bg").toggleClass('sticky');
		event.stopPropagation();
	});*/
	
		//scroll
	$(window).scroll(function(e) {
		var top = $(document).scrollTop();
		var WindowHeight = Math.max(640,$(window).height());
		current_page = parseInt((top+WindowHeight/2)/WindowHeight);
		
		if (top > 420) {
			$('#main_nav').find(".nav_item").addClass('sticky');
			$('#main_nav').addClass('sticky');
			$("#top_bar_bg").addClass('sticky');
			$('#main_nav .letter').css('display','none');
			$("#backtotop").stop(true,true).show();
			$("#backtotop").css('bottom',WindowHeight-(top*WindowHeight)/ ($(document).height())-50);
		}else{
			$('#main_nav').find(".nav_item").removeClass('sticky');
			$('#main_nav').removeClass('sticky');
			$("#top_bar_bg").removeClass('sticky');
			$("#backtotop").stop(true,true).hide();
		}
	});
    
    $("#keybord_icon").hover( function () {
		$("#keybord_info").stop(true,true).toggle("slow");
	});

    $("#top_nav").hover( function () {
		$("#top_nav ul").stop(true,true).slideToggle("fast");
	});

    //fix for IE < 8 z-index problem
   if($.browser.msie && parseFloat($.browser.version) < 8){
        var zIndexNumber = 5000;
        $('.page').each(function() {
            $(this).css('zIndex', zIndexNumber);
            zIndexNumber -= 5;
        });
    } 


});

//fix for IE < 8 detecting html5 elements
/*if($.browser.msie && parseFloat($.browser.version) < 9){
	// For discussion and comments, see: http://remysharp.com/2009/01/07/html5-enabling-script/
	var e = "abbr,article,aside,audio,bb,canvas,datagrid,datalist,details,dialog,eventsource,figure,footer,header,hgroup,mark,menu,meter,nav,output,progress,section,time,video".split(',');
	for(var i=0;i<e.length;i++){document.createElement(e[i])}
} */