/*
 *
 *	jQuery Slide
 *
 *	@author	moag, Inc.
 *
 */
 
$(function(){
		var photo = $( '.catalogue div#mainImage p' );						// 画像の表示領域
		var thumnail = $( '.catalogue div#thumbnailImage ul li' );			// サムネイル領域
		
		var n = photo.size();			// 画像数
		var c = 0;						// 現状のインデックス番号
		var c_old = c;					// 前画像インデックス番号保存用
		var nextPhoto = photo.eq(1);	// 初期状態の次の画像
		var slideTime = 8000;			// スライドの間隔
		var fadeTime = 1000;			// フェードの時間
		
		thumnail.hover( function( ev ) {
			if( c != thumnail.index(this) ) thumnail.eq(thumnail.index(this)).addClass("hover");
		}, function( ev ) {
			thumnail.eq(thumnail.index(this)).removeClass("hover");
		});
		
		thumnail.click( function( ev ) {
			c = thumnail.index(this);
			if( c != c_old ) togglePhoto();
		});
		
		photo.eq( 0 ).nextAll().hide();			// 先頭以外の画像は非表示（アクセス直後のみ）
		thumnail.eq( 0 ).toggleClass("selected");	// 最初のサムネイルを選択状態にしておく
		
		// タイマー設定
		var t = $.timer(slideTime, function (timer) {
			if ( c < n - 1 ) {
				c += 1;
			} else {
				c = 0;
			}
			togglePhoto();
		});
		
		// 画像切り替えメソッド
		function togglePhoto(){
			t.stop();						// タイマー停止
			photo.fadeOut(fadeTime);		// 表示中の画像をフェードアウト
			photo.hide();					// 表示中の画像を非表示に
			nextPhoto = photo.eq(c);		// 次の画像の設定
			nextPhoto.fadeIn(fadeTime);		// 次の画像を表示
			thumnail.eq(c).removeClass("hover");
			thumnail.eq(c_old).toggleClass("selected");
			thumnail.eq(c).toggleClass("selected");
			c_old = c;
			t.reset(slideTime);				// タイマー再起動
		}
		
});

$(function(){
		var photo = $( '.home div#mainImage p' );						// 画像の表示領域
		var nav = $( '.home div#imageNav ul li img' );			// ナビゲーション領域
		
		var n = photo.size();			// 画像数
		var c = 0;						// 現状のインデックス番号
		var c_old = c;					// 前画像インデックス番号保存用
		var slideTime = 8000;			// スライドの間隔
		var fadeTime = 4000;			// フェードの時間
		
		nav.click( function( ev ) {
			c = nav.index(this);
			if( c != c_old ) btnTogglePhoto();
		});
		
		photo.eq( 0 ).nextAll().hide();			// 先頭以外の画像は非表示（アクセス直後のみ）
		nav.eq( 0 ).fadeTo(0, 0);				// 最初のナビゲーションを選択状態にしておく
		
		// タイマー設定
		var t = $.timer(slideTime, function (timer) {
			if ( c < n - 1 ) {
				c += 1;
			} else {
				c = 0;
			}
			togglePhoto();
		});
		
		// 画像切り替え
		function btnTogglePhoto(){
			t.stop();						// タイマー停止
			photo.hide();					// 表示中の画像を非表示に
			nextPhoto = photo.eq(c);		// 次の画像の設定
			nextPhoto.fadeIn(fadeTime);		// 次の画像を表示
			nav.fadeTo(0, 1);
			nav.eq(c).fadeTo(0, 0);
			c_old = c;
			t.reset(slideTime);				// タイマー再起動
		}
		function togglePhoto(){
			t.stop();							// タイマー停止
			photo.eq(c_old).fadeOut( fadeTime, function() {
				photo.eq(c_old).hide();
				nav.fadeTo(0, 1);
				nav.eq(c).fadeTo(0, 0);
				photo.eq(c).fadeIn( fadeTime, function() {
					c_old = c;
					t.reset(slideTime);
				} );
			} );
		}
		
});