(function($){

	$(window).load(function(){
		$.fn.uqocarousel();
	});

	$(function(){
		$.fn.uqocarousel=function(){
			var $sliderList=$('#slider_list');
			var $sliderCurrent=$('#slider_current');
			var $bgSwitch=$('#bg_switch');
			var singleWidth=$sliderList.find('li').eq(0).innerWidth();
			var counter=0;
			var intervalId;
			var totalWidth=0;
			var slideThumsFlg=true;
			
			var slideThumsFunc=slideThums;
			var backgroundAnimateFunc=backgroundAnimate;
			var sliderIntervalFunc=sliderInterval;
			//画像配列
			var bgFilePathList=[
									 'images/top_bg01.jpg',
									 'images/top_bg02.jpg',
									 'images/top_bg03.jpg',
									 'images/top_bg04.jpg',
									 'images/top_bg05.jpg',
									 'images/top_bg06.jpg',
									 'images/top_bg07.jpg',
									 'images/top_bg08.jpg'
								];
			
			//画像をキャッシュさせる
			preload(bgFilePathList);
			//キャッシュさせる関数
			function preload(arrayOfImages){
				for(var i=0;i<arrayOfImages.length;i++){
					$('<img/>')[0].src=arrayOfImages[i];
				}
			}
			
			
			//サムネイルを横に並べるために
			$sliderList.find('li').each(function(index){
				//すべてのpaddingも含めた横幅を合計するついでに
				totalWidth+=$(this).innerWidth();
				//要素ごとにclassを振ってあげる
				$(this).attr('class',index+1);
			});
			//合計したのをulのwidthに割り当てる
			$sliderList.width(totalWidth);
			
			
			//→矢印を押した時の処理
			$('#slider_next').click(function(){
				if(slideThumsFlg){
					counter++;
					slideThumsFunc();
				}
			});
			
			//←矢印を押した時の処理
			$('#slider_back').click(function(){
				if(slideThumsFlg){
					counter--;
					slideThumsFunc();
				}
			});
			
			//サムネイルの動きを管理
			function slideThums(){
				
				//連打防止
				if(slideThumsFlg){
					//クリック無効
					slideThumsFlg=!slideThumsFlg;
					//現在指している要素がmax-3だった場合
					if(counter>=$sliderList.find('li').size()-3){
						//一番最初の要素を最後尾に追加
						$sliderList.append($sliderList.find('li:eq('+(0)+')'))
						.css({'left':((counter-2)*singleWidth)*-1})
						.animate({'left':((counter-1)*singleWidth)*-1},800);
						counter--;
						
					//現在指している要素が最低値以下だった場合
					}else if(counter==-1){
						//一番最後の要素を最前列に追加
						$sliderList.prepend($sliderList.find('li:eq('+(8)+')'))
						.css({'left':-singleWidth})
						.animate({'left':0},800);
						counter++;
					}else{
						$sliderList.animate({'left':(counter%$sliderList.find('li').size()*singleWidth)*-1},800);
					}
					//現在指しているサムネイルを薄く
					$sliderList.find('li:eq('+counter+')').animate({'opacity':.4})
					.end()
					//それ以外は通常のアルファに
					.find('li:not(:eq('+counter+'))').animate({'opacity':1});
					//背景画像のリンクを変更
					$bgSwitch.find('a').attr('href',$sliderList.find('li:eq('+counter+')').find('a').attr('href'));
					//バックグラウンドのトランジションを実行する
					backgroundAnimateFunc($($sliderList.find('li').get(counter)).attr('class'));
				}
			}
			
			
			//バックグラウンドのトランジション
			function backgroundAnimate(index){
				
				//フェードアウトする
				$bgSwitch.animate({'opacity':0.05},400,function(){
					//透明が完了したらキャッシュされた画像に差し替えて
					$(this).css({'background-image':'url('+bgFilePathList[index-1]+')'})
					//フェードインする
					.animate({'opacity':1},400,function(){
						//クリック有効
						slideThumsFlg=!slideThumsFlg;

					});
				});
			}
			
			//マウスカーソルがメインスライダー内にある場合は、自動スライドを停止する
			$('#bg_switch a,#slider').hover(function(){
				//停止
				clearInterval(intervalId);
				
			},function(){
				//開始
				intervalId=setInterval(sliderIntervalFunc,4000);
				
			});
			
			//実行時に自動スライド有効
			intervalId=setInterval(sliderIntervalFunc,4000);
			
			//自動スライドは→クリックと同じ効果とする
			function sliderInterval(){
					
				if(slideThumsFlg){
					counter++;
					slideThums();
				}
			}
		};
	});
})(jQuery);