(function($) {
 
   $.fn.columnize = function() {
  
     this.each(function() {
			originalheight = $(this).attr("data-originalheight");
			if(originalheight>height) {
				columns = Math.round((originalheight/height)+0.95);
				if(columns>1){
					$(this).removeClass("single").attr("data-columns",columns).width(columns*415);
				} else {
					$(this).addClass("single").width(columns*430);	
				}
				//$(this).children("p").width(430).css('float','left');
			}	
			$(this).attr("data-width", $(this).width());
		});
 
     return this;
 
   };
 
   $.fn.readWidth = function() {
  		issuewidth = 0;
     this.each(function() {
			issuewidth += $(this).width();
			$(this).parent().attr("data-width",issuewidth);
		});
 
     return this;
 
   };

 })(jQuery);
$(document).ready(function() {
	
	function setDuration(duration){
		if($.fx.Off==true){
			return 0;
		} else {
			return duration;
		}
	}
	$("section.issue").each(function(){
		$(this).append('<p class="end">End of issue.</p>');
	});
	$("section.issue h2").each(function() {
		$(this).after($(this).clone().addClass("page"));
	});
	
	function adjustLayout() {
		height = window.innerHeight;
		$("section.issue article, section.issue h3").columnize().height(height-130+"px").css("marginBottom","150px").readWidth();
		$("section.issue").width($(this).attr("data-width"));
		$("section.issue h2.page").height(height+"px").css("marginBottom","0px");
	}
	//SETUP
	$("section.issue article").each(function(){
		$(this).attr("data-originalheight",$(this).height());	
	});
	$("body").addClass("js");
	$("header").append('<p class="instruct attention" title="Use spacebar, left and right arrows to move forward and backward within an issue. Use up and down arrows to switch between issues."><span class="less"><strong>Use spacebar and arrow keys to navigate</strong> &#x2190;&#x2191;&#x2193;&#x2192; Press &apos;h&apos; for help.</span><span class="more"><strong>&#x2190;&#x2192;</strong>: Jump Articles<br><strong>&#x2191;&#x2193;</strong>: Jump Issues<br><strong>Spacebar</strong>: Advance column<br><strong>Enter</strong>: Zoom to Overview<br><strong>A</strong>: Toggle Animation<br><strong>H</strong>: Load help.</span></p>');
	
	setTimeout(function(){
		$(".instruct").fadeOut('400', function(){ $(this).removeClass("attention").fadeIn('400');});
		},4000);
	
	adjustLayout();
	$.scrollTo("section.issue", 0, { axis:'x' });$.scrollTo("section.issue",800, { axis:'y' });

	$("section.issue:nth-child(2)").attr("id","current").children(":nth-child(2)").addClass("current");
	$("#current").children(":nth-child(3)").addClass("next");
	$("section.issue:nth-child(3)").attr("id","next");
	iszoom=false;
	isanimating=false;
	$.fx.off=false;
		
	function checkKey(e){
	     switch (e.keyCode) {
		
			case 72://h
			if($(".instruct.attention").length==0){
				$(".instruct").fadeOut('400', function() {
					$(this).addClass("attention").fadeIn('400');
				});
				setTimeout(function(){			
								$(".instruct").fadeOut('400', 
														function(){ 
																$(this).removeClass("attention").fadeIn('400');
															}
														); //endfadeout
									},4000); //endtimeout
			}
			break;
			
			case 84: //t for test
			break;
			
			case 89: //y for test
			break;
			
			case 13: //enter
				if(iszoom==true){
					/*$("section").fadeOut('400',function(){
						$("html").css("zoom",1);
						$("header").css("zoom",1);
						$.scrollTo('#current', 0, { axis:'y' });
						$.scrollTo('#current .current', 0, { axis:'x' });
						$("section").fadeIn('400');*/
						zoomInPage();
						setTimeout( function(){
							$.scrollTo('#current', 0, { axis:'y' });
							$.scrollTo('#current .current', 0, { axis:'x' });	
						}, 100);
						/*});*/
					iszoom=false;
					$("body").removeClass("zoom");
					$.scrollTo('#current', 10, { axis:'y' });
				}else{
					/*$("section").fadeOut('400',function(){
						$("html").css("zoom",0.1);
						$("header").css("zoom",10);
						$.scrollTo('html', 0);
						$("section").fadeIn('400');*/
						zoomOutPage();
						$(window).scrollTo("html",100);
						/*});*/
						
					iszoom=true;
					$("body").addClass("zoom");
				}
			break;
	        case 40: //down
				switch(iszoom){
					case false:
						if($("#next").length == 1){
							$("#current .current").removeClass("current");
							$("#current .prev").removeClass("prev");
							$("#current .next").removeClass("next");
					
							$("#current").attr("id","");
							$("#prev").attr("id","");
							$.scrollTo( $("#next"), 800);
							$("#next").attr("id","current").children(":nth-child(3)").addClass("next");;
							$("#current").next().attr("id","next");
							$("#current").prev().attr("id","prev");
							//$.scrollTo('+=10px', 10, { axis:'y' });
						}else{
							/*$.scrollTo('+=50', 400, { axis:'y'});
							$.scrollTo('-=60', 200, { axis:'y' });
							$.scrollTo('+=30', 200, { axis:'y'});
							$.scrollTo('#current', 400, { axis:'y'});*/
							if(isanimating==false){
								isanimating = true;
								$(window).scrollTo('+=50', 300, { axis:'y' }).scrollTo('#current', 300, { axis:'y' });
								setTimeout(function(){ isanimating = false;}, 600)
							}
						}
							return false;
			            break;
				
					case true:
					if($("#next").length==1){
						
						$("#current .current").removeClass("current");
						$("#current .prev").removeClass("prev");
						$("#current .next").removeClass("next");
					
						$("#current").attr("id","");
						$("#prev").attr("id","");
						$("#next").attr("id","current").children(":nth-child(3)").addClass("next").prev().addClass("current");
						$("#current").next().attr("id","next");
						$("#current").prev().attr("id","prev");
						
						$.scrollTo("+=100", 0, {axis: 'y'});
					}
					break;
					}
			break;
	        
			case 38: //up
				switch(iszoom){
					case false:
						if($("#prev").length == 1){
							$("#current .current").removeClass("current");
							$("#current .prev").removeClass("prev");
							$("#current .next").removeClass("next");
						
							$("#current").attr("id","");
							$("#next").attr("id","");
							$.scrollTo( $("#prev"), 800);
							$("#prev").attr("id","current").children(":nth-child(3)").addClass("next");;
						
							$("#current").next().attr("id","next");
							$("#current").prev().not("header").attr("id","prev");
							columnscount=0;
							//$.scrollTo('+=10px', 10, { axis:'y' });
						} else {
							if($("#current .prev").length==1){
								$("#current .current").removeClass("current");
								$("#current .prev").removeClass("prev");
								$("#current .next").removeClass("next");
						
								$("#current").children(":nth-child(2)").addClass("current");
								$("#current").children(":nth-child(3)").addClass("next");
						
								$.scrollTo( $("#current"), 10, {axis: 'y'});
							}else{
								/*$.scrollTo('-=30', 400, { axis:'y' });
								$.scrollTo('+=60', 200, { axis:'y' });
								$.scrollTo('-=10', 200, { axis:'y' });
								$.scrollTo('#current', 400, { axis:'y' });*/
								if(isanimating==false){
									isanimating = true;
									$(window).scrollTo('-=50', 300, { axis:'y' }).scrollTo('#current', 300, { axis:'y' });
									setTimeout(function(){ isanimating = false;}, 600)
								}
							}
						}
						return false;
		            break;
					
					case true:
						if($("#prev").length==1){
							
							$("#current .current").removeClass("current");
							$("#current .prev").removeClass("prev");
							$("#current .next").removeClass("next");
						
							$("#current").attr("id","");
							$("#next").attr("id","");
							$("#prev").attr("id","current").children(":nth-child(3)").addClass("next").prev().addClass("current");
						
							$("#current").next().attr("id","next");
							$("#current").prev().not("header").attr("id","prev");
							
							$.scrollTo("-=100", 0, {axis: 'y'});
							
							
						}
					break;
				}
			break;
	      	case 37: //left
				switch(iszoom){
					case false:
						if(columnscount==0){
							if($("#current .prev").length==1){
									$("#current .current").removeClass("current");
									$("#current .next").removeClass("next");
									
									$(window).scrollTo('#current .prev', 0, { axis:'x' }).scrollTo('#current', 0, { axis:'y' });
									
									$("#current .prev").removeClass("prev").addClass("current");
									$("#current .current").next().not(".end").addClass("next");
									$("#current .current").prev().not("h2:not(h2.page)").addClass("prev");
									columnscount=0;
							}else {
									if(isanimating==false){
										isanimating = true;
									$(window).stop(true,true).scrollTo('-=50', 300, { axis:'x' }).scrollTo('#current', 300);
									setTimeout(function(){ isanimating = false;}, 600)
									}
							}
						} else { //jump to begin of article
							$.scrollTo('#current .current', 800, { axis:'x' });
							columnscount=0;
						}

			            return false;
					break; //endfalse
					
					case true:
						return false;
					break;
					
				}//end left switch
				break;
	        case 39: //right
				switch(iszoom){
					case false:
						if($("#current .next").length==1){
							$("#current .current").removeClass("current");
							$("#current .prev").removeClass("prev");
							$(window).stop(true,true).scrollTo('#current .next', 0, { axis:'x' }).scrollTo('#current', 0, { axis:'y' });							$("#current .next").removeClass("next").addClass("current");
							$("#current .current").next().not(".end").addClass("next");
							$("#current .current").prev().not("h2:not(h2.page)").addClass("prev");
						}else {
							if(isanimating==false){
								isanimating = true;
								$(window).scrollTo('+=50', 100, { axis:'x' }).scrollTo('#current .current', 300, { axis:'x' });
								setTimeout(function(){ isanimating = false;}, 600)
							}
						}
			            return false;
					break; //endfalse
				
					case true:
						return false;
					break;
				
				}//end right switch
	        break;
	
	        case 32: //space
				if($("#current .current").attr("data-columns")>0){
					if(columnscount==0){
						columnscount=2;
						$.scrollTo('+=431px', 800, { axis:'x' });
					}
					else {
						if(columnscount==$("#current .current").attr("data-columns")) {
							$("#current .current").removeClass("current");
							$("#current .prev").removeClass("prev");
							$.scrollTo('#current .next', 800, { axis:'x' });
							$("#current .next").removeClass("next").addClass("current");
							$("#current .current").next().not(".end").addClass("next");
							$("#current .current").prev().not("h2:not(h2.page)").addClass("prev");
							columnscount=0;
						} else {
							$.scrollTo('+=431px', 800, { axis:'x' });
							columnscount+=1;
						}
					}
				} else {
					if($("#current .next").length==1){
						$("#current .current").removeClass("current");
						$("#current .prev").removeClass("prev");
						$.scrollTo('#current .next', 800, { axis:'x' });
						$("#current .next").removeClass("next").addClass("current");
						$("#current .current").next().not(".end").addClass("next");
						$("#current .current").prev().not("h2:not(h2.page)").addClass("prev");
						columnscount=0;
					}else{
						if($("#next").length==1){
							$.scrollTo('+=300', 300, { axis:'x' });
							$("#current .current").removeClass("current");
							$("#current .prev").removeClass("prev");
							$("#current .next").removeClass("next");

							$("#current").attr("id","");
							$("#prev").attr("id","");
							$.scrollTo( $("#next"), 800);
							$("#next").attr("id","current").children(":nth-child(3)").addClass("next").prev().addClass("current");
							$("#current").next().attr("id","next");
							$("#current").prev().attr("id","prev");
						} else { //bounce
							$.scrollTo('+=300', 300, { axis:'x' });
							$.scrollTo('-=400', 1000, { axis:'x' });
							$.scrollTo('+=100', 400, { axis:'x' });
						}
					}
				}
	            return false;
				break;
				
			case 65: //a
				$.fx.off = !$.fx.off;
				if($(".animation").length==0){
					$("body").append('<p class="animation on attention">Animation Off</p>');
				}
				if($(".off").length==1){
					$(".off").removeClass("off").addClass("on").text("Animation On").fadeIn('400');
				}else {
					$(".on").removeClass("on").addClass("off").text("Animation Off").fadeIn('400');
				}
				setTimeout(function(){
					$(".animation").fadeOut('400');
					},1000);
			break;
			
	        default:
	        break;  
	            }      
	}
	$("article, h3, h2.page").click(function(){
		switch (iszoom){
			case false:
				$.scrollTo(this, 800, { axis:'x' });
				$("#current .current").removeClass("current");
				$("#current .prev").removeClass("prev");
				$("#current .next").removeClass("next");
				$(this).addClass("current");
				$("#current .current").next().not(".end").addClass("next");
				$("#current .current").prev().not("h2:not(h2.page)").addClass("prev");
				columnscount=0;
			break;
			
			case true:
			break;
			
		}
		
	});//endclickwithoutzoom
	$("section.issue").click(function(){		
		switch (iszoom){
			case true:
			$("body").removeClass("zoom");
			
			$("#current").attr("id","");
			$("#current .current").removeClass("current");
			$("#current .prev").removeClass("prev");
			$("#current .next").removeClass("next");
			$("#prev").attr("id","");
			$("#next").attr("id","");
			
			$(this).attr("id","current").children(":nth-child(3)").addClass("next").prev().addClass("current");
			$("#current").next().attr("id","next");
			$("#current").prev().attr("id","prev");
			
			
			$("section").fadeOut('400',function(){
				$("html").css("zoom",1);
				$("header").css("zoom",1);
				$("section").fadeIn('400');
				$.scrollTo("#current", 0);
				});
			
			
			//$.scrollTo("#current .current", 800, { axis:'x' });
			iszoom=false;
			break;
		}
	}); //endclickissueinzoom
	columnscount = 0;
		if ($.browser.mozilla) {
	    	$(document).keypress (checkKey);
		} else {
	    	$(document).keydown (checkKey);
		}
		$(window).resize(function() {
		 	adjustLayout();
			$.scrollTo( $("#current"), 10, {axis:'y'});//$.scrollTo('+=10px', 10, { axis:'y' });
			$.scrollTo( $("#current .current"), 10, {axis:'x'});//$.scrollTo('+=10px', 10, { axis:'y' });
		});
});