$(document).ready(function () {
    //立即購買
    $('body').on('click','.index-buyButton',function(){
        var SID = $(this).attr('sid');
        if(SID){
            get_prod_item(SID);
        }
    });
    //立即購買_關閉
    $('.buypop-close').on('click',function(){
        $('.buypopbox').removeAttr('style');
    });
    //立即購買_規格下拉選單
    $(".buypop-selectbox").on('change',".color-select, .size-select",function(){
        var SID = $(this).val();
        if(SID){
            get_prod_item(SID);
        }
    });

    //立即購買_加入購物車按鈕
    $(".buypop-buttonbox").on("click",".buypop-button",function(){
        var _item = $(this).parents(".buypop-buttonbox"),
            SID   = $(this).attr('sid') || 0,
            num   = _item.find(".amountBox").val() || 0;
            if(SID == 0){
                alert(_jsLang.請選擇尺寸或規格);
                //errorbox();
            }else if(num ==0){
                alert(_jsLang.請選擇數量);
                //errorbox();
            }else{
                add_to_cart(SID,num);
            }
    });
    //立即購買_取得商品詳細資料
    function get_prod_item(SID){
        $.ajax({
            url:"/module/ajax/ajax_get_pop_prod_item-p.php",
            type:"POST",
            cache:false,
            async:false,
            dataType:"json",
            data:{SID:SID},
            error:function(d){
                alert('網路連線過慢，網頁請重新整理');
            },
            success:function(d){
                if(d.Size_Sel==''){
                    if(d.Stock>0){
                        add_to_cart(SID,1);
                    }else{
                        alert(_jsLang.商品庫存不足);
                    }
                }else{
                    $(".buypop-title").html(d.Name);
                    $('.buypop-word').html(d.Name_Sub);
                    $('.buypop-picbox').html(d.Pic_Path);
                    $('.buypop-price').html('NT$'+d.Price1);
                    $('.buypop-selectbox').html(d.Size_Sel);
                    if(d.Stock>0){
                        $('.text-smail').val(1);
                    }else{
                        $('.buypop-buttonbox').html(_jsLang.商品庫存不足);
                    }
                    $('.text-smail').attr('max',d.Stock);
                    $('.buypop-button').attr('sid',d.ID);
                    $('.buypopbox').css('display','flex');
                }
            }
        });
    }
    //立即購買_加入購物車
    function add_to_cart(SID,num){
        $.ajax({
            url:"/ajax/ajax_add_to_cart.php",
            type:"POST",
            cache:false,
            async:false,
            data:{SID:SID, num:num, webcacheno:$('#webcacheno').val()},
            dataType: 'json',
            error:function(d){
                alert('網路連線過慢，網頁請重新整理');
            },
            success:function(d){
                if(d.Stock && d.Stock != 'null'){
                    d.Stock = (d.Stock>20)?'20':d.Stock;
                    if(d.Stock>0){
                        $('.text-smail').val(1);
                    }else{
                        $('.text-smail').val(0);
                    }
                    $('.text-smail').attr('max',d.Stock);
                }

                if(d.Alert == 'OK'){
                    if(d.GA && typeof ga == 'function')
                    {
                        for(var key in d.GA)
                        {
                            ga('ec:addProduct',d.GA[key]);
                        }
                        ga('ec:setAction','add');
                        ga('send','event','購物車','加入購物車');
                    }
                    if(d.GA_conversion && typeof gtag == 'function')
                    {
                        //gtag('event', 'conversion', {'send_to':d.GA_conversion});
                    }
                    if(d.FBQ)
                    {
                        eval(d.FBQ);
                    }
if(typeof _lt == 'function'){
                                    _lt('send', 'cv', {
                                        type: 'AddToCart'
                                    }, ['9dd64258-88ed-42e2-a8fe-72c221866c9c']);
                                }
                    $.ajax({
                        url:"/ajax/ajax_get_cart.php",
                        type:"POST",
                        async:false,
                        cache:false,
                        data:{Type:'Prod',ID:SID,Act:'Add'},
                        error:function(d){
                            alert('網路連線過慢，網頁請重新整理');
                        },
                        success:function(d){
                            //$(".shopping-cartbox").css('display','none');
                            $("#Header_Shopcart").html(d);
                            $("#Header_Shopcart").parent(".shopping-cartbox").animate({'opacity':1,'maxHeight':'999px'}).css('z-index','100');
                            setTimeout(function(){
                                $("#Header_Shopcart").parent(".shopping-cartbox").animate({'maxHeight':'0px','opacity':0},function(){
                                    $(this).removeAttr('style');
                                    $(".shopping-cartbox").removeAttr('style');
                                });
                            },3000);
                        }
                    })
                }else{
                    alert(d.Alert);
                }
            }
        });
    }
    //立即購買_數量-
    $('.buypop-num').on('click','.fa-minus',function(){
        var now_num = $('.amountBox').val();
        now_num = parseInt(now_num);
        if(now_num>1){
            $('.amountBox').val(now_num-1);
        }
    });
    //立即購買_數量+
    $('.buypop-num').on('click','.fa-plus',function(){
        var now_num = $('.amountBox').val();
        var max_num = $('.amountBox').attr('max');
        now_num = parseInt(now_num);
        max_num = parseInt(max_num);
        if(now_num < max_num){
            $('.amountBox').val(now_num+1);
        }
    });
    //立即購買_輸入
    $('.amountBox').keyup(function(){
        var now_num = $('.amountBox').val();
        var max_num = $('.amountBox').attr('max');
        now_num = parseInt(now_num);
        max_num = parseInt(max_num);
        $('.amountBox').val(now_num);
        if(now_num>max_num){
            $('.amountBox').val(max_num);
        }
        if(now_num<1){
            $('.amountBox').val(1);
        }
        if(isNaN(now_num)){
            $('.amountBox').val(1);
        }
    });
    // 首頁主廣告
    if($("#slideshow .slide-item").length>=1){
        $("#slideshow").owlCarousel({
            loop : true,
            items : 1,
            nav : false,
            navText : ['',''],
            dots:true,
            autoplay:true,
            animateOut:'fadeOut',
            autoplayTimeout:9500,
        });
    }
    // 首頁主廣告
    if($(".slideshow-004").length!=0){
        var AID = $(".today-wrapper").find(".slide-item").eq(0).attr("AID");
        $("#Today_Title_Url").attr("href","/activities9/"+AID)

        $(".today-wrapper").owlCarousel({
            loop : false,
            responsive:{
                0:{
                    items : 2
                },
                660:{
                    items : 3
                },
                1024:{
                    items : 1
                }
            },
            nav : false,
            navText : ['',''],
            dots:true,
            autoplay:true,
            navSpeed:1000,
            autoplayTimeout:8000,
            autoplaySpeed:1000,
        });
        $(".today-wrapper").on('changed.owl.carousel',function(d){
            var AID = $(".today-wrapper").find(".slide-item").eq(d.item.index).attr("AID");
            $("#Today_Title_Url").attr("href","/activities9/"+AID)
        });
    }
    //  限時商品
    $('.todaySell-silde').owlCarousel({
        // loop : true,
        // items : 5,
        responsive:{
            0:{
                items : 1
            },
            480:{
                items : 2
            },
            960:{
                items : 3
            }
        },
        nav : true,
        navText : ['',''],
        dots:true,
    });

        //  限時商品
    $('.hairBaike-wrapper').owlCarousel({
        items : 1,
        nav : true,
        navText : ['',''],
        dots:true,
        animateOut:'fadeOut',
        // animateIn:'endAnimate'
    });

    // ==========================================================
    // 	三個小廣告 3 small Ad 廣告輪播
    // ==========================================================
		$(window).on("load resize",function(){
			let smallAd3 = $('#smallAd3')
			if(document.body.clientWidth < 481){
				smallAd3.owlCarousel({
					autoplay: true,
					dots: true,
					nav:false,
					items: 1,
					margin: 20
				})
			}else{
				smallAd3.trigger("destroy.owl.carousel")
			}
		})



    // ==========================================================
    // 	銷售排行 top sale 廣告輪播
    // ==========================================================
    let topSale = $('.topsale-list');
    topSale.owlCarousel({
        nav: true,
        slideBy:'page',
				dots: false,
        responsive: {
            0: {
                items: 2,
                margin: 15
            },
            660: {
                items: 3,
                margin: 20
            },
            1024: {
                items: 4,
                margin: 30
            },
        }
    });

    setTimeout(function(){
        topSale.fadeIn('slow',function(){
            $(this).css({'opacity':1});
        });
    },1000)


    // ==========================================================
    //  新品上市 new arrivals 廣告輪播
    // ==========================================================
    let newArrival = $('.new-products');
    newArrival.owlCarousel({
        nav: true,
        slideBy:'page',
				dots: false,
        responsive: {
            0: {
                items: 2,
                margin: 15
            },
            661: {
                items: 3,
                margin: 20
            },
            1025: {
                items: 4,
                margin: 30
            },
        }
    });



// ==========================================================
// 首頁影音列表輪播設定
// ==========================================================
    let videoList = $('.video-list');
    videoList.owlCarousel({
        margin: 20,
        nav: true,
        slideBy:'page',
        responsive: {
            0: {
                dots: true,
                items: 2,
            },
            481: {
                dots: true,
                items: 3,
            },
            769: {
                dots: true,
                items: 4,
            },
            1025: {
                dots: false,
                items: 5,
            },
        },
    });





// ==========================================================
//  影音列表跳窗功能
// ==========================================================
    const $wrap = $('.videoListWrap');
    // 判斷應該生成的 iframe 外框尺寸
    function videoShape(wrap, content) {
        const shapeContent = $(content);
        const shapeWrap = $(wrap);
        if((shapeWrap.width() * 9 / 16) > shapeWrap.height()) {
            shapeContent.css({
                height: shapeWrap.height(),
                width: shapeWrap.height() / 9 * 16
            })
        } else {
            shapeContent.css({
                height: shapeWrap.width() / 16 * 9,
                width: shapeWrap.width()
            })
        }
    }

    function videoClose() {
        $wrap.find('.videoWrapper').removeClass('in-open');
        $wrap.find('.videoBlock').empty();
        $('.videoCaption').remove();
        $('body').removeClass('videoBox-active');
    }

    // 點擊開啟跳窗
    $wrap.on('click', '.videoPopup', function(e) {
        const $videoTarget = $(this).parents('li').find('.videoTarget');

        // 插入指定 HTML 內容 (iframe)
        $wrap.find('.videoBlock').html($videoTarget.html());

        // video caption 展示
        if($(this).data('caption') || $(this).attr('title')) {
            const newEle = document.createElement('div');
            $(newEle).addClass('videoCaption');
            $('.videoWrapper').css('padding-bottom', '71px').append(newEle);
            $('.videoCaption').text($(this).data('caption'));
        }

        // 網頁捲軸鎖定
        $('body').addClass('videoBox-active');

        // 開啟跳窗
        $wrap.find('.videoWrapper').addClass('in-open');

        // 影片尺寸計算
        videoShape('.videoWrapper', '.videoContent');
    });

    // 按 X 關閉
    $wrap.on('click', '.videoCloser', function(e) {
        videoClose();
    });

    // 按外部黑底關閉
    $wrap.on('click', '.videoWrapper', function(e) {
        if(e.target === e.currentTarget) {
            videoClose();
        }
    })

    // 視窗尺寸改變時，重新計算 iframe 外框尺寸
    $(window).on('resize', function(e) {
        if($('.videoWrapper').hasClass('in-open')) {
            videoShape('.videoWrapper', '.videoContent');
        }
    })







    var _window = $(window);
    if(_window.width() <= 768){
        $('.video_listWrapper').owlCarousel({
            loop : true,
            // items : 5,
            responsive:{
                0:{
                    items : 3
                },
            },
            margin:5,
            merge:true,
            nav :false,
            navText : ['',''],
            dots:true,
        });
    }

    //  限時商品
    $('.video-silde').owlCarousel({
        // loop : true,
        // items : 5,
        responsive:{
            0:{
                items : 1
            },
            660:{
                items : 3
            }
        },
        nav : true,
        navText : ['',''],
    });
    //  IG
    $('.igpicbox-wrapper').owlCarousel({
        // loop : true,
        margin:10,
        responsive:{
            0:{
                stagePadding:50,
                items : 2
            },
            660:{
                stagePadding:60,
                items : 3
            },
            1024:{
                stagePadding:80,
                items : 4
            },
            1300:{
                stagePadding:100,
                items : 5
            }
        },
        loop:true,
        dots:false,
        nav : true,
        navText : ['',''],
    });

    setTimeout(function(){
        $('#slide_new').fadeIn('slow',function(){
            $(this).css({'opacity':1});
        });
    },1000)
    // 新品登場
    $('#slide_new').owlCarousel({
        loop : true,
        // items : 5,
        responsive:{
            0:{
                items : 2
            },
            660:{
                items : 2
            },
            1024:{
                items : 5
            }
        },
        nav : true,
        navText : ['','']
    });
    setTimeout(function(){
        $('#slide_new').fadeIn('slow',function(){
            $(this).css({'opacity':1});
        });
    },1000)
    // 今日限定
    let todaySale = $('.todaySale .wrapper')
    todaySale.owlCarousel({
        nav: true,
        slideBy:'page',
				dots: false,
        responsive: {
            0: {
                items: 2,
                margin: 15
            },
            661: {
                items: 3,
                margin: 20
            },
            1025: {
                items: 4,
                margin: 30
            },
        }
    });
    // 熱銷商品
    // $('.oneline-fiveitem-01 .wrapper').owlCarousel({
    //     loop : true,
    //     // items : 5,
    //     responsive:{
    //         0:{
    //             items : 2,
    //             nav :false,
    //             dots:true,
    //             margin:5,
    //         },
    //         660:{
    //             items : 3,
    //             nav :false,
    //             dots:true,
    //             margin:10,
    //         },
    //         1024:{
    //             items :4,
    //             nav :false,
    //             dots:true,
    //         },
    //         1300:{
    //             items :4,
    //             nav :true,
    //             dots:false,
    //         }
    //     },
    //     navText : ['','']
    // });
    // setTimeout(function(){
    //     $('.oneline-fiveitem-01 .wrapper,.todaySale .wrapper').fadeIn('slow',function(){
    //         $(this).css({'opacity':1});
    //     });
    // },1000)
    var _window = $(window);
         // 推薦商品
    var topicInit = {
        // items : 5,
        autoplay: true,
        autoplayTimeout: 3000,
        slideBy:'page',
        items : 1,
        navText : ['',''],
        dots: true,
        nav :false
    }
    if($('.tags-001 .topic-now .pic').length > 0){
      $('.tags-001 .topic-now .itembox').owlCarousel(topicInit)
    }

    //若只有一種則隱藏箭頭
    if($(".topic-class-box").length < 2){
      $(".tags-001 .arrow-box").hide()
    }

    $(window).on("load resize", function(){
      //功能參照arrowMiddle()
      let target = $(".tags-001")
      if(($(".topic-class-box").length > 1) && (document.body.clientWidth > 768)){
        //箭頭位置校正
        let arrowOffsetY = ($(".topic-img").height() - 30) / 2
        let arrowOffsetX = -1 * ($(".tags-001 .inner").offset().left / 2) - 15
        let arrowLimitOffsetX = arrowOffsetX > -74 ? arrowOffsetX : -74

        target.find('.arrow-box').css({
            top: arrowOffsetY
        });
        target.find('.left-arrow').css({
            "margin-left": arrowLimitOffsetX,
        });
        target.find('.right-arrow').css({
            "margin-right": arrowLimitOffsetX,
        });
      }else{
        //箭頭位置校正
        let arrowOffsetY = ($(".topic-img").height() - 30) / 2
        target.find('.arrow-box').css({
            top: arrowOffsetY
        });
        target.find('.left-arrow').css({
            "margin-left": 0,
        });
        target.find('.right-arrow').css({
            "margin-right": 0,
        });
      }
    })

    //推薦商品換標籤
    $("#topicLeftArrow").on("click", function(){
        if($(".topic-now").prev(".topic-class-box").length ===0){
            $(".topic-now").removeClass("topic-now")
            $(".topic-class-box").last().addClass("topic-now")
        }else{
            $(".topic-now").removeClass("topic-now").prev(".topic-class-box").addClass("topic-now")
        }
        $('.tags-001 .topic-now .itembox').owlCarousel(topicInit)
    })

    $("#topicRightArrow").on("click", function(){
        if($(".topic-now").next(".topic-class-box").length ===0){
            $(".topic-now").removeClass("topic-now")
            $(".topic-class-box").first().addClass("topic-now")
        }else{
            $(".topic-now").removeClass("topic-now").next(".topic-class-box").addClass("topic-now")
        }
        $('.tags-001 .topic-now .itembox').owlCarousel(topicInit)
    })



    // ==========================================================
    //  一個小廣告背景反向滑動
    // ==========================================================
    if($(".adbox1").length >= 1){
      $(document).on("scroll", function(){
        $(".adbox1").each(function(){
          let _this = $(this)
          let adTop = _this[0].getBoundingClientRect().top
          let screenHeight = window.screen.height
          let adBlockHeight = _this.outerHeight()
          let backgroundOffsetY = (1 - (adTop + (adBlockHeight/2))  / screenHeight) * 100
          if(backgroundOffsetY < 0){
            backgroundOffsetY = 0
          }else if(backgroundOffsetY > 100){
            backgroundOffsetY = 100
          }
          if((adTop > (adBlockHeight * -1)) && (adTop < screenHeight)){
            _this.css("background-position", "50% " + backgroundOffsetY + "%")
          }
        })
      })
    }

    //===========================================================
    // 影音購物點圖開始播放或無動作(沒上影片只有圖)
    //===========================================================
    $(".video-play").on("click", function(){
      let iframeSrc = $(this).data("iframe-src")
      if(iframeSrc){
        $(this).next(".videobox").find("iframe").prop("src", iframeSrc)
        $(this).hide()
        $(this).next(".videobox").show()
      }
    })

    // ==========================================================
    //  專題文章輪播
    // ==========================================================
    let columnList = $('.columnBaike-list');
    columnList.owlCarousel({
        nav: true,
        slideBy:'page',
        dots: false,
        responsive: {
            0: {
                items: 1,
                margin: 20
            },
            481: {
                items: 2,
                margin: 20
            },
            1025: {
                items: 3,
                margin: 30
            },
        },
    });
    //首頁專題
    $(".lookbook .picbox").owlCarousel({
        loop : true,
        items : 1,
        nav : true,
        navText : ['',''],
        autoplay:true,
        autoplayTimeout:5000,
    });

		//獨家販售(IG區塊)
    let container = $(".oneline-fiveitem-02 .wrapper")
    $(window).on("load resize", function(){
      container.owlCarousel({
        responsive: {
          0: {
            items: 2,
            margin: 15
          },
          661: {
            items: 3,
            margin: 20
          },
          1025: {
            items: 4,
            margin: 30
          },
        },
        nav: true,
        dots: false,
        slideBy:'page'
      })
    })

    //試用評價(名人穿搭)
    var reviewSlideShow = $('.review-001 .slide-show')
    reviewSlideShow.owlCarousel({
        nav: true,
        dots: false,
        slideBy:'page',
        responsive: {
            0: {
                items: 1,
                margin: 20
            },
            481: {
                items: 2,
                margin: 20
            },
            1025: {
                items: 3,
                margin: 30
            },
        }
    });


//  var owl =$('.picbox');
//  $('.picbox').owlCarousel();
    $('.picbox').on('translated.owl.carousel',function(event){
        var id = $(this).find('.active').eq(0).find('.pic-item').attr('did');
        ajax_topic_content(id);
    });
    function ajax_topic_content(topic_id){
        $.ajax({
            url:"/module/ajax/ajax_get_topic_content-p.php",
            type:"POST",
            cache:false,
            async:false,
            dataType:"json",
            data:{ID:topic_id},
            error:function(d){
                alert('網路連線過慢，網頁請重新整理');
            },
            success:function(d){
                $("#topic_content").html(d.Content);
            }
        });
  	}

    // ==========================================================
    //  啟動和螢幕寬度變更時箭頭位置校正
    // ==========================================================
    $(window).on('load' , function(e) {
      arrowMiddle(topSale);
      arrowMiddle(newArrival);
      arrowMiddle(columnList);
      arrowMiddle(reviewSlideShow);
      arrowMiddle(container);
      arrowMiddle(todaySale);
    })
    //直接window on resize會導致抓不到圖片高度
    topSale.on("resized.owl.carousel",function(){arrowMiddle(topSale)})
    newArrival.on("resized.owl.carousel",function(){arrowMiddle(newArrival)})
    columnList.on("resized.owl.carousel",function(){arrowMiddle(columnList)})
    reviewSlideShow.on("resized.owl.carousel",function(){arrowMiddle(reviewSlideShow)})
    container.on("resized.owl.carousel",function(){arrowMiddle(container)})
    todaySale.on("resized.owl.carousel",function(){arrowMiddle(todaySale)})



    // ==========================================================
    // 調整首頁 .owl-carousel .owl-nav
    // 箭頭相對於圖片垂直置中
    // 箭頭相對於輪播和螢幕邊界水平置中
    // ==========================================================
    function arrowMiddle(jqElement) {
      if(jqElement.find('img').length > 0){
        let target = jqElement;
        let targetPic = target.find('img');

        // 圖片高度
        // =============================
        let picHeight = targetPic.outerHeight();

        // 圖片相對於 .owl-carousel 的高度差
        let picOffsetY = targetPic.offset().top - target.offset().top;

        // 輪播離左右邊界偏移值(應當相同) 14為箭頭自身寬度偏移
        let picOffsetX = -1 * (target.offset().left / 2) - 16;
        //左右偏移最多74
        let picLimitOffsetX = (picOffsetX > -74) ? picOffsetX : -74;

        //  設定 .owl-nav top 的值
        // =============================

        let topValue = picOffsetY + picHeight / 2;

        target.find('.owl-nav').css({
            top: topValue,
            height: 0 //不設為0會阻礙滑動

        });
        target.find('.owl-prev').css({
            "margin-left": picLimitOffsetX,
        });
        target.find('.owl-next').css({
            "margin-right": picLimitOffsetX,

        });
      }
    }

    // ==========================================================
    //    最新消息開關
    // ==========================================================
    $('.list-001 .more').on('click', function(e) {
        $(this).parents('section').toggleClass('in-active');
    });

});