$(function(){
	
	//trace
	//$('body').append('<div id="trace"></div>');
	
		
	//繧ｳ繝ｳ繝�Φ繝�撼陦ｨ遉ｺ
	$('#contents').hide();
	
	//繝翫ン陦ｨ遉ｺ
	if($.support.style){
		$('#nav').hide().delay(100).fadeIn(500);
	}
	
	
	//繝｡繝ｼ繝ｫ繝輔か繝ｼ繝
	
	$("#form form").submit(function() {
		$("form").validation({
			extension: {
				dialog: false,
				submit: "#submit"
			}
		});
		
		if($("div.requiredTip:visible").length==0){
			$.ajax({
				url : "http://etokiyoko.com/wp/wp-content/themes/twentyten/send.php",
				type : "post",
				data : { name: $('#input_name').val(), email: $('#input_email').val(), message: $('#textarea_message').val(), off:$('#submit').val()},
				datatype:'json',
				success: function(data) {
					$.validationResetFunc();
					$(".validationTip").remove();
					$("div#form li:last").append("<span id='comp'>Completed</span>");
					$("#comp").css({position:"absolute", top:"15px", left:"24em"});
					$("#comp").hide().fadeIn(500, function(){
						if(!$.support.style){ $(this).get(0).style.removeAttribute('filter'); }
					});
					$("#comp").delay(2000).fadeOut(500, function(){ $("#comp").remove(); });
				}
			});
		}
		return false;
	});
	
	var currentPage = 0;
	var comp = false;
	var move = false;
	function portfolioInt(){
		move = true;
	}
	
	//繝ｭ繝ｼ繝�ぅ繝ｳ繧ｰ
	var $images = $('img');
	$('body').append('<div id="mask"></div>');
	$('body').append('<img src="' + dir + '/images/loading.gif" alt="Loading..." id="progressCircle" />');
	$('#progressCircle').css({opacity:0.0});
	$('#progressCircle').animate({opacity:1.0}, {duration: 800, easing: "easeInExpo", complete:function(){
		$images.preload({ onFinish:finish,threshold: 2 });
	}});
	
	function finish( data ){
		comp  = true;
		if(currentPage == 0){
			$('#progressCircle').stop().delay(100).animate({opacity:0.0}, {duration: 800, easing: "easeOutExpo", complete:function(){
				$('#mask').stop().animate({width:0}, {duration: 1200, easing: "easeInOutExpo" });
				$('#progressCircle').remove();
			}});
		}
	}
	
	//閭梧勹蜈ｨ逕ｻ髱｢陦ｨ遉ｺ
	//$('#container').append('<div id="supersize"><a><img src="' + dir + '/images/bg.jpg" alt="" /></a><a><img src="' + dir + '/images/bg2.jpg" alt="" /></a></div>');
	$.fn.supersized.options = {
		startwidth: 1024,
		startheight: 681,
		vertical_center: 1,
		slideshow: 1,
		navigation: 0,
		transition: 1,
		pause_hover: 0,
		slide_counter: 0,
		slide_captions: 0,
		slide_interval: 5000
	};
	$('#supersize').supersized();
	
	
	//rollover繧ｯ繝ｩ繧ｹ
	$("a.rollover").each(function(i) {
		$(this).mouseover(function(){
			$(this).stop().animate({opacity:0.3}, {duration: 500, easing: "easeOutExpo"});
		});
		$(this).mouseout(function(){
			$(this).stop().animate({opacity:1.0}, {duration: 1000, easing: "easeOutExpo", complete:function(){
				if(!$.support.style){ $(this).get(0).style.removeAttribute('filter'); }
			}});
		});
	});
	$("input.rollover").each(function(i) {
		$(this).mouseover(function(){
			$(this).stop().animate({opacity:0.5}, {duration: 500, easing: "easeOutExpo"});
		});
		$(this).mouseout(function(){
			$(this).stop().animate({opacity:1.0}, {duration: 1000, easing: "easeOutExpo", complete:function(){
				if(!$.support.style){ $(this).get(0).style.removeAttribute('filter'); }
			}});
		});
	});
	
	//繝翫ン繧ｲ繝ｼ繧ｷ繝ｧ繝ｳ
	var btnArray = [];
	var categoryArray = [];
	$("#nav a").eq(currentPage).prepend('<span id="here">/&nbsp;</span>');
	$("#nav a").eq(currentPage).css({paddingLeft:"1em"});
	
	$("#nav .twitter a").hover(
  		function () {
    		$(this).stop().animate({opacity:0.5}, {duration: 500, easing: "easeOutExpo"});
  		},
  		function () {
  			$(this).stop().animate({opacity:1.0}, {duration: 1000, easing: "easeOutExpo"});
 		}
	);
	
	var navLen = $("#nav a").length;
	//for(var i = 0; i<navLen; i++){
	$("#nav .navBtn a").each(function(i) {
		
		var _category = $(".category").eq(i);
		categoryArray.push(_category);
		
		var btn = $(this);
		btnArray.push(btn);
		btn.mouseover(function(){
			var no = this.className.slice(3);
			if(no != currentPage){
				$(this).stop().animate({opacity:0.3}, {duration: 500, easing: "easeOutExpo"});
			}
		});
		btn.mouseout(function(){
			var no = this.className.slice(3);
			if(no != currentPage){
				$(this).stop().animate({opacity:1.0}, {duration: 1000, easing: "easeOutExpo",complete:function(){
					if(!$.support.style){ $(this).get(0).style.removeAttribute('filter'); }
				}});
			}
		});
		
		btn.click(function(){
			
			$("#here").remove();
			$("#nav a").each(function(j) {
					$(this).stop().animate({paddingLeft:0}, {duration: 300, easing: "easeOutExpo" });
					$(this).css({cursor: "pointer"});
			});
			
			$(this).prepend('<span id="here">/&nbsp;</span>');
			$(this).stop().animate({opacity:1, paddingLeft:"1em"}, {duration: 300, easing: "easeOutExpo", complete:function(){ if(!$.support.style){ $(this).get(0).style.removeAttribute('filter'); } } });
			
			var no = this.className.slice(3);
			if(no != currentPage){
				var destinedPage = no;
				var url = this.href;
				
				if(currentPage == 0 ){
					
					$('#progressCircle').stop().remove();
					
					if($('#mask').width() > 100){
						var _duration = 500;
						var _easing = "easeOutExpo";
					}else{
						var _duration = 1000;
						var _easing = "easeInOutExpo";
					}
					$('#mask').stop().animate({width:"100%"}, {duration: _duration, easing: _easing, complete:function(){
						
						//location.href = url;
						portfolioInt();
						$('#supersize').hide();
						$('#contents').show();
						
						//繧ｳ繝ｳ繝�Φ繝�ｸ矩Κ縺ｮ菴咏區隱ｿ謨ｴ
						if($.os.name == 'iphone' || $.os.name == 'ipod' || $.os.name == 'ipad') {
						}else{
							var originalHeight = $("#contents div.category:last").height();
							function resizeHeight(){
								$("#contents div.category:last").height( $("body").height() - 103 );
								if($("#contents div.category:last").height() < originalHeight + 20){
									//$("div.category:last").height(originalHeight + 20);
								}
							}
							$(window).resize(function(){
								resizeHeight();
							});
							resizeHeight();
						}
						
						$("#contents").css({ opacity:0 });
						$("#contents").animate({opacity:1}, {duration: 800, easing: "easeInOutCubic",complete:function(){
							if(!$.support.style){
								$(this).get(0).style.removeAttribute('filter');
							}
						}});
						$("html,body").scrollTop($("#container").height());
						$("html,body").animate({scrollTop:categoryArray[destinedPage-1].position().top}, {duration: 1200, easing: "easeOutExpo", complete:function(){
							move = false;

							//iPhone縲（Pad縺ｮ蝣ｴ蜷医ヵ繝ｪ繝�き繝悶Ν縺ｫ縲
							if($.os.name == 'iphone' || $.os.name == 'ipod' || $.os.name == 'ipad') {
								$("#contents div.category.portfolio .flickable").css({overflow:"auto", width:"100%"});
								$("#contents div.category.portfolio .flickable").flickable();
							}
							
							$(window).scroll(function () {
								if(move == false){
								
								var scrollState = -1;
								var prevState = -1;
								var count = 0;
								$("#contents .category").each(function(i) {
									
									if(0 <= $(this).offset().top - $(window).scrollTop() && $(this).offset().top - $(window).scrollTop() < 120){
										
											scrollState = i;
											
											$("#here").remove();
											
											$("#nav a").each(function(j) {
												$(this).stop().animate({opacity:1, paddingLeft:0}, {duration: 300, easing: "easeOutExpo" });
												$(this).css({cursor: "pointer"});
											});
											btnArray[i + 1].prepend('<span id="here">/&nbsp;</span>');
											btnArray[i + 1].stop().animate({opacity:1, paddingLeft:"1em"}, {duration: 300, easing: "easeOutExpo" });
											
											currentPage = i + 1;
											
											return false;
										
									}
								});
								}
							});
							
						}});
					}});
				}else{
					if(destinedPage == 0){
						$(window).unbind("scroll");
						$("#contents").stop().animate({opacity:0.0}, {duration: 500, easing: "easeOutCubic", complete:function(){
							//if(comp  == true){
								$("#contents").hide();
								$('#supersize').show();
								$('#mask').stop().animate({width:0}, {duration: 1500, easing: "easeOutQuint" });
							//}
						}});
						//currentPage = 0;
					}else{
						move = true;
						
						$("html,body").stop().animate({scrollTop:categoryArray[destinedPage-1].position().top}, {duration: 1200, easing: "easeInOutExpo", complete:function(){
							move = false;
						} });
					}
				}
				$(this).css({cursor: "default"});
			}
			currentPage = no;
			return false;
		});
	});
	
	
	
	//繝昴�繝医ヵ繧ｩ繝ｪ繧ｪ
	
	var slctdPic = 0;
	var picLen = [];
	var photoArray = [];
	var slctdTag = 0;
	var tagLen = $("#contents div.category.portfolio ul").length;
	var portfolioNavArray = [];
	$("#contents div.category.portfolio ul").each(function(i) {
		var thumbNum = $(this).children().length;
		$("div.category.portfolio h3").eq(i).append("<span class='images'>" + thumbNum + "images</span>")
		picLen.push(thumbNum);
		$(this).css({ width:thumbNum * 90 });
		$(this).parent().css({ width:thumbNum * 90 });
		photoArray[i] = [];
		for(var j = 0; j<thumbNum; j++){
			photoArray[i].push($(this).children().children().get(j).href);
		};
	});
	
	$("#contents div.category.portfolio .flickable").each(function(i) {
	 	
		//iPhone縲（Pad縺ｮ蝣ｴ蜷医ヵ繝ｪ繝�き繝悶Ν縺ｫ縲
		if($.os.name == 'iphone' || $.os.name == 'ipod' || $.os.name == 'ipad') {
		}else{
			$(this).mousemove(function(e){
				var percent = (e.pageX - $("div.category").offset().left - 90) / ($(window).width() - $("div.category").offset().left - 180);
				var targetX = -($(this).width() - ($(window).width() - $("div.category").offset().left)) * percent;
				
				if(targetX < -$(this).width() + $(window).width() - $("div.category").offset().left){
					targetX = -$(this).width() + $(window).width() - $("div.category").offset().left;
				}
				
				if(targetX > 0){
					targetX = 0;
				}
				$(this).stop().animate({left:targetX}, {duration: 500, easing: "easeOutExpo" });
			});
		}
	});
	
	$("#contents div.category.portfolio li a").each(function() {
		
		$(this).find("img").attr("title", "")
		
		$(this).mouseover(function(e){
			$(this).stop().animate({opacity:0.3}, {duration: 500, easing: "easeOutExpo" });
		});
		$(this).mouseout(function(e){
			$(this).stop().animate({opacity:1.0}, {duration: 1000, easing: "easeOutExpo" });
		});
		
		$(this).click(function(){
			
			slctdPic = $.inArray($(this).parent().get(0), $(this).parent().parent().children());
			slctdTag = $.inArray($(this).parent().parent().get(0), $("div.category.portfolio ul"));
			
			$('#mask').hide();
			$('body').prepend('<div id="lightBoxBg"></div>');
			$('#lightBoxBg').css({opacity:0.0});
			$('#lightBoxBg').stop().animate({opacity:1},{duration: 800, easing: "easeOutExpo", complete:function(){
				$('#contents').hide();
				lightBoxInt();
				loadImg(slctdPic);
				if(!$.support.style){ $(this).get(0).style.removeAttribute('filter'); }
			}});
			

			return false;
		});
	});
	
	function lightBoxInt(url){
		//繝ｭ繝ｼ繝�ぅ繝ｳ繧ｰ
		$('#lightBoxBg').append('<img src="' + dir + '/images/loading.gif" alt="Loading..." id="progressCircle" />');
		$('#progressCircle').css({opacity:0.0});
		$('#progressCircle').stop().animate({opacity:1.0}, {duration: 500, easing: "easeInExpo"});
		//繝翫ン
		$('#lightBoxBg').append('<div id="portfolioNav">/<span class="back">Back</span>/</div>');
		$("#contents div.category.portfolio h3 span:first-child").each(function(i) {
			var categoryBtn = $('#portfolioNav').append('<span class = "' + i + '">'+ $(this).text() + '</span>/');	
		});
		
		$("#portfolioNav span").each(function(i) {
			portfolioNavArray.push($(this));
			$(this).mouseover(function(){
				if(i == 0){
					$(this).css({cursor:"pointer"});
					$(this).stop().fadeTo(500, 0.3);
				}else if(i == slctdTag + 1){
					$(this).css({cursor:"default", textDecoration:"underline"});
				}else{
					$(this).css({cursor:"pointer"});
					$(this).stop().fadeTo(500, 1.0);
				}
			});
			$(this).mouseout(function(){
				if(i == 0){
					$(this).css({cursor:"pointer"});
					$(this).stop().fadeTo(500, 1.0);
				}else if(i == slctdTag + 1){
					$(this).css({cursor:"default", textDecoration:"underline"});
				}else{
					$(this).css({cursor:"pointer"});
					$(this).stop().fadeTo(500, 0.3);
				}
			});
			$(this).click(function(){
				var prevTag = slctdTag;
				slctdPic = 0;
				slctdTag = $.inArray(this, $("#portfolioNav span")) - 1;
				$(this).css({ textDecoration:"underline" });
				$("#portfolioNav span").each(function(j) {
					if(j == 0){
						$(this).css({textDecoration:"none"});
						$(this).stop().fadeTo(500, 1.0);
					}else if(j == prevTag +1){
						$(this).css({textDecoration:"none"});
						$(this).stop().fadeTo(500, 0.3);
					}else if(j == slctdTag+1){
						$(this).css({cursor:"pointer"});
						$(this).stop().fadeTo(500, 1.0);
					}
				});
				
				$("#tag").stop().fadeTo(800, 0.0);
				
				//$("#photo img").stop().animate({left:-$("#photo").width()}, {duration: 800, easing: "easeInOutExpo"});
				//$("#photo").stop().animate({marginLeft:$("#photo").width(), width:0}, {duration: 800, easing: "easeInOutExpo", complete:function(){
				$("#photo").stop().fadeOut(300, function(){
					$("#photoWrap").remove();
					loadImg(slctdPic);
				});
			});
			if(i == 0){
				$(this).mouseover(function(){
					$(this).stop().animate({opacity:0.3}, {duration: 500, easing: "easeOutExpo"});
				});
				$(this).mouseout(function(){
					$(this).stop().animate({opacity:1.0}, {duration: 1000, easing: "easeOutExpo"});
				});
				$(this).click(function(){
					closeLightBox();
				});
			}else if(slctdTag + 1 == i){
				$(this).css({opacity:1.0, cursor:"default", textDecoration:"underline"});
			}else{
				$(this).css({opacity:0.3});
			}
			
		});	
		$("#portfolioNav").css({opacity:0.0});
		$('#portfolioNav').stop().animate({opacity:1.0}, {duration: 500, complete:function(){ if(!$.support.style){ $(this).get(0).style.removeAttribute('filter'); } }});
		
		//NEXT繝懊ち繝ｳ
		$('#lightBoxBg').append('<div id="next">Next&nbsp;/</div>');
		$('#next').css({cursor:"pointer"});
		$('#next').hide();
		if(slctdTag+1 != tagLen && slctdPic+1 != picLen[tagLen-1]){
			$('#next').delay(100).fadeIn(1000);
		}
		$('#next').mouseover(function(){
			$(this).stop().animate({opacity:0.3}, {duration: 500, easing: "easeOutExpo"});
		});
		$('#next').mouseout(function(){
			$(this).stop().animate({opacity:1.0}, {duration: 1000, easing: "easeOutExpo", complete:function(){
				if(!$.support.style){ $(this).get(0).style.removeAttribute('filter'); }
			}});
		});
		function nextFunc(){
			slctdPic++;
			if(slctdPic >= picLen[slctdTag]){
				portfolioNavArray[slctdTag+1].css({ cursor:"pointer", textDecoration:"none" });
				portfolioNavArray[slctdTag+1].stop().fadeTo(500, 0.3);
				slctdTag++;
				slctdPic = 0;
				portfolioNavArray[slctdTag+1].css({ cursor:"default", textDecoration:"underline" });
				portfolioNavArray[slctdTag+1].stop().fadeTo(500, 1.0);
			}
			
			$("#tag").stop().animate({opacity:0}, {duration: 1000, easing: "easeOutExpo"});
			
			/*$("#photo img").stop().animate({left:-$("#photo").width()}, {duration: 1000, easing: "easeInOutExpo"});
			$("#photo").stop().animate({marginLeft:$("#photo").width(), width:0}, {duration: 1000, easing: "easeInOutExpo", complete:function(){
				$("#photoWrap").remove();
				loadImg(slctdPic);
			}});*/
			
			if(slctdTag+1 == tagLen && slctdPic+1 == picLen[tagLen-1]){
				$('#next').fadeOut(500);
			}else{
				$('#next').fadeIn(1000);
			}
			
			$("#photo").stop().fadeOut(300, function(){
				$("#photoWrap").remove();
				loadImg(slctdPic);
			});
		}
		$('#next').click(function(){
			nextFunc();
		});
		
		//PREV繝懊ち繝ｳ
		$('#lightBoxBg').append('<div id="prev">/&nbsp;Prev</div>');
		$('#prev').css({cursor:"pointer"});
		$('#prev').hide();
		if(slctdTag != 0 && slctdPic != 0){
			$('#prev').delay(100).fadeIn(1000);
		}
		$('#prev').mouseover(function(){
			$(this).stop().animate({opacity:0.3}, {duration: 500, easing: "easeOutExpo"});
		});
		$('#prev').mouseout(function(){
			$(this).stop().animate({opacity:1.0}, {duration: 1000, easing: "easeOutExpo",complete:function(){
				if(!$.support.style){
					$(this).get(0).style.removeAttribute('filter');
				}
			}});
		});
		function prevFunc(){
			slctdPic--;
			if(slctdPic < 0){
				portfolioNavArray[slctdTag+1].stop().fadeTo(500, 0.3);
				portfolioNavArray[slctdTag+1].css({ cursor:"pointer", textDecoration:"none" });
				
				slctdTag--;
				slctdPic = picLen[slctdTag] - 1;
				portfolioNavArray[slctdTag+1].css({ textDecoration:"underline" });
				portfolioNavArray[slctdTag+1].stop().fadeTo(500, 1.0);
			}
			
			$("#tag").stop().animate({opacity:0}, {duration: 1000, easing: "easeOutExpo"});
			
			/*$("#photo img").stop().animate({left:-$("#photo").width()}, {duration: 1000, easing: "easeInOutExpo"});
			$("#photo").stop().animate({marginLeft:$("#photo").width(), width:0}, {duration: 1000, easing: "easeInOutExpo", complete:function(){
				$("#photoWrap").remove();
				loadImg(slctdPic);
			}});*/
			
			if(slctdTag == 0 && slctdPic == 0){
				$('#prev').fadeOut(500);
			}else{
				$('#prev').fadeIn(1000);
			}
			
			$("#photo").stop().fadeOut(300, function(){
				$("#photoWrap").remove();
				loadImg(slctdPic);
			});
		}
		$('#prev').click(function(){	
			prevFunc();
		});
		
		$(window).keydown(function(e){
			
			if(e.which == 39){
				var p = photoArray.length-1;
				var n = picLen[slctdTag] - 1;
				if(slctdTag == p && slctdPic == n){
				}else{
					nextFunc();
					$("#next").css({opacity:0.3});
					$("#next").stop().animate({opacity:1.0}, {duration: 300, easing: "easeInExpo"});
				}
			}
			if(e.which == 37){
				if(slctdTag > 0 || slctdPic > 0){
					prevFunc();
					$("#prev").css({opacity:0.3});
					$("#prev").stop().animate({opacity:1.0}, {duration: 300, easing: "easeInExpo"});
				}
			}
		});
	}
	
	function loadImg(slctdPic){
		//譛蛻昴→譛蠕後�NEXT PREV繝懊ち繝ｳ髫縺
		if(slctdTag+1 == tagLen && slctdPic+1 == picLen[tagLen-1]){
			$('#next').delay(100).fadeOut(500);
		}else{
			$('#next').delay(100).fadeIn(1000);
		}
		if(slctdTag == 0 && slctdPic == 0){
			$('#prev').delay(100).fadeOut(500);
		}else{
			$('#prev').delay(100).fadeIn(1000);
		}
		
		$('#lightBoxBg').append('<div id="photoWrap"></div>');
		$('#photoWrap').append('<div id="photo"></div>');
		var img = new Image();
		img.src = photoArray[slctdTag][slctdPic];
		
		$('#photo').append(img);
		//$('#photo').css({width:0});
		$('#photo img').hide();
		$("#photo img").load(function () {
			var w = $(this).width();
			var h = $(this).height();
			if(h > $('body').height() - 90){
				var scale = ($('body').height() - 90) / h;
				h *= scale;
				w *= scale;
			}
			$("#photo img").css({width:w, height:h});
			$('#photoWrap').css({marginLeft:-w/2, marginTop:-h/2, width:w, height:h});
			//$("#photo").stop().animate({width:w}, {duration: 1200, easing: "easeInOutExpo"});
			$('#photo img').fadeIn(500);
			
			$('#photoWrap').append('<div id="tag" class="photoInfo">' + (slctdPic+1) + '&nbsp;of&nbsp;' + picLen[slctdTag] + '</div>');
			$('#tag').css({bottom:-$('#tag').height()-5, opacity:0, width:w});
			$("#tag").stop().delay(200).animate({opacity:1}, {duration: 500});
		});
		
		
		$('#photo').click(function(){
			closeLightBox();
		});
	}
	function closeLightBox(){
		$('#next').unbind("mouseover");
		$('#next').unbind("mouseout");
		$('#next').unbind("click");
		$('body').unbind("mousemove");
		$('#prev').unbind("mouseover");
		$('#prev').unbind("mouseout");
		$('#prev').unbind("click");
		
		$('#progressCircle').remove();
		
		$("#portfolioNav").stop().animate({opacity:0}, {duration: 1000, easing: "easeOutExpo", complete:function(){
			$(this).remove();
		}});
		
		$('#next').stop().animate({opacity:0}, {duration: 1000, easing: "easeOutExpo", complete:function(){
			$(this).remove();
		}});
		
		$('#prev').stop().animate({opacity:0}, {duration: 1000, easing: "easeOutExpo", complete:function(){
			$(this).remove();
		}});
		
		$("#tag").stop().animate({opacity:0}, {duration: 1000, easing: "easeOutExpo"});
		
		//$("#photo img").stop().animate({left:-$("#photo").width()}, {duration: 1000, easing: "easeInOutExpo"});
		//$("#photo").stop().animate({marginLeft:$("#photo").width(), width:0}, {duration: 1000, easing: "easeInOutExpo", complete:function(){
		$("#photo").stop().fadeOut(500, function(){
			$("#photoWrap").remove();
			$('div#contents').show();
			$('div#lightBoxBg').stop().animate({opacity:0},{duration: 1200, complete:function(){
				$(this).remove();
			}});
			
			if($.os.name == 'iphone' || $.os.name == 'ipod' || $.os.name == 'ipad') {
				$("div.category.portfolio .flickable").flickable('refresh');
			}
		});
	}
});