// JavaScript Document

// Manual Scroll
/* <.scrollFrame> is the Frame Div; <ul.scroll> is the body of Scroll items; <ul.scroll li> is the each Scroll item; <.btnLeft><.btnRight> are the controll buttons*/
function __scrollBox_left(){
var scrollWrapW = $('ul.scroll li').eq(0).outerWidth(true);
$('ul.scroll').animate({left:-scrollWrapW}, {duration:500,
					   complete:function(){$('ul.scroll').append($('ul.scroll li:first'));
											$('ul.scroll').css("left",0);}
											  });}
function __scrollBox_right(){
var scrollWrapW = $('ul.scroll li').eq(0).outerWidth(true);
$('ul.scroll').css("left",-scrollWrapW);
$('ul.scroll').prepend($('ul.scroll li:last'));
$('ul.scroll').animate({left:0},{duration:500});
return(false);
}

//toggle panel for the parent layer div
/*<#btnToggle> is the toggle butten*/
function __toggleByBtn(){
	$(this).parent().nextAll("._togglePanelByBtnToggle").toggle("slow");
	};

// hide item if checked
/*<#checkedClose> is the checkbox which controll the items <._hiddenPanelByChkBox>*/
function __closeByChkBox(){
	if ($(this).attr("checked"))
	{$("._hiddenPanelByChkBox").slideUp("slow");}
	else
	{$("._hiddenPanelByChkBox").slideDown("slow");};
	};

/* <.jImgFrame> is the Frame Div; <ul> is the body of Scroll items; <ul li> is the each Scroll item; <.btnPrev><.btnNext> are the controll buttons*/
function __scrollBox_prev(){
var scrollWrapW = $('.jImgFrame li').eq(0).outerWidth(true);
var frameW=$('.jImgFrame').outerWidth(true);
var scrollItemL=$('.jImgFrame li').length;
if (scrollItemL*scrollWrapW>frameW){
$('.jImgFrame ul').animate({left:-scrollWrapW}, {duration:500,
					   complete:function(){$('.jImgFrame ul').append($('.jImgFrame ul li:first'));
											$('.jImgFrame ul').css("left",0);}
											  });}
}

function __scrollBox_next(){
var scrollWrapW = $('.jImgFrame ul li').eq(0).outerWidth(true);
var frameW=$('.jImgFrame').outerWidth(true);
var scrollItemL=$('.jImgFrame li').length;
if (scrollItemL*scrollWrapW>frameW){
$('.jImgFrame ul').css("left",-scrollWrapW);
$('.jImgFrame ul').prepend($('.jImgFrame ul li:last'));
$('.jImgFrame ul').animate({left:0},{duration:500});}
}
/* click thumb photo to change main img*/
function __switchMainImg(){
 $(".widget .mainImg tr").remove();
 $(".widget .mainImg").html('<tr><td><a href="' + $(this).attr("src").replace("300x300","640x640") + '" class="hiddenImg"><img src="' + $(this).attr("src") + '" width="300" height="300" /></a></td></tr>'); }



 
$(document).ready(function(){
/* Manual Scroll left and right control */
$('.btnLeft').click(__scrollBox_left);
$('.btnRight').click(__scrollBox_right);
/* toggle btn */
$('#btnToggle').click(__toggleByBtn);
/* show if checkbox is not checked*/
if ($('#checkedClose').attr("checked")){$("._hiddenPanelByChkBox").hide();}
$('#checkedClose').click(__closeByChkBox);

/* Manual Scroll Product Thumb Photo Preivous and Next control */
$('.btnPrev').click(__scrollBox_prev);
$('.btnNext').click(__scrollBox_next);
/* Click thumb photo to change the main img*/
$('.widget .jImgFrame img').click(__switchMainImg);

$('actionBox .addFavoriteButton').click(function(){$('#popDiv1').show()});

$('._btnShowTextArea').click(function(){
									  $(this).siblings(':textarea ._txtAreaHidden').show()});

})