/*===============================================
ページトップへのスクロール
===============================================*/
$(function(){
	$("div#PAGETOP a").click( function() {$("html,body").animate({scrollTop:0},500); return false; } );
});


/*===============================================
施行事例のXMLロードと表示、スクロール
===============================================*/
$(function(){
	
	var intervalID;
	var  resizeTimer;
	var $window = $(window);
	var $caseList;
	var $caseWrapper;
	var $caseContainer;
	var $board;
	var $caseDrawer;
	var $foot;
	var windowWidth;
	var windowHeight;
	var hitAreaRight;
	var hitAreaLeft;
	var mgl = 0;
	var mglMin;
	var mglMax = 0;
	var speed = 30;									
	var moveDistance;
	var isTopPage;
	var caseOpen = false;

	/*===============================================
	Timing:DOMの準備完了時
	action:xml読み込み。
	===============================================*/
	
	function init() {
		/* HTML要素の追加 */
		isTopPage = !$('div#FOOT').length;
		if ( isTopPage ) {
			//-----
			//トップページの場合
			//-----
			$('div#FOOT-TOP').before('<div id="CASE"><div id="ILLUST"><div id="CASE-LIST"><div id="CASE-WRAPPER"><div id="CASE-LOADER"><img src="/images/common/case-loader.gif" width="24" height="24" alt="読み込み中" /></div></div></div></div></div>');
			$caseContainer = $("div#CASE-WRAPPER");
		} else {
			//-----
			//下層ページの場合
			//-----
			
			$('div#FOOT').before('<div id="CASE-DRAWER"><div id="CASE-LIST"><div id="BOARD">&nbsp;</div><div id="CASE-FIELD"><div id="CASE-WRAPPER" class="clearfix"><div id="CASE-LOADER"><img src="/images/common/case-loader.gif" width="24" height="24" alt="読み込み中" /></div></div></div></div></div>');
			
			$caseContainer = $("div#CASE-FIELD");
			$caseDrawer = $("div#CASE-DRAWER");
			$board = $("div#BOARD");
			$foot = $('div#FOOT');
			
			//CSS ( div#BOARD )
			$board.css("width","110px");
			$board.css("height","90px");
			$board.css("position","absolute");
			$board.css("background-image","url(/images/common/img-galleryboard2.png)");
			$board.css("background-repeat","no-repeat");
			$board.css("z-index","-1");
			
			//CSS for IE6
			if ( $.browser.msie && $.browser.version >= 5.5 && $.browser.version < 7 ) {
				$board.css("background-image","none");
				$board.css("filter","progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/images/common/img-galleryboard2.png',sizingMethod='scale')");
			}
		}
		
		$caseList = $("div#CASE-LIST");
		$caseWrapper = $("div#CASE-WRAPPER");
		
		if ( !isTopPage ) {
			$caseDrawer.css("margin-top","120px");
			$caseDrawer.css("height","80px");
			$caseList.css("margin-top","0px");
			$caseWrapper.hide();
		}
		
		//CSS設定
		$caseContainer.css("padding-top","80px");
		$caseContainer.css("margin-left",mglMax+"px");
		
		/* xml読み込み */
		$.ajax({													
				type:"GET",
				url:"/gallery/galleries.xml",
				dataType:"xml",
				success:onLoad
		});
	}
	
	
	/*===============================================
	Timing: xml読み込み完了後
	action: XMLの解析と横スクロールの設定
	===============================================*/
	function onLoad(xml) {
		parseXML(xml);
		initEffects();
	}
	
	/*===============================================
	Timing: xml読み込み完了後
	action: XMLを解析してclass=sampleにはめ込んでいく。終了後widthを設定する。
	===============================================*/
	
	function parseXML(xml) {
		$caseWrapper.empty();
	 	$(xml).find("gallery").each(function(i) {
	 		var title = $(this).attr("title");
	 		var date = $(this).attr("date");
	 		var address = $(this).attr("address");
	 		var tsubo = $(this).attr("tsubo");
	 		var image = $(this).attr("image");
	 		var url = $(this).attr("url");
	 		$caseWrapper.append('<a href="' + url + '" class="case clearfix" style="height:120px; margin-top:0px;">'
	 							+ '<span class="thumimg" style="background-image:url(' + image + ')">title</span>'
	 							+ '<span class="name"><strong>' + title + '</strong>'
	 							+ '<span class="date">' + date + '</span><br />'
	 							+ address + '<br />'
	 							+ tsubo + '</span>'
	 							+ '</a>' );
	 	});
	 	onResize();
	}
	
	/*===============================================
	Timing: xml解析完了後
	action: 横スクロールを設定
	===============================================*/
	function initEffects () {
		onResize();
		$window.resize( setResizeTimer );
		$("html,body").mousemove(onMouseMove);
		if ( !isTopPage ) $window.scroll( onScroll );
		intervalID = setInterval( setMarginLeft, 50);
	}
	
	/*===============================================
	Timing: class=mouseover-right,mouseover-leftにロールオーバー時
	action: moveDistanceをマウスの位置によって書き換える。
	===============================================*/
	function onMouseMove(e) {
		var i = e.clientX;
		
		if ( $caseContainer.width() < windowWidth ) {
			moveDistance = 0;
			return;
		}
		
		//マウス位置が範囲外
		if ( e.clientY < $caseContainer.offset().top - $window.scrollTop() ) {
			moveDistance = 0;
			//下層ページで開いた状態の場合
			if ( !isTopPage && caseOpen ) {
				$caseList.stop();
				$caseList.animate( {marginTop:120}, 500,function() {
					$caseDrawer.css("margin-top","120px");
					$caseDrawer.css("height","80px");
					$caseList.css("margin-top","0px");
					$caseWrapper.hide();
				} );
			}
			caseOpen = false;
			return;
		}
		
		//下層ページで閉じた状態の場合
		if ( !isTopPage && !caseOpen ) {
			$caseList.stop();
			$caseList.css("margin-top","120px");
			$caseDrawer.css("height","200px");
			$caseDrawer.css("margin-top","0px");
			$caseWrapper.show();
			$caseList.animate( {marginTop:0}, 500 );
		}
		caseOpen = true;
		
		//移動距離の設定
		if ( i <= hitAreaLeft ) {
			var l = (hitAreaLeft-i)/hitAreaLeft;
		} else if( i >= hitAreaRight ) {
			var l  = (i - hitAreaRight)/hitAreaLeft * -1;
		} else {
			var l = 0;
		}
		moveDistance = l * speed;
	}
	
	/*===============================================
	Timing: Timer
	action: 目的地を決めて、その差分に0.2をかけた距離だけ動かす。
	===============================================*/
	function setMarginLeft() {
		if ( $caseContainer.width() < windowWidth ) return;
	
		//目的地mglの設定
		if ( !isNaN(moveDistance) && moveDistance != 0 ) {
			if ( isNaN(mgl) ) mgl = 0;
			mgl = mgl + moveDistance;
			
			if( mgl >= mglMax ) mgl = mglMax;
			else if ( mgl <= mglMin ) mgl = mglMin;
		}
		
		//実際に動かす（減速しながら）
		var nowMgl = parseInt($caseContainer.css("margin-left"));
		if ( isNaN(nowMgl) ) nowMgl = 0;
		if( nowMgl != mgl ){
			var nextMgl = nowMgl + (mgl - nowMgl) * 0.3;
			$caseContainer.css("margin-left",nextMgl+"px");
		}
	}
	
	/*===============================================
	Timing: Windowのリサイズ時
	action: ウィンドウの幅を取得し、関連するプロパティの値を再計算
	===============================================*/
	function setResizeTimer() {
		if ( resizeTimer ) clearTimeout(resizeTimer);
		resizeTimer = setTimeout(onResize,200);
	}
	
	function onResize(){
		windowWidth = $window.width();
		windowHeight = $window.height()
		hitAreaLeft = windowWidth /3;
		hitAreaRight = windowWidth - hitAreaLeft;
        if ( $("a.case").length ) {
		 	var w = ( $("a.case").length) * 265 + 15;
		 	if ( w < windowWidth ) {
				w = windowWidth;
				$caseContainer.css("width", w );
				$caseContainer.css("margin-left",mglMax+"px");
				moveDistance = 0;
		 	} else {
				$caseContainer.css("width", w );
		 	}
		 }
		mglMin = windowWidth - $caseContainer.width();
	 	if ( !isTopPage ) {
			$board.css("left",Math.round(windowWidth/2+400)+"px");
	 	}
		onScroll();
	}
	
	/*===============================================
	Timing: Windowのスクロール時
	action: FOOTとCASE-DRAWERのY座標設定
	===============================================*/
	function onScroll() {
		var st = $window.scrollTop();
		var ft = st + windowHeight - 30;
		var ct = st + windowHeight - 230;
		if ( !isTopPage ) {
			$foot.css("top",ft+"px");
			$caseDrawer.css("top",ct+"px");
		}
	}
	
	
	
	init();

});