$(function(){
    var breadcrumb_on =0;
    $('#breadcrumb .inline-block').on('click',function(){
      if(breadcrumb_on==0){
        $(this).addClass('on');
        breadcrumb_on++;
      }else{
        $(this).removeClass('on');
        breadcrumb_on=0;
      }

    });
    $(".owl-carousel").owlCarousel({
        loop : true,
        items : 1,
        nav : true,
    });


  if($("#picSlides .picItem").length>1){
      $("#picSlides").owlCarousel({
          loop : true,
          items : 1,
          nav : true,
          autoplay:true,
          autoplayTimeout:5000,
      });
   }






// ==========================================================
//  行銷頁進階搜尋開關
// ==========================================================
  let clickbutton = 0;
  function clickCheck(step, targetSelector) {
    step %= 2

    if(step){
      $(targetSelector).addClass('in-active');
    } else {
      $(targetSelector).removeClass('in-active');
    }
  }

  $('.filter-button,.filterbox .close').on('click',function(e){
    clickbutton++
    clickCheck(clickbutton, '.main-aside')
  });

  $('.main-aside').on('click', function(e) {
    if(e.target === e.currentTarget) {
      clickbutton = 0
      clickCheck(clickbutton, '.main-aside')
    }
  })





    $('#viewMode .view-three').on('click',function(){
      $('#viewMode .view-three').addClass('now');
      $('#viewMode .view-four').removeClass('now');
      $('.content').removeClass('view-four').addClass('view-three hide-back');
      setTimeout(function(){
        $('.content').removeClass('hide-back');
      },380);
    });
    $('#viewMode .view-four').on('click',function(){
      $('#viewMode .view-four').addClass('now');
      $('#viewMode .view-three').removeClass('now');
      $('.content').removeClass('view-three').addClass('view-four hide-back');
      setTimeout(function(){
        $('.content').removeClass('hide-back');
      },380);
    });

    var owl6 = $(".user-list6 .orderSlide");
    owl6.owlCarousel({
      responsive:{
        0:{
          items : 2
        },
        480:{
          items : 3
        },
        660:{
          items : 4
        },
        960:{
          items : 5
        },
        1023:{
          items : 6
        }
      },
        nav : true,
        onRefresh : callback,
    });
    var owl5 = $(".user-list5 .orderSlide");
    owl5.owlCarousel({
      responsive:{
        0:{
          items : 2
        },
        481:{
          items : 3
        },
        960:{
          items : 4
        },
        1023:{
          items : 5
        }
      },
        nav : true,
        onRefresh : callback,
    });
    var addowl = $(".userBox .addBox");
    addowl.owlCarousel({
      responsive:{
        0:{
          items : 2
        },
        481:{
          items : 3
        },
        661:{
          items : 1
        }
      },
        nav : true,
        onRefresh : callback,
    });
    function callback(event){
      setTimeout(function(){
        $('.hidebox').animate({'opacity':1}).removeClass('hidebox');
      }, 300);
    }
    $('article > .Act_Content ').on('click','.button1',function(e)
    {
        if($(this).attr("class").indexOf('add_to_cart') !=-1 || $(this).attr("class").indexOf('addButton') !=-1)
        {
            return false;
        }

      var sid = $(this).attr('sid'),
      img = $(this).parents('.productBox'),
      img_src = img.find('img').attr('src'),
      img_title = img.find('.title').html(),
      img_price = img.find('.font-big').html(),
        img_amount= img.find('.amountBox').val(),
        add_array = new Array();

     add_array[0] = 0;
     if($(this).parents('.content').hasClass('box02')){
        var add_type  = 2
     }else{
        var add_type  = 1;
     }
     
        var html = '<div class="orderProduct "><img src="'+img_src+'""><div class="title">'+img_title+'<div class="pricebox"><span class="font-red">'+_jsLang.Language_Currency+img_price+' x '+img_amount+'件'+'</span></div><a class="delete" sid="'+sid+'" add_type="'+add_type+'">'+_jsLang.刪除+'</a></div></div>';
        if($(this).parents('.content').hasClass('box02')){
            if($('.addBox .pic-bg').length == 1){
                  addowl.trigger('remove.owl.carousel',$('.addBox .pic-bg').parents('.owl-item').index())
                      .trigger('refresh.owl.carousel');
            }

           var smailBox = $('.user-orderBox .addBox'),
                smailBox_top = smailBox.offset().top,
                smailBox_left = smailBox.offset().left,
                smailBox_width = smailBox.width()/6,
                smailBox_height = smailBox.height()-20;
            var same = false;
            $(".delete").each(function(){
              var o_sid = $(this).attr('sid');
              if(o_sid == sid){
                same = true;
                $(this).prev('.pricebox').find('.font-red').html(_jsLang.Language_Currency+img_price+' x '+img_amount+'件');
              }
            });
            if(same == false){
              var html = '<div class="orderProduct "><img src="'+img_src+'""><div class="title">'+img_title+'<div class="pricebox"><span class="font-red">'+_jsLang.Language_Currency+img_price+' x '+img_amount+'件'+'</span></div><a class="delete" sid="'+sid+'" add_type="'+add_type+'">'+_jsLang.刪除+'</a></div></div>';

              addowl.trigger('to.owl.carousel',[0,0,true])
              .trigger('add.owl.carousel',[$(html),0])
              .trigger('refresh.owl.carousel');
            }
            var choseImg =  $(this).parents('.productBox').find('.productImg'),
                Img_html = choseImg.clone().addClass('moveImg'),
                choseImg_top = choseImg.offset().top,
                choseImg_left = choseImg.offset().left,
                choseImg_width = choseImg.width(),
                choseImg_height = choseImg.height();
            $('body').append(Img_html);
            $('.moveImg').css({'top':choseImg_top,'left':choseImg_left,'width':choseImg_width,'height':choseImg_height})
              .animate({
                'top': smailBox_top,
                'left': smailBox_left,
                'width': smailBox_width,
                'height': smailBox_height
                },350, function() {
                  $(this).remove();
              });
        }else{
            if($('.user-list5 > .orderSlide .pic-bg').length == 1){
                  owl5.trigger('remove.owl.carousel',$('.user-list5 > .orderSlide .pic-bg').parents('.owl-item').index())
                      .trigger('refresh.owl.carousel');
            }
            var smailBox = $('.user-orderBox'),
                smailBox_top = smailBox.offset().top,
                smailBox_left = smailBox.offset().left,
                smailBox_width = smailBox.width()/6,
                smailBox_height = smailBox.height()-20;
            var same = false;
            $(".delete").each(function(){
              var o_sid = $(this).attr('sid');
              if(o_sid == sid){
                same = true;
                $(this).prev('.pricebox').find('.font-red').html(_jsLang.Language_Currency+img_price+' x '+img_amount+'件');
              }
            });
            if(same == false){
              var html = '<div class="orderProduct "><img src="'+img_src+'""><div class="title">'+img_title+'<div class="pricebox"><span class="font-red">'+_jsLang.Language_Currency+img_price+' x '+img_amount+'件'+'</span></div><a class="delete" sid="'+sid+'" add_type="'+add_type+'">'+_jsLang.刪除+'</a></div></div>';

              owl6.trigger('to.owl.carousel',[0,0,true])
              .trigger('add.owl.carousel',[$(html),0])
              .trigger('refresh.owl.carousel');
              owl5.trigger('to.owl.carousel',[0,0,true])
              .trigger('add.owl.carousel',[$(html),0])
              .trigger('refresh.owl.carousel');
            }
            var choseImg =  $(this).parents('.productBox').find('.productImg'),
                Img_html = choseImg.clone().addClass('moveImg'),
                choseImg_top = choseImg.offset().top,
                choseImg_left = choseImg.offset().left,
                choseImg_width = choseImg.width(),
                choseImg_height = choseImg.height();
            $('body').append(Img_html);
            $('.moveImg').css({'top':choseImg_top,'left':choseImg_left,'width':choseImg_width,'height':choseImg_height})
              .animate({
                'top': smailBox_top,
                'left': smailBox_left,
                'width': smailBox_width,
                'height': smailBox_height
                },350, function() {
                  $(this).remove();
              });
        }
        callback();
    });
    owl6.on('click','.delete',function(){
      var delitem = $(this).parents('.owl-item');
      delitem.find('.title').remove();
      delitem.animate({'opacity':0},300).animate({'width':0},300);
      setTimeout(function(){
        owl6.trigger('remove.owl.carousel',delitem.index())
            .trigger('refresh.owl.carousel');
      }, 700);
    });
    owl5.on('click','.delete',function(){
      var delitem = $(this).parents('.owl-item');
      delitem.find('.title').remove();
      delitem.animate({'opacity':0},300).animate({'width':0},300);
      setTimeout(function(){
        owl5.trigger('remove.owl.carousel',delitem.index())
            .trigger('refresh.owl.carousel');
          if(owl5.find('.owl-item').length==0){
              var html = '<div class="pic-bg"></div>';
            owl5.trigger('to.owl.carousel',[0,0,true])
              .trigger('add.owl.carousel',[$(html),0])
              .trigger('refresh.owl.carousel');
          }
      }, 700);
    });
    addowl.on('click','.delete',function(){
      var delitem = $(this).parents('.owl-item');
      delitem.find('.title').remove();
      delitem.animate({'opacity':0},300).animate({'width':0},300);
      setTimeout(function(){
        addowl.trigger('remove.owl.carousel',delitem.index())
            .trigger('refresh.owl.carousel');
          if(addowl.find('.owl-item').length==0){
              var html = '<div class="pic-bg"></div>';
            addowl.trigger('to.owl.carousel',[0,0,true])
              .trigger('add.owl.carousel',[$(html),0])
              .trigger('refresh.owl.carousel');
          }
      }, 700);
    });
});






// ==========================================================
//  手機版，點擊購物車圖示開啟該商品購物相關細節
// ==========================================================
(function($) {
  let deviceState = "desktop";
  const $window = $(window);

  $window.on('resize', function(e) {
    if($window.width() > 1024 && deviceState !== "desktop") {
      deviceState = "desktop"
      $('.productBox').removeClass('in-active')

      $('.toggle-detail').each(function(i, item) {
        const thisText = $(item).data('cart');
        $(item).text(thisText);
      })

      $('main').off('click', '.toggle-detail')
    } else if($window.width() <= 1024 && deviceState !== "mobile") {
      deviceState = "mobile"

      $('main').on('click', '.toggle-detail', function(e) {
        if($(this).parents('.productBox').hasClass('in-active')) {
          $('.productBox').removeClass('in-active')
          $('.toggle-detail').each(function(i, item) {
            const thisText = $(item).data('cart');
            $(item).text(thisText);
          })
          
        } else {
          $('.productBox').removeClass('in-active')
          $('.toggle-detail').each(function(i, item) {
            const thisText = $(item).data('cart');
            $(item).text(thisText);
          })

          $(this).parents('.productBox').addClass('in-active');
          $(this).text($(this).data('close'))
        }
      })
    }
  })

  $window.trigger('resize');
})($);