/**
 * @Description: 【太阳成集团tyc9728】
 * @Author: MaXueWei
 * @Date: 2024-1-25 09:24:53
 * @LastEditors: MaXueWei
 * @LastEditTime: 2024-1-25 09:24:53
 */
$(function () {
  // 初始化 AOS
  AOS && AOS.init({ duration: 1000 });
});

// ==================== swiper默认分页器 Start ====================
function pageInit(swiper, pagination, option) {
  this.swiper = swiper;
  this.pagination = pagination;
  this.option = option;
}
pageInit.prototype.init = function () {
  const that = this
  let timer = null
  let time = 5
  let temp_time = 0
  let stop = false
  let option = {
    speed: 1000,
    resistanceRatio: 0, // 抵抗率。
    // autoplay: {
    //     delay: 5000,
    //     disableOnInteraction: false,
    // },
    autoHeight: true,
    preventClicks: false, //默认true
    allowTouchMove: false,
    observer: true,
    observeParents: true,
    watchSlidesProgress: true,
    watchSlidesVisibility: true,
    loop: true,
    spaceBetween: 20,
    // navigation: {
    //     nextEl: ".index-section3-swiper .swiper-button-next",
    //     prevEl: ".index-section3-swiper .swiper-button-prev",
    // },
    on: {
      paginationUpdate: function () {
      },
      slideChange: function () {
      },
      slideChangeTransitionEnd: function () {
        $(that.pagination).find(".swiper-pagination .swiper-pagination-bullet:not(.swiper-pagination-bullet-active) i").css("width", "0");
        $(that.pagination + " .swiper-pagination .swiper-pagination-bullet:not(.swiper-pagination-bullet-active) i").css("width", "0");
      }
    },
    pagination: {
      el: that.pagination + " .swiper-pagination",
      clickable: true,
      // renderBullet: function (index, className) {
      //     return '<span class="' + className + '"><i></i></span>';
      // },
    },
  }
  if (that.option) {
    option = that.option
      ? { ...option, ...that.option }
      : option;
  }
  const swiper = new Swiper(that.swiper, option);
  function start() {
    // time = 5
    timer = setInterval(() => {
      --time
      //console.log(time);
      if (time === 0) {
        // console.log("切换");
        swiper.slideNext();
        time = 5
      }
    }, 1000)
  }
  $(that.pagination + " .play-btn").on("click", function () {
    stop = !stop
    $(this).toggleClass("active")
    $(that.pagination + " .swiper-pagination .swiper-pagination-bullet-active").toggleClass("paused")
    if (stop) {
      temp_time = time
      clearInterval(timer)
      // console.log("暂停", time);
    } else {
      time = temp_time
      // console.log("开始", time);
      start()
    }
  })
  $(that.pagination + " .swiper-pagination .swiper-pagination-bullet").on("click", function () {
    time = 5
    clearInterval(timer)
    start()
    $(that.pagination + " .play-btn").removeClass("active")
    stop = false
  })
  start();

  that.initPage();

  return swiper
}
pageInit.prototype.initPage = function () {
  const that = this
  let play = false
  let status = false
  const tl = gsap.timeline({
    scrollTrigger: {
      trigger: $(that.swiper).parent(),
      start: "top+=20% center",
      end: "bottom center",
      scrub: true,
      // markers: true,
      onEnter: function () {
        status = true
        // console.log("onEnter");
        !play && tl2.restart();

      },
      onLeaveBack: function () {
        status = false
        // console.log("onLeaveBack");
        !play && tl3.restart();
      },
    }
  })
  const tl2 = gsap.timeline({
    onStart: () => {
      play = true
      // console.log("出现动画开始执行", play.start);
    },
    onComplete: () => {
      play = false
      if (!status) { tl3.restart() }
      // console.log("出现动画执行结束", play.start);
    }
  })
  const tl3 = gsap.timeline({
    onStart: () => {
      play = true
      // console.log("结束动画开始执行", play.end);
    },
    onComplete: () => {
      play = false
      if (status) { tl2.restart() }
      // console.log("结束动画执行结束", play.end);
    }
  })
  let bullet_width = $(that.pagination).find(".pagination").width();
  let btnWidth = $(that.pagination + " .play-btn").width()
  tl2.set(that.pagination, { opacity: 1 })
  tl2.set(that.pagination + " .pagination", { width: btnWidth, xPercent: 58 })
  tl2.from(that.pagination + " .body", { scale: 0, yPercent: 300, duration: 0.35, ease: "back.out(2)" })
  tl2.from(that.pagination + " .play-btn-bg", { scale: 1.7, duration: 0.2, ease: "back.in" })
  tl2.to(that.pagination + " .play-btn-bg", { scale: 0, duration: 0.2, ease: "back.out" })
  // tl2.from(that.pagination + " .pagination", { width: btnWidth, xPercent: 58, duration: 0.4 })
  tl2.to(that.pagination + " .pagination", { width: bullet_width, xPercent: 0, duration: 0.4 })
  tl2.from(that.pagination + " .play-btn", { xPercent: -58, duration: 0.4 }, "<")
  tl2.to(that.pagination + " .pagination .swiper-pagination-bullet", { opacity: 1, duration: 0.4 })
  tl2.from(that.pagination + " .play-btn .iconfont", { opacity: 0, duration: 0.4 }, "<")
  tl2.reverse()
  // // 在时间轴的末尾添加一个标签
  // tl2.addLabel("endState");
  // // 将时间轴的进度直接跳转到标签处
  // tl2.seek("endState");

  tl3.to(that.pagination + " .play-btn .iconfont", { opacity: 0, duration: 0.3 })
  tl3.to(that.pagination + " .pagination .swiper-pagination-bullet", { opacity: 0, duration: 0.3 }, "<")
  tl3.to(that.pagination + " .pagination", { width: btnWidth, xPercent: 58, duration: 0.3 })
  tl3.to(that.pagination + " .play-btn", { xPercent: -58, duration: 0.3 }, "<")
  tl3.to(that.pagination + " .body", { scale: 0, duration: 0.25, ease: "back.in" })
  tl3.reverse()

  // function refresh() {
  //   status = true
  //   play = true
  //   // width = $(that.pagination).find(".pagination").width();
  //   // btnWidth = $(that.pagination + " .play-btn").width()
  //   console.log($(that.pagination).find('.swiper-pagination').css("padding"));
  //   console.log('aa',$(that.pagination).find('.swiper-pagination .swiper-pagination-bullet').width());
  //   tl2.restart();
  //   // console.log("刷新按钮width", width);
  //   // console.log("刷新按钮btnWidth", btnWidth);
  // }
  // // window.addEventListener("pageshow", function () {
  // //   refresh();
  // // });
  // window.addEventListener("resize", function () {
  //   refresh();
  // });
}
// ==================== swiper默认分页器 Start ====================
// ==================== 通用按钮1 Start ====================
function commonBtn(el, startEl) {
  this.el = el
  this.startEl = startEl
}
commonBtn.prototype.init = function () {
  const that = this
  let play = false
  let status = false
  const tl = gsap.timeline({
    scrollTrigger: {
      trigger: that.startEl || that.el,
      start: "top+=20% center",
      end: "bottom center",
      scrub: true,
      // markers: true,
      onEnter: function () {
        status = true
        // console.log("onEnter");
        !play && tl2.restart();

      },
      onLeaveBack: function () {
        status = false
        // console.log("onLeaveBack");
        !play && tl3.restart();
      },
    }
  })
  const tl2 = gsap.timeline({
    onStart: () => {
      play = true
      // console.log("出现动画开始执行", play.start);
    },
    onComplete: () => {
      play = false
      if (!status) { tl3.restart() }
      // console.log("出现动画执行结束", play.start);
    }
  })
  const tl3 = gsap.timeline({
    onStart: () => {
      play = true
      // console.log("结束动画开始执行", play.end);
    },
    onComplete: () => {
      play = false
      if (status) { tl2.restart() }
      // console.log("结束动画执行结束", play.end);
    }
  })
  let btnWidth = $(that.el + " .common-btn-box .btn-content").height()
  tl2.set(that.el + " .common-btn-box", { display: "block", })
  tl2.from(that.el + " .common-btn-box", { scale: 0, opacity: 0, yPercent: 300, duration: 0.35 })
  tl2.from(that.el + " .common-btn-box .btn-content", { scale: 0, duration: 0, ease: "back.in" }, "<")
  tl2.from(that.el + " .common-btn-box .play-btn-bg", { scale: 1.25, duration: 0.2, ease: "back.in" })
  tl2.to(that.el + " .common-btn-box .play-btn-bg", { scale: 0, duration: 0.2, ease: "back.out" })
  tl2.from(that.el + " .common-btn-box .icon", { scale: 0, duration: 0.4 }, "<")
  tl2.from(that.el + " .common-btn-box .text", { width: 0, padding: 0, duration: 0.4, ease: "back.out" })
  tl2.from(that.el + " .common-btn-box .btn-content", { padding: 0, width: btnWidth, duration: 0.4, ease: "back.out" }, "<")
  tl2.from(that.el + " .common-btn-box .text", { opacity: 0, duration: 0.4 }, "<0.1")
  tl2.reverse()

  tl3.to(that.el + " .common-btn-box .text", { opacity: 0, duration: 0.3 })
  tl3.to(that.el + " .common-btn-box .icon", { scale: 0, duration: 0.3 }, "<")
  tl3.to(that.el + " .common-btn-box .btn-content", { padding: 0, width: btnWidth, duration: 0.3 })
  tl3.to(that.el + " .common-btn-box .btn-content", { scale: 0, duration: 0.3 })
  tl3.reverse()
}
// ==================== 通用按钮1 End ====================
// ==================== 通用弹窗 Start ====================
/**
 * 通用弹窗
 * @param {*} btnEl 传入打开弹窗的按钮的id
 * @param {*} popupEl 传入弹窗的容器的id
 */
function commonPopup(btnEl, popupEl) {
  this.btnEl = btnEl
  this.popupEl = popupEl
}
commonPopup.prototype.init = function () {
  const that = this
  $(that.btnEl).on("click", function () {
    $(that.popupEl).show();
    setTimeout(() => {
      $(that.popupEl).animate({ scrollTop: 0 }, 10)
      $(that.popupEl).addClass("active")
      $('html').addClass("no-scroll")
    }, 10)
  })
  $(that.popupEl).find(".close").on("click", function () {
    $(that.popupEl).removeClass("active")
    $(that.popupEl).find("video").length && $(that.popupEl).find("video")[0].pause();
    setTimeout(() => {
      $(that.popupEl).hide();
      $('html').removeClass("no-scroll")
    }, 500)
  })
  // $(that.popupEl).on("click", function () {
  //   $(that.popupEl).removeClass("active")
  //   setTimeout(() => {
  //     $(that.popupEl).hide();
  //     $('html').removeClass("no-scroll")
  //   }, 500)
  // })
  // $(that.popupEl).find(".popup-box").on("click", function (e) {
  //   e.stopPropagation();
  // })
}
// ==================== 通用弹窗 End ====================
// ==================== 页面更新中敬请期待 Start ====================
$(".alter-btn").on("click", function () {
  alert("内容正在更新中，敬请期待！")
})
// ==================== 页面更新中敬请期待 End ====================
// ==================== 通用视频滚动 Start ====================
/**
 * 
 * @param {*} el 定住的容器
 * @param {*} video 控制的视频
 * @param {*} duration 持续时间
 * @param {*} option 单独配置（可选）
 */
function ScrollVideo(el, video, duration, option) {
  this.el = el
  this.video = document.querySelector(video)
  this.duration = duration
  this.option = option || undefined

}
ScrollVideo.prototype.init = function () {
  const _this = this

  if (_this.option) {
    const tl = gsap.timeline({
      scrollTrigger: _this.option
    })
    return tl
  } else {
    const duration = _this.duration ? _this.duration : 2000
    const tl = gsap.timeline({
      scrollTrigger: {
        trigger: _this.el,
        start: 'top top',
        end: '+=' + duration,
        scrub: true,
        // markers: true,
        pin: true,
        onLeave: function () {
          AOS.refresh();
          ScrollTrigger.refresh();
        },
        onLeaveBack: function () {
        },
        onUpdate: function (self) {
          try {
            _this.video.currentTime = self.progress * _this.video.duration;
          } catch (e) {
            console.log(_this.video.currentTime);
          }
        }
      }
    })
    const video = document.createElement('video');
    video.autoplay = true;
    video.loop = true;
    video.muted = true;
    video.playsinline = true;
    video.setAttribute('type', 'video/mp4');
    video.setAttribute('webkit-playsinline', true);
    video.setAttribute('x-webkit-airplay', true);
    video.setAttribute('x5-video-orientation', 'h5');
    video.setAttribute('x5-video-player-fullscreen', true);
    video.setAttribute('x5-video-player-type', 'h5');
    video.classList.add('video-hide');

    const source = document.createElement('source');
    source.setAttribute('src', _this.video.getAttribute('src'));

    video.appendChild(source);
    document.body.appendChild(video);


    return tl
  }
}
// ==================== 通用视频滚动 End ====================
// ==================== 通过机型判断自动跳转 Start ====================
function autoJump(url) {
  if (/Android|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent)) {
    // window.mobile = true;
    window.location.href = url;
    console.log("移动端");
  } else {
    console.log("电脑端");
    // window.location.href = url;
  }
}
// ==================== 通过机型判断自动跳转 End ====================