/*------------------------------------------------------------

 2011 TERA Web Site
 
 Toppage Works Slider Javascript
 
 coding.Kobayashi

------------------------------------------------------------*/

/*--------------------------------------------------------------
時間とファイルの設定
--------------------------------------------------------------*/

// オートプレイの間隔
intervalTime = 5000;

imagePathArg = new Array(
			'images/topvisual/main01.jpg',
			'images/topvisual/main02.jpg',
			'images/topvisual/main03.jpg'
);

// サムネイル画像のパス
imageThumbArg = new Array(
			'images/topvisual/b_topnavi01.gif',
			'images/topvisual/b_topnavi02.gif',
			'images/topvisual/b_topnavi03.gif'
);

imageLinkArg = new Array(
			'solution/index.html?mv',
			'achiev/index.html?mv',
			'recruit/index.html?mv'
);

//画像の数
imageNum = imagePathArg.length;

/*--------------------------------------------------------------
動作プログラム
--------------------------------------------------------------*/
$(function(){
	//カレントナンバーを初期化
	currentImageNum	= 0;
	
	//visualを設置
	for( i=0; i<=(imageNum-1); i++ ){
		if( i==0 ){
			visualLi	= '<li style="display: block; background: url(' + imagePathArg[i] + ') no-repeat center transparent;"><em>#' + (i+1) + '</em></li>';
		}
		else{
			visualLi	= '<li style="display: none; background: url(' + imagePathArg[i] + ') no-repeat center transparent;"><em>#' + (i+1) + '</em></li>';
		}
		$('#bgArea').append(visualLi);
	}
	
	// thumbnailを設置
	for(i=1; i<=imageNum; i++){
		if( i == 1 ){
			tmpImage	= "images/topvisual/b_topnavi01_on.gif";
			$( '#bgThumb' ).append( '<li><a href="#"><img src="' + tmpImage + '" alt="' + i + '" /></a></li>' );
		}
		else{
			$( '#bgThumb' ).append( '<li><a href="#"><img src="' + imageThumbArg[i-1] + '" alt="' + i + '" /></a></li>' );
		}
	}
	
	autoPlay();

	// thumbnailをクリック
	$( 'ul#bgThumb li img' ).click( function() {
		// switcherを全てrollout画像に戻す
		$( '#bgThumb li img' ).each( function(){
			this.rolloutSrc	= $(this).attr('src');
			this.rolloutSrc	= this.rolloutSrc.replace( '_on', '' );
			$(this).attr( 'src' , this.rolloutSrc );
		});
		
		// rollover画像に変更
		this.originalSrc = $(this).attr('src');
		this.rolloverSrc = this.originalSrc.replace( /(\.gif|\.jpg|\.png)/, '_on$1' );
		$(this).attr( 'src' , this.rolloverSrc );
		
		if( (parseInt( $(this).attr('alt') )-1) != currentImageNum ){
		
			// クリックされた番号をカレントに代入
			currentImageNum = parseInt( $(this).attr('alt') )-1;
			//リンク先変更
			$('p#showDetail a').attr('href',imageLinkArg[currentImageNum]);
			
			// 画像の切り替えとフェードイン
			$( '#bgArea li' ).each( function() {
	//			fadeIndex	= $( '#bgArea li' ).index(this);
				if( $(this).css('display') != 'none' /*&& fadeIndex != currentImageNum*/ ){
					$(this).fadeOut(270);
				}
			});
			$( '#bgArea li' ).eq(currentImageNum).fadeIn(270);
		}
		// オートプレイ再スタート
		clearInterval( autoPlayVar );
		setTimeout( autoPlay() , intervalTime );
	});
});

/*--------------------------------------------------------------
オートプレイ
--------------------------------------------------------------*/
function autoPlay(){
	autoPlayVar	= setInterval(function (){
	
		//一周したら初期化
		if( currentImageNum >= imageNum-1 ){
			currentImageNum	= 0;
		}
		else {
			currentImageNum++;
		}

		//詳細を見るボタンのリンク先変更
		$('p#showDetail a').attr('href',imageLinkArg[currentImageNum]);
		
		// 画像の切り替えとフェードイン
		$( '#bgArea li' ).each( function() {
//			fadeIndex	= $( '#bgArea li' ).index(this);
			if($(this).css('display') != 'none'){
				$(this).fadeOut('slow');
			}
		});
		$( '#bgArea li' ).eq(currentImageNum).fadeIn('slow');
		
		// switcherを全てrollout画像に戻す
		$( '#bgThumb li img' ).each( function() {
			this.rolloutSrc	= $(this).attr('src');
			this.rolloutSrc	= this.rolloutSrc.replace( '_on' , '' );
			$(this).attr( 'src' , this.rolloutSrc );
			
			// カレントをrollover画像に変更
			if( currentImageNum+1 == $(this).attr('alt') ){
				this.originalSrc	= $(this).attr('src');
				this.rolloverSrc	= this.originalSrc.replace( /(\.gif|\.jpg|\.png)/ , '_on$1' );
				$(this).attr( 'src' , this.rolloverSrc );
			}
		});
		$('p#showDetail a').attr('href',imageLinkArg[currentImageNum]);
		
	},intervalTime);
};
function smnl_click(){
	alert('Wow!');
}
