<!-- studio photo -->
$(document).ready(function(){
	
	if (window.addEventListener) {
	  window.addEventListener('load', function(){showPhoto();} , false);
	} else if (window.attachEvent) {//IE—p
	  window.attachEvent('onload' , function(){showPhoto();} );
	}
		
	//pre load big image
	var imgObj = new Image();  
	imgObj.src = $("img#preload");
	
	$("p#studioimg img").css({'clip' : 'rect(0px, 0px, 420px, 0px)','opacity' : 0,'display' : 'block' });
	
	var firstPohto = $("p#studioimg img.show");
	
	jQuery.extend( jQuery.easing,{easeOutQuart: function (x, t, b, c, d) {return -c * ((t=t/d-1)*t*t*t - 1) + b;}});
	
	var nowSlide = false;
	var pohtoBox = $("p#studioimg")
	var nownum = 1;
	var nextnum = 2;
	var totalnum = $("p#studioimg a img").length;
	
	
	//first photo 
	function showPhoto(){
		
		if(firstPohto.css('opacity')==0 || firstPohto.css('clip')=='rect(0px 0px 420px 0px)'){
			firstPohto.stop().animate({'clip':'rect(0px 630px 420px 0px)','opacity' : 1}, 700,'easeOutQuart')
		}
		
		nowSlide = true;
	}
	
	
	
	//thumbnail click
	$("div#photomenu ul li a").click(function(){
		if(nowSlide){
			nowSlide = false;
			var tnum =  new String($(this).parent().attr("className"));
			nextnum = Number(tnum.slice(1));
			if(nownum != nextnum){
				changePic();
			}else{
				nowSlide = true;
				return false;
			}
		}
	});
	
	$("p#studioimg a").click(function(){
		if(nowSlide){
			nowSlide = false;
			var nnum =  nownum + 1;
			if(nnum <= totalnum){
				nextnum = nnum;
			}else{
				nextnum = 1;
			}
			changePic();
		}
	});
	
	
	//cange photo
	function changePic() {
		nownum = nextnum;
		var maininBox = $("p#studiomsg");
		var position = maininBox.offset();
		pohtoBox.css({'left': position.left + Math.floor( (maininBox.width() - pohtoBox.width())/2 ) });	
		
		var clsn = new String(".p"+nextnum);
		
		$("div#photomenu ul li img.hit").removeClass("hit");
		$("div#photomenu ul li"+clsn+" img").addClass("hit");
		
		var nowphoto = $("p#studioimg img.show");
		var nextphoto = $("p#studioimg a"+clsn+" img");
		nowSlide = true;
		$("p#studioimg img").css({'z-index':0 }).removeClass("show");
		nextphoto.addClass("show").css({'clip' : 'rect(0px, 0px, 420px, 0px)', 'opacity' : 0, 'z-index' : 1}).stop().animate({'clip':'rect(0px 630px 420px 0px)', 'opacity' : 1}, 500,"easeOutQuart", function(){ 
			$("p#studioimg img:not(:animated)").each(function(){
				if($(this).css('z-index')==0){
					$(this).css({'clip' : 'rect(0px, 0px, 420px, 0px)', 'opacity' : 0});
				}
			});
			
			nextphoto.css({'clip' : 'rect(0px, 630px, 420px, 0px)', 'opacity' : 1});
			
		});	
		
		return false;
		
 	}
	
	//
	firstPohto.stop().animate({'clip':'rect(0px 630px 420px 0px)','opacity' : 1}, 700,"easeOutQuart");
  
});