$(function(){

	//一枚を表示している時間（ミリ秒）
	var showingTime = 7000;
	//切り替えエフェクトに掛ける時間（ミリ秒）
	var easingTime = 2000;
	
	//スライドショー本体
	var $slideshow = $('#Slideshow');
	//スライド
	var $slideshowLists = $('#Slides').children();
	//スライドのタイトル表示部
	var $slideTitle = $('#SlideTitle');
	
	//自動再生フラグ
	var isAutoplay = true;
	//タイムアウトの実行ID
	var playId = 0;
	
	
	
	$slideshowLists
		//全てのスライドをまず非表示に
		.hide()
		//そのうち一番最初のものを選択
		.first()
		//現在表示しているスライドを示すcurrentクラスを付与
		.addClass('current')
		//表示
		.show();
	
	$slideTitle
		.text(
			$slideshowLists
				.filter('.current')
				.find('img')
				.attr('alt')
		);
	
	//写真を切り替える関数
	var slideChange = function(isBack)
	{
		//現在のスライドを取得
		var $current = $slideshowLists.filter('.current');
		/**
		 * 次のスライドを取得
		 * $current.next().lengthでリスト上に次のスライドがあるかどうか調べる。
		 * 1ならばあるので次のスライドは$current.next()になる。
		 * 0ならば次のスライドは先頭の物 ― $slideshowLists.filter(':first') ― になる。
		 */
		if(!isBack)
		{
			var $next = ($current.next().length == 1) ? $current.next() : $slideshowLists.first();
		}
		else
		{
			var $next = ($current.prev().length == 1) ? $current.prev() : $slideshowLists.last();
		}
		
		//現在のスライド
		$current
			//currentクラスを削除し
			.removeClass('current')
			//フェードアウト
			.fadeOut(easingTime);
			
		//次のスライド
		$next
			//currentクラスを付与し
			.addClass('current')
			//フェードイン
			.fadeIn(easingTime);
		
		$slideTitle.text($next.find('img').attr('alt'));
		
		//重複実行防止
		clearTimeout(playId);
		
		//自動再生設定
		if(isAutoplay)
		{
			//Timeoutをもう一度設定する
			playId = setTimeout(slideChange, showingTime);
		}
	}

	$('#Previous')
		.click(function(event){
			slideChange(true);
		});
	$('#Next')
		.click(function(event){
			slideChange();
		});
		
	$('#StopAndPlay')
		.click(function(event){
			var $this = $(this);
			if($this.is('.stop'))
			{
				clearTimeout(playId);
				isAutoplay = false;
			}
			else if($this.is('.play'))
			{
				isAutoplay = true;
				playId = setTimeout(slideChange, showingTime);
			}
			$this
				.toggleClass('stop play')
		});

	//Timeoutを設定・実行する
	playId = setTimeout(slideChange, showingTime);
})

