/*====================================================================


 ■　productsImage.js


--------------------------------------------------------------------*/


/*====================================================================

 □　初期設定

--------------------------------------------------------------------*/


/*====================================================================

 □　処理リスト

--------------------------------------------------------------------*/

$(document).ready(function(){
		productsImage()
});


/*--------------------------------------------
	productsTab[製品詳細のタブ制御]
--------------------------------------------*/

function productsImage(){
	
	
	//初期設定
	$('.products-imggallery #image-tab .thumb-list li img').css('cursor','pointer');
	$('.products-imggallery #image-tab .thumb-list li:first img').css('borderColor','#f08200')
	$('.products-imggallery #image-tab .thumb-list li:first img').addClass('active')
	$('.products-imggallery #image-tab .thumb-list li:first img').css('cursor','default');
	//
	$('.products-imggallery .image-video li img').css('cursor','pointer');
	if($('.products-imggallery .image-video li img:eq(1)').attr('src').match("_none")){
		$('.products-imggallery .image-video li img').css('cursor','default')
	}
	//サムネイルが2段だったら
	/*
	if($('.thumb-list li').length>6){
		$('.products-imggallery #image-tab').css('height','450px')
		$('.products-imggallery #video-tab').css('height','450px')
	}
	*/
	
	//サムネイルのマウスアクション
	$('.products-imggallery #image-tab .thumb-list li img').hover(function(){
			if($(this).attr('class')!="active"){
				$(this).css('borderColor','#f08200')
			}
	},function(){
		if($(this).attr('class')!="active"){
			$(this).css('borderColor','#cccccc')
		}
	})
	$('.products-imggallery #image-tab .thumb-list li img').click(function(){
				var path=$(this).attr('style').substring($(this).attr('style').lastIndexOf('url(')+4,$(this).attr('style').lastIndexOf("/")+1)
				var pathSrc=$(this).attr('style').substring($(this).attr('style').lastIndexOf("/")+1,$(this).attr('style').indexOf(')'))
				if(path.indexOf('"')>-1){
					path=path.slice(1)
				}
				if(pathSrc.indexOf('"')>-1){
					pathSrc=pathSrc.substring(0,pathSrc.length-1)
				}
				var fileType=pathSrc.slice(pathSrc.lastIndexOf("."))
				var fileName=pathSrc.substring(0,(pathSrc.length-fileType.length)-2)
				var replaceSrc=path+fileName+"_M"+fileType
				var popSrc
				if($(this).attr('class')=="no-largeimg"){
					popSrc=path+fileName+"_M"+fileType
				}else{
					popSrc=path+fileName+"_L"+fileType
				}
				//フェードアウト
				$('.products-imggallery #image-tab .img-box img').fadeOut('fast',function(){
						//$(this).attr('src',replaceSrc)
						imgHeight = ($(this).height() >= 320)? $(this).height() : 320;
						$(this).attr({
									//width:$(this).width(),
									height:$(this).height(),
									src:'../img/spacer.gif'
									})
						$(this).parent().attr('href',popSrc)
						$(this).fadeIn('fast')
						$(this).attr('style','background:url('+replaceSrc + ') no-repeat 50% 50%;')
				})
				//
				$('.products-imggallery #image-tab .thumb-list li img').each(function(){
						$(this).removeClass('active')
						$(this).css('borderColor','#cccccc')
						$(this).css('cursor','pointer');
				})
				$(this).addClass('active')
				$(this).css('borderColor','#f08200')
				$(this).css('cursor','default');
	})
	//image-videoのタブ切り替え
	//Slider
	var totWidth=0;
	var positions = new Array();

	$('#slides .slide').each(function(i){
		/* Loop through all the slides and store their accumulative widths in totWidth */
		positions[i]= totWidth;
		totWidth += $(this).width();

		/* The positions array contains each slide's commulutative offset from the left part of the container */

		if(!$(this).width())
		{
			positions[1]= 548;
			positions[2]= 548;
			totWidth = 1096;
			//alert("Please, fill in width & height for all your images!");
			return false;
		}
	});

	$('#slides').width(totWidth);

	/* Change the cotnainer div's width to the exact width of all the slides combined */

	$('.products-imggallery .image-video li img').click(function(e){

		/* On a thumbnail click */
		//$('li.menuItem').removeClass('act').addClass('inact');
		//$(this).parent().addClass('act');

		var pos = $(this).parent().prevAll('.image-video li').length;
		$('#slides').stop().animate({marginLeft:-positions[pos]+'px'},450);
		/* Start the sliding animation */

		e.preventDefault();
		/* Prevent the default action of the link */
		var target=$(this).attr('alt')
				if(target=="images"){
					//$('#video-tab').css('visibility','hidden')
					var onSrc=$(this).attr('src').replace('image.','image_o.')
					$(this).attr('src',onSrc)
					var offSrc=$(this).parent().next().find('img').attr('src').replace('video_o.','video.')
					$(this).parent().next().find('img').attr('src',offSrc)
				}else{
					if(!$(this).attr('src').match("_none")){
						//$('#video-tab').css('visibility','visible')
						//
						var onSrc=$(this).attr('src').replace('video.','video_o.')
						$(this).attr('src',onSrc)
						var offSrc=$(this).parent().prev().find('img').attr('src').replace('image_o.','image.')
						$(this).parent().prev().find('img').attr('src',offSrc)
					}
				}
	});
	
	var thumbWidth=0;
	var thumbpositions = new Array();

	$('#thumb-slides .thumb-slide').each(function(i){
		/* Loop through all the slides and store their accumulative widths in totWidth */
		thumbpositions[i]= thumbWidth;
		thumbWidth += $(this).width();

		/* The positions array contains each slide's commulutative offset from the left part of the container */

		if(!$(this).width())
		{
			thumbWidth = 1338;
			thumbpositions[1]=446;
			thumbpositions[2]=446;
			//alert("Please, fill in width & height for all your images!");
			return false;
		}
	});

	$('#thumb-slides').width(thumbWidth);
	
	var pp=0
	$('.thumb-btn img').css('cursor','pointer')
	$('.prev-btn').css('visibility','hidden')
	/*
	if(thumbpositions.length==1){
		$('.next-btn').css('visibility','hidden')
	}
	*/
	
	//
	$('.thumb-btn img').click(function(e){
		var targetAlt=$(this).attr('alt')
		var thumbWidth = 0;
		thumbpositions = [];
		$('#thumb-slides .thumb-slide').each(function(i){
			thumbpositions[i]= thumbWidth;
			thumbWidth += $(this).width();
		});
		$('#thumb-slides').width(thumbWidth);
		
		if(targetAlt=="next"){
			pp++
			if(pp>=thumbpositions.length-1){
				$('.next-btn').css('visibility','hidden')
			}
			$('.prev-btn').css('visibility','visible')
		}else{
			pp--
			if(pp<=0){
				$('.prev-btn').css('visibility','hidden')
			}
			$('.next-btn').css('visibility','visible')
		}
		$('#thumb-slides').stop().animate({marginLeft:-thumbpositions[pp]+'px'},450);
		
		e.preventDefault();
	});

	//$('#menu ul li.menuItem:first').addClass('act').siblings().addClass('inact');
	/* On page load, mark the first thumbnail as active */

	//image-popup
	$('.img-box a').lightBox({
					imageLoading:'../script/lightbox/images/lightbox-ico-loading.gif',
					imageBtnClose:'../script/lightbox/images/lightbox-btn-close.gif',
					imageBtnPrev:'../script/lightbox/images/lightbox-btn-prev.gif',
					imageBtnNext:'../script/lightbox/images/lightbox-btn-next.gif'
	})
	//バリエーションpopup
	$('.variation-pop').lightBox({
					imageLoading:'../script/lightbox/images/lightbox-ico-loading.gif',
					imageBtnClose:'../script/lightbox/images/lightbox-btn-close.gif',
					imageBtnPrev:'../script/lightbox/images/lightbox-btn-prev.gif',
					imageBtnNext:'../script/lightbox/images/lightbox-btn-next.gif'
	})
	//イメージpopup
	$('.image-pop').lightBox({
					imageLoading:'../script/lightbox/images/lightbox-ico-loading.gif',
					imageBtnClose:'../script/lightbox/images/lightbox-btn-close.gif',
					imageBtnPrev:'../script/lightbox/images/lightbox-btn-prev.gif',
					imageBtnNext:'../script/lightbox/images/lightbox-btn-next.gif'
	})
	//詳細popup
	$('.detail-pop').lightBox({
					imageLoading:'../script/lightbox/images/lightbox-ico-loading.gif',
					imageBtnClose:'../script/lightbox/images/lightbox-btn-close.gif',
					imageBtnPrev:'../script/lightbox/images/lightbox-btn-prev.gif',
					imageBtnNext:'../script/lightbox/images/lightbox-btn-next.gif'
	})
}