$(function(){

	var rotationTime = 10000;
	var defaultAnimationTime = 600;
	var animationTime = defaultAnimationTime;
	var animating = false;
	var numNews = 5;
	var newsIndex = 5;
	var newsData = [];
	var $wrapper = $("#ShopNewsList");
	var $ul = $wrapper.find("ul.overlayOthers");
	var timer;
	
	/*--------------------------------------------------
	* ロード
	--------------------------------------------------*/
	function load() {
		$.ajax({
			url:"/js/top/shopnews.js",
			dataType:"json",
			success:onLoad
		});
	}
	
	/*--------------------------------------------------
	* ロード完了時にJSONデータ処理＋HTML生成
	--------------------------------------------------*/
	function onLoad( data ) {
		var key;
		//マスタデータ
		for ( key in data ) {
			newsData.push(data[key]);
		}
		if ( newsData < numNews ) return;
		
		//
		$wrapper.append('<div id="ShopNewsPaging" class="clearfix"><a href="#" class="prev"><span>prev</span></a><a href="#" class="next"><span>next</span></a></div>');
		$wrapper.find("div#ShopNewsPaging a.prev").click(prev);
		$wrapper.find("div#ShopNewsPaging a.next").click(next);
		$ul.height(500);
		//
		newsIndex = $ul.find("li").length;
		resetTimer();
	}
	
	/*--------------------------------------------------
	* ローテーション
	--------------------------------------------------*/
	function stopTimer() {
		if ( timer ) clearInterval(timer);
	}
	
	function resetTimer() {
		stopTimer();
		timer = setInterval( onTimer, rotationTime );
	}
	
	function next() {
		if ( !animating ) {
			animationTime = defaultAnimationTime * 0.3;
			rotate();
			resetTimer();
		}
		return false;
	}
	
	function prev() {
		if ( !animating ) {
			animationTime = defaultAnimationTime * 0.5;
			newsIndex -= numNews * 2;
			if ( newsIndex < 0 ) newsIndex = newsData.length + newsIndex;
			rotate();
			resetTimer();
		}
		return false;
	}
	
	function onTimer() {
		animationTime = defaultAnimationTime;
		rotate();
	}
	
	function rotate() {
		var i;
		animating = true;
		$ul.fadeOut( animationTime, function(){
			var html = '';
			for ( i=0; i<numNews; i++ ) {
				if ( newsIndex >= newsData.length ) newsIndex = 0;
				html = html + '<li>';
				html = html + '<a title="'+newsData[newsIndex]["newsImageScroll"]+'" href="'+newsData[newsIndex]["shopLink"]+'" class="'+(newsData[newsIndex]["newsImageScroll"] ? 'trimmedScroll' : '' )+' clearfix">';
				html = html + '<img src="'+newsData[newsIndex]["newsImage"]+'" width="365" height="80" alt="" class="img" />';
				html = html + '<span class="spec"><span class="date">'+newsData[newsIndex]["newsEntyDate"]+'</span><span class="title">'+newsData[newsIndex]["newsTitle"]+'</span><span class="shopName">'+newsData[newsIndex]["shopName"]+'</span></span>';
				html = html + '</a></li>';
				newsIndex++;
			}
			
			$ul.empty().append(html).fadeIn(animationTime,function(){ animating = false; });
			$ul.overlayOthers().find(".trimmedScroll").trimmedScroll( { scrollImgAttribute:"title" });
			$ul.find("a").hover( stopTimer, resetTimer );
		});
	}
	
	/*--------------------------------------------------
	* メイン
	--------------------------------------------------*/
	load();
});