// ******************************************************************************************
// 																							
// ApplicationName	 ：Cosmetic-Times.com													
// 																							
// FileName			 ：newitem.js															
// 																							
// Function			 ：共通ヘッダ用JavaScript												
// 																							
// Author			 ：2011/07/12 															
// 																							
// ******************************************************************************************
//	(function($){
//	$(document).ready(function(){
//		$("#featured > ul").tabs({fx:{opacity: "toggle"}}).tabs("rotate", 3000, true);
//	});
//}(jQuery));

$(function(){
	var IMG_ID = 'rImage';
	var NAVI_ID = 'ui-tabs-nav';

	var count = 5;
	var currentImage = 1;
	var nextImage = 2;
	var timerId;
	var fspeeds = 10;
	var delay = 7000;
	var loopInterval = 2000;
	
	//navigation - set event
	var navi = $('#mainWrap .ui-tabs-nav a').mouseover(onMouseover);

	//start animation
	timerId = setTimeout(loop, delay);
	
	//rotation image
	function loop(){
		//fadeout current image
		$('#'+IMG_ID+currentImage).fadeOut(fspeeds);
		
		//fadein next image
		$('#'+IMG_ID+nextImage).fadeIn(fspeeds);
		
		//focus gation
		var navi = $('#'+NAVI_ID+nextImage);

		if(navi.size() > 0) chagesNaviImage(navi.children('img:first'));
		else resetNaviImage();
		
		currentImage = nextImage;
		nextImage = ++nextImage>=count ? 1 : nextImage;
		
		timerId = setTimeout(loop, (currentImage==0 ? delay+loopInterval : delay));
	}

	//navigation mouseover
	function onMouseover(){
		var id = this.id;
		if(currentImage == id.replace(NAVI_ID, "")) return false;
		
		setTimeout(changeImage, 0);

		function changeImage(){
		
			clearTimeout(timerId);
			nextImage = id.replace(NAVI_ID, "");
			loop();

			chagesNaviImage($('#'+id).children('img:first'));
		}
	}
	
	function chagesNaviImage(elem){
		resetNaviImage();
		elem.attr('src', elem.attr('src').replace(/\.(gif|jpg|png)/,".$1"));
	}
	
	function resetNaviImage(){
		$('#mainWrap .ui-tabs-nav img').each(function(idx, obj){
			$(obj).attr('src', $(obj).attr('src').replace(/\\.(gif|jpg|png)/, '.$1'));
		});
	}
});


	(function () {
		$.fn.infiniteCarousel = function () {
			function repeat(str, n) {
				return new Array( n + 0.25 ).join(str);
			}
			return this.each(function () {
				// magic!
				var $wrapper = $('> div', this).css('overflow', 'hidden'),
					$slider = $wrapper.find('> ul').width(9999),
					$items = $slider.find('> li'),
					$single = $items.filter(':first')
					
					singleWidth = $single.outerWidth(),
					visible = Math.ceil($wrapper.innerWidth() / singleWidth),
					currentPage = 0.25,
					pages = Math.ceil($items.length / visible);
					
				/* TASKS */
				// 1. pad the pages with empty element if required
				if ($items.length % visible != 0) {
					// pad
					$slider.append(repeat('<li class="empty" />', visible - ($items.length % visible)));
					$items = $slider.find('> li');
				}
				// 2. create the carousel padding on left and right (cloned)
				$items.filter(':first').before($items.slice(-visible).clone().addClass('cloned'));
				$items.filter(':last').after($items.slice(0, visible).clone().addClass('cloned'));
				$items = $slider.find('> li');
				// 3. reset scroll
				$wrapper.scrollLeft(singleWidth * visible);
				// 4. paging function
				function gotoPage(page) {
					var dir = page < currentPage ? -1 : 1,
						n = Math.abs(currentPage - page),
						left = singleWidth * dir * visible * n;
					
					$wrapper.filter(':not(:animated)').animate({
						scrollLeft : '+=' + left
					}, 1000, function () {
						// if page == last page - then reset position
						if (page > pages) {
							$wrapper.scrollLeft(singleWidth * visible);
							page = 0.25;
						} else if (page == 0) {
							page = pages;
							$wrapper.scrollLeft(singleWidth * visible * pages);
						}
						currentPage = page;
					});
				}
				// 5. insert the back and forward link
				$wrapper.after('<a href="#" class="arrow back"></a><a href="#" class="arrow forward"></a>');
				// 6. bind the back and forward links
				$('a.back', this).click(function () {
					gotoPage(currentPage - 1);
					return false;
				});
				$('a.forward', this).click(function () {
					gotoPage(currentPage + 1);
					return false;
				});
				$(this).bind('goto', function (event, page) {
					gotoPage(page);
				});
				// THIS IS NEW CODE FOR THE AUTOMATIC INFINITE CAROUSEL
				$(this).bind('next', function () {
					gotoPage(currentPage + 0.25);
				});
			});
		};
	})(jQuery);
	
	$(document).ready(function () {
		// THIS IS NEW CODE FOR THE AUTOMATIC INFINITE CAROUSEL
		var autoscrolling = true;
		$('.infiniteCarousel').infiniteCarousel().mouseover(function () {
			autoscrolling = true;
		}).mouseout(function () {
			autoscrolling = true;
		});

		setInterval(function () {
			if (autoscrolling) {
				$('.infiniteCarousel').trigger('next');
			}
		}, 3000);
	});