$(function() {
    //=============================
    // 詳細模式商品輪播 start
    //=============================
    if($("#productbox").length > 0){
      let carouselFlag = ''
      
      function productCarousel(){
        if(($(window).width() > 960) && (carouselFlag != 'pc')){
          carouselFlag = 'pc'
          $('.productImg').trigger("destroy.owl.carousel")
          $('.productImg > .picbox').wrap('<div class="zoonbox"></div>')
          $(".zoonbox").eq(0).addClass("now")
          smallPicBox();
          videoBox();
          window.dispatchEvent(new Event('resize'))
        }else if(($(window).width() <= 960) && (carouselFlag != 'mobile')){
          carouselFlag = 'mobile'
          $('.zoonbox > .picbox').unwrap()
          $('.productImg').owlCarousel({
                 loop : false,
                items : 1,
                nav : true,
            });
          $('.productImg').on('changed.owl.carousel',function(e){
            var num  = e.item.index;
            if(document.getElementById("Video")){
              if($(".productView").find(".owl-item").eq(num).find("#Video").attr("style")){
                $("#big_picture").hide();
                document.getElementById("Video").play();
              }else{

                $("#big_picture").show();
                document.getElementById("Video").pause();
              }
            }
          });
        }
      }
      
      productCarousel()
      $(window).on("resize", productCarousel)
      
    }
    
    //=============================
    // 詳細模式商品輪播 end
    //=============================
  
    $("#Main_Form").fromsAuth({
        type:'NONE',
        callafter:function(){
            if(typeof ga == 'function')
            {
                var obj = JSON.parse($("#GA_Data").text());
                for(var key in obj)
                {
                    ga('ec:addProduct',obj[key]);
                }
                ga('ec:setAction','checkout',{
                    'step':4
                });
                ga('send','event','購物車','確認訂單');
            }
            return true;
        }
    });
    $("#Member_Form").fromsAuth();

    var header_height = 100;
    if($(window).width() <= 480){
        header_height = 70;
    }
    $('.product-link').on('click',function(){
        if($('#productbox').length!=0){
            $("html,body").animate({scrollTop: $('#productbox').offset().top - header_height},800);
        }else{
            $("html,body").animate({scrollTop: $('#productlist').offset().top - header_height},800);
        }
    });
    $('.article-link').on('click',function(){
        $("html,body").animate({scrollTop: $('#articlebox').offset().top - header_height},800);
    });
    $('.shopcart-link').on('click',function(){
        $("html,body").animate({scrollTop: $('#s1').offset().top - header_height},800);
    });


    $("#Main_Content").on('click','#step2',function(){

         var pass = $(this).attr('Pass');
         var loginurl = $(this).attr('loginurl');
        if(pass==2){
            alert("您尚未登入會員，請先登入會員。");
            location.href = loginurl;
            return false;
        }
        var sh = $("#s2 .section-wrapper").height() + 100;
        $("html,body").animate({scrollTop: $('#s2').offset().top - sh}, 800);

        $('#s2').addClass("open",500);
        $('#s2').addClass("arrow",500);
        $('.moneyPrompt').css('display', 'flex').hide().fadeIn()
        updatePage('&Step=2&save=1&MoneyShow=1');

        if(typeof ga == 'function')
        {
            var obj = JSON.parse($("#GA_Data").text());
            for(var key in obj)
            {
                ga('ec:addProduct',obj[key]);
            }
            ga('ec:setAction','checkout',{
                'step':2
            });
            ga('send','event','購物車','我要結帳');
        }
    });
    $("#Main_Content").on('click', '#step3', function() {
        var sh2 = $("#s3").height();
         if($(window).width() <= 480){
            $("html,body").animate({scrollTop: $('#s3').offset().top - 70}, 800);
        } else {
            $("html,body").animate({scrollTop: $('#s3').offset().top}, 800);
        }
    });


    $("#Main_Content").on('click','#productlist .button-full',function(){
        if(!$(this).is('.button-cant')){
            var $class = $(this).attr("class"),
                type = '1';
            if($class == 'button-add')
            {
                type = '2';
            }
            $('.popupbg').attr("type",type);
        }
    });
    
    //購物彈窗
    $(document).on('click','.quickshop-popupbtn',function(){
      var sid = $(this).attr('SID'),
          wrapper = $(this).parent(".warpper")
      if($(this).hasClass("button-add")){
        $('.quickshop-wrapper').attr("type","2");
      }else{
        $('.quickshop-wrapper').attr("type","1");
      }
      var flag=1;
      $.ajax({
        url:"/quickshop/ajax/ajax_get_prod_quick.php",
        type:"POST",
        data:{type:1,SID:sid,prodlimit:wrapper.data("limit"),prodtype:wrapper.data("type")},
        dataType: 'json',
        async: false,
        error:function(d){
          alert('網路連線過慢，網頁請重新整理');
        },
        success:function(d){
          $('.quickshop-wrapper').html(d.data);
          $('.quickshop-wrapper').addClass("open")
          $("body").addClass("overflow-hidden")
          smallPicBox()
          videoBox()
          window.dispatchEvent(new Event('resize'))
        }
      })
    });
    //關閉快速購物彈窗
    $(document).on("click", ".quickshop-close", function(e){
      $(this).parents(".quickshop-wrapper").removeClass("open")
      $("body").removeClass("overflow-hidden")
    })
    $(".quickshop-wrapper").on("click", function(e){
      if($(e.target).hasClass("quickshop-wrapper")){
        $(this).removeClass("open")
        $("body").removeClass("overflow-hidden")
      }
    })
    
    $("#Main_Content").on('click','.informButton',function(){
        $("#informID").val($(this).attr("sid"));
        $('.emailPopup').css('display','flex');
    });
    $("#Main_Content").on('click','.emailPopup .close',function(){
        $('.emailPopup').css('display','none');
    });

    $("#Main_Content").on('click','#loginButton',function(){
        $('.memberPopup').css('display','flex');
    });
    $("#Main_Content").on('click','.memberPopup .close',function(){
        $('.memberPopup').css('display','none');
    });
    $("#Change_Pic").click(function(e){
        $("#Checkspan").load('/ajax/ajax_get_check_pic.php',{change:1});
    });
    /* 小圖hover效果及切換功能 */
    if($(".moreview .picitem ").length > 4){
        $(".productView .moreview").owlCarousel({
          loop:false,
          items : 4,
          margin: 12,
          nav : true,
          dots:false
        }).on('mouseleave','.owl-stage-outer', function() {
            var box = $(this).parents(".productBox");
            box.find(".productView .zoonbox").removeAttr('style');
        })
        .on('click','.owl-item', function() {
            var now = $(this).index(),
                box = $(this).parents(".productBox");
            box.find(".productView .owl-item").not(this).find('.picitem').removeClass('now');
            $(this).find('.picitem').addClass('now');
            box.find(".productView .zoonbox").removeClass('now').eq(now).addClass('now');
        })
        .on('mouseenter','.owl-item', function() {
            var now = $(this).index(),
                box = $(this).parents(".productBox");
            box.find(".productView .zoonbox").css('display','none').eq(now).css('display','flex');
        });
    }else{
        $(".productView .moreview")
        .on('mouseleave', function() {
            var box = $(this).parents(".productBox");
            box.find(".productView .zoonbox").removeAttr('style');
        })
        .on('click','.picitem', function() {
            var now = $(this).index(),
                box = $(this).parents(".productBox");

            box.find(".productView .picitem").removeClass('now');
            $(this).addClass('now');
            box.find(".productView .zoonbox").removeClass('now').eq(now).addClass('now');
        })
        .on('mouseenter','.picitem', function() {
            var now = $(this).index(),
                box = $(this).parents(".productBox");

            box.find(".productView .zoonbox").css('display','none').eq(now).css('display','block');
        });
    }

    $("#Main_Content").on('focusin','.input-text',function(){
        $(this).next('.text-title').addClass('now');
    });
    $("#Main_Content").on('focusout','.input-text',function(){
        if($(this).val()==''){
            $(this).next('.text-title').removeClass('now');
        }
    });

    $('.gotop').on('click',function(){
        $("html,body").animate({scrollTop: 0},800);
    });
    $('.header-wrapper').on('click', '.fa-bars', function(event) {
        $(this).removeClass('fa-bars').addClass('fa-times');
        $(this).next('.header-aside').addClass('open');
    });
    $('.header-wrapper').on('click', '.fa-times', function(event) {
        $(this).removeClass('fa-times').addClass('fa-bars');
        $(this).next('.header-aside').removeClass('open');
    });
    var _window = $(window);
    _window.on('scroll', function(event) {
        var scrollTop = _window.scrollTop();
        if(scrollTop>0){
            $(".gotop").css("opacity","1");
            $("body").addClass('is-sticky');
            // _body.css('padding-top',body_padding_s+'px');
        }else{
            $(".gotop").css("opacity","0");
            $("body").removeClass('is-sticky');
            // _body.css('padding-top',body_padding+'px');
        }
    });

    //時間倒數
    var num = parseInt($("#CountDown_Box").attr("second"),10),
        _this = $("#CountDown_Box");
    if(num > 0) {
        setInterval(function() {
            num--;
            if(num <= 0) {
                window.location.reload();
            }

            var day = Math.floor(num/(3600*24)),
                hour = Math.floor((num - (day*3600*24) )/3600),
                min = Math.floor((num - (day*3600*24) - (hour*3600) )/60 ),
                second = num - (day*3600*24) - (hour*3600) - (min*60),
                pad = '00';
            if(day > 0) {
                _this.find(".timer").eq(0).html(day);
                _this.find(".timer").eq(1).html(pad.substring(hour.toString().length)+hour);
                _this.find(".timer").eq(2).html(pad.substring(min.toString().length)+min);
                _this.find(".timer").eq(3).html(pad.substring(second.toString().length)+second);
            } else {
                _this.find(".Date_Box").remove();
                _this.find(".timerbox").html(_this.find(".timerbox").html().replace('天',''));

                _this.find(".timer").eq(0).html(pad.substring(hour.toString().length)+hour);
                _this.find(".timer").eq(1).html(pad.substring(min.toString().length)+min);
                _this.find(".timer").eq(2).html(pad.substring(second.toString().length)+second);
            }
        },1000);
    }


});

//刪除購物車
$("#Main_Content").on('click','.product-del',function() {
    $.ajax({
        url:"/quickshop/ajax/ajax_del_cart.php",
        type:"POST",
        cache:false,
        data:{ID:$(this).attr("sid"), Page_Shop_ID:$("#Page_Shop_ID").val()},
        dataType:'json',
        error:function(d){
            alert('網路連線過慢，網頁請重新整理');
        },
        success:function(d){
            if(d.Status == 'RET_SUCCESS')
            {
                if(d.GA && typeof ga == 'function')
                {
                    for(var key in d.GA)
                    {
                        ga('ec:addProduct',d.GA[key]);
                    }
                    ga('ec:setAction','remove');
                    ga('send','event','購物車','移除購物車');
                }
                //alert(_jsLang.刪除成功);
                updatePage();
            }
            else
            {
                alert(_jsLang.資料庫忙線中);
            }
        }
    });

    setTimeout(function () {
        $('.emptyCartPrompt').fadeOut()
    }, 5000)
});

//修改數量
$("#Main_Content").on('click','.Prod_Plus',function(){
    var Amount = parseInt($(this).prev(".Prod_Amount").val())+1,
        Stock = parseInt($(this).attr("max"));
    if(Amount > 100 || Amount > Stock)
    {
        return false;
    }
    $(this).prev(".Prod_Amount").val(Amount).change();
});
$("#Main_Content").on('click','.Prod_Minus',function(){
    var Amount = parseInt($(this).next(".Prod_Amount").val())-1;
    if(Amount < 1)
    {
        return false;
    }
    $(this).next(".Prod_Amount").val(Amount).change();
});

$("#Main_Content").on('change','.Prod_Amount',function(){
    var ID = $(this).parents(".listbox-item").find(".product-del").attr("sid"),
        Amount = $(this).val();

    if(Amount > 100)
    {
        Amount = 100;
    }
    if(Amount < 1)
    {
        Amount = 1;
    }

    $.ajax({
        url:"/quickshop/ajax/ajax_change_cart.php",
        type:"POST",
        cache:false,
        data:{ID:ID,Amount:Amount,Page_Shop_ID:$("#Page_Shop_ID").val()},
        error:function(d){
            alert('網路連線過慢，網頁請重新整理');
        },
        success:function(d){
            var d = d.trim();
            switch(d){
                case "RET_SUCCESS":
                    updatePage();
                    break;
                case "RET_NO_MEMBER_NO":
                    alert(_jsLang.欲購買紅利兌換商品請先登入會員並完成會員認證);
                    break;
                case "RET_RBONUS_OUT":
                    alert(_jsLang.紅利不足);
                    break;
                case "RET_ERROR":
                    alert(_jsLang.資料庫忙線中);
                    break;
                case "RET_PROD_ERROR":
                    alert(_jsLang商品已下架);
                    break;
                case "RET_NO_PROD":
                    alert(_jsLang.請選擇商品);
                    break;
                case "RET_STOCK_ERROR":
                    alert(_jsLang.商品庫存不足);
                    break;
                case "RET_LIMIT_ERROR":
                    alert(_jsLang.數量超過限購量);
                    break;
                default:
                    alert(_jsLang.資料庫忙線中);
                    break;
            };
        }
    });
});

//活動字串
$("#Main_Content").on('click','#Act_Str_Button',function(){
    var str = $("#Act_Str_Input").val();
    if(str)
    {
        updatePage('&Act_Str='+str);
    }
});
$("#Main_Content").on('click','#Act_Str_Cancel',function(){
    updatePage('&Act_Str=Cancel_Act_Str');
});

//切換配送國家
$("#Main_Content").on('change','#Send_Country',function(){
    updatePage('&Country='+$(this).val());
});

//切換配送方式
$("#Main_Content").on('click','input[name="Ship_Type"]',function(){
    updatePage('&Ship_Type='+$(this).val());
});

//門市取貨
$("#Main_Content").on("change","#Store_Pick",function(){
    updatePage('&CVSStoreID='+$(this).val());
});

//切換付款方式
$("#Main_Content").on('click','input[name="Pay_Type"]',function(){
    updatePage('&Pay_Type='+$(this).val());

    if(typeof ga == 'function')
    {
        var obj = JSON.parse($("#GA_Data").text());
        for(var key in obj)
        {
            ga('ec:addProduct',obj[key]);
        }
        ga('ec:setAction','checkout',{
            'step':3
        });
        ga('send','event','購物車','選擇付款方式');
    }
});

//切換配送城市
$("#Main_Content").on('change','#Send_City',function(){
    updatePage('&City='+$(this).val());
});

//切換配送地區
$("#Main_Content").on('change','#Send_Area',function(){
    updatePage('&Area='+$(this).val());
});

//選擇門市
$("#Main_Content").on("click","#Choose_Store", function(){
    var $return = encodeURIComponent('quickshop/quickshop.php?ID='+$("#Page_Shop_ID").val()+'&Pass_Str='+$("#Pass_Str").val()+'#s2'),
        $type = $(this).attr("type"),
        $coll = $(this).attr("coll");
    updatePage('&save=1');

    setTimeout(function(){
        window.location.href = '/shopcart/e_returns/emap-p.php?url='+$return+'&type='+$type+'&coll='+$coll+'&shop_id='+$("#Page_Shop_ID").val();
    },500);
});

//送出訂單
$("#Main_Content").on('click','#Form_Submit',function(){
    $("#Main_Form").submit();
});

//姓名、電話、Email、地址、備註
$("#Main_Content").on('change','#Send_Name,#Send_Cellphone,#Email,#Send_Address,#Send_Memo',function(){
    updatePage('&save=1');
});

//自動加入會員、收貨時間
$("#Main_Content").on('click',"#Auto_Add,input[name='Send_Time']",function(){
    updatePage('&save=1');
});

//切換載具類型
$("#Main_Content").on('change',"#CarrierType",function(){
    updatePage();
});
//切換發票類型
$("#Main_Content").on('click',"input[name='Invo_Mod']",function(){
    updatePage();
});

//同收件地址
$("#Main_Content").on('click','#Invo_Same_Button',function(){
    if($(this).prop("checked"))
    {
        var same = '1';
        $("#Invo_Address_Box").hide();
        $("#Invo_Address").attr("fun","");
    }
    else
    {
        var same = '2';
        $("#Invo_Address_Box").show();
        $("#Invo_Address").attr("fun","checkNull");
    }
    updatePage('&Invo_Same='+same+'&save=1');
    $("input[name='Invo_Same']").val(same);
});

$("#Main_Content").on('click','.title-big',function(){
    var num = $(this).parent('section').attr("num");
    if(num > '0')
    {
        $(this).parent('section').toggleClass("open",500);
    }
    else
    {
        $(".emptyCartPrompt").css("display","flex");
        setTimeout(function () {
            $('.emptyCartPrompt').fadeOut()
        }, 5000)
    }
});

$("#Main_Content").on('click','.shopcart-link',function(){
    $('section').addClass("open",500);
});

// $('body').on('click','.arrow .title-big', function(event) {
//     // console.log($('.is-nowStep'));
//     if(!$(this).is('.open')){
//         $('section').not(this).removeClass('open');
//         $(this).parent('section').addClass('open');
//         updatePage('&Step='+$(this).parent('section').attr("id").substr(1,1)+'&save=1');
//     }
// });


$("#Main_Content").on('click','#step3',function(){
    $('#s3').addClass("open",500);
    $('#s3').addClass("arrow",500);
    // $(this).parents('section').removeClass('open');
    updatePage('&Step=3&save=1');
});


function updatePage(data) { 
    //取得一般配送資料
    var send = '';
    var data = data || '';
    //寄送資料
    $("#Send_Name,#Send_Cellphone,#Email,#Send_Address,input[name='Send_Time']:checked,#Send_Memo,#Del_Type,#Auto_Add:checked").each(function(){
        send += '&'+$(this).attr("name")+'='+$(this).val();
    });
    //發票資料
    $("input[name='Invo_Mod']:checked,#CarrierType,#CarrierId1,#CarrierId2,#NPOBAN,#Invo_Title,#Invo_No,#Invo_Address").each(function(){
        send += '&'+$(this).attr("name")+'='+$(this).val();
    });
    var $data = 'type=update'+data+send+'&Page_Shop_ID='+$("#Page_Shop_ID").val();
    $.ajax({
        url:"/quickshop/ajax/ajax_get_cart.php",
        type:"POST",
        async: true,
        data:$data,
        cache:false,
        error:function(d,e,f){
            alert('網路連線過慢，網頁請重新整理');
        },
        success:function(d){
            if(d)
            {
                $("#Ajax_Box").html(d);
                //活動字串訊息
                if($("#Coupon_Msg").val()){
                    alert($("#Coupon_Msg").val());
                }
                $("#Main_Form").fromsAuth({
                    type:'NONE',
                    callafter:function(){
                        if(typeof ga == 'function')
                        {
                            var obj = JSON.parse($("#GA_Data").text());
                            for(var key in obj)
                            {
                                ga('ec:addProduct',obj[key]);
                            }
                            ga('ec:setAction','checkout',{
                                'step':4
                            });
                            ga('send','event','購物車','確認訂單');
                        }
                        return true;
                    }
                });
                //加購按鈕
                var add = parseInt($("#CanAdd").val());
                if(add > 0)
                {
                    $(".Add_Button").removeClass('button-cant').addClass('button-add quickshop-popupbtn');
                    $(".Add_Button").html('加購');
                }
                else
                {
                    $(".Add_Button").removeClass('button-add').addClass('button-cant');
                    $(".Add_Button").html('未符合加購');
                }
            }
        }
    })
}


function smallPicBox(){
	/* 小圖hover效果及切換功能 */
	if($(".moreview .picitem ").length > 0){
    $(".productView .moreview").owlCarousel({
 			loop:false,
			items : 4,
      margin: 15,
			nav : true,
      dots:false
		}).on('mouseleave','.owl-stage-outer', function() {
			$(".productView .zoonbox").removeAttr('style');
		})
		.on('click','.owl-item', function() {
			var now = $(this).index();
			$(".productView .owl-item").not(this).find('.picitem').removeClass('now');
			$(this).find('.picitem').addClass('now');
			$(".productView .zoonbox").removeClass('now').eq(now).addClass('now');
			})
		.on('mouseenter','.owl-item', function() {
			var now = $(this).index();
			//var nowbox = $('.productImg .now').index();
			//console.log(nowbox );
			$(".productView .zoonbox").css('display','none').eq(now).css('display','block');
			 	//$('.productImg .now').css('display','none');
		})
		.on('mouseleave','.owl-item', function() {
			var now = $(this).index();
			$(".productView .zoonbox").eq(now).css('display','none');
		});
	}else{
		$(".productView .moreview")
		.on('mouseleave', function() {
			$(".productView .zoonbox").removeAttr('style');
		})
		.on('click','.picitem', function() {
			var now = $(this).index();
			$(".productView .picitem").removeClass('now');
			$(this).addClass('now');
			$(".productView .zoonbox").removeClass('now').eq(now).addClass('now');
			})
		.on('mouseenter','.picitem', function() {
			var now = $(this).index();
			//var nowbox = $('.productImg .now').index();
			//console.log(nowbox );
			$(".productView .zoonbox").css('display','none').eq(now).css('display','block');
			 	//$('.productImg .now').css('display','none');
		})
		.on('mouseleave','.picitem', function() {
			var now = $(this).index();
			$(".productView .zoonbox").eq(now).css('display','none');
		});
	}

}

 /*影片效果*/
function videoBox(){
	//影片控制
	$(".moreview").on('click','.video_control',function(){
	  var video = document.getElementById("Video");
	  if(video.paused){
		  $(this).addClass('fa-pause').removeClass('fa-play');
		  video.play();
	  }else{
		  $(this).addClass('fa-play').removeClass('fa-pause');
		  video.pause();
	  }
	});

	//影片預覽圖
	if(document.getElementById("Video")){
		document.getElementById("Video").oncanplay=function(){
			var video = $("#Video").get(0);
			var canvas = document.getElementById("video_review");
				canvas.getContext('2d').drawImage(video, 0, 0, 300, 150);
		};
	}
}