$(function () {
  $(window).scroll(function () {
    let scrollPos = $(window).scrollTop()
    $('.anchorpoint').each(function (i) {
      let thisPos = $(this).offset().top - 300
      if (scrollPos >= thisPos) {
        setTimeout(function () {
          $('.anchorpoint').eq(i).removeClass('video-lazyload')
          if (i == 0) {
            $('.video_player').trigger('click')
          }
          if (i == 1) {
            $('.video_player2').trigger('click')
          }
        }, 1200)
      }
    })
  })

  const SCREEN_WIDTH = $(window).width()

  $(document).on('click', '.swiper-pagination02 span:nth-child(4)', function () {
    $('.video_player3').trigger('click')
  })
  setTimeout(function () {
    $('.ias-ads-kvtxt').removeClass('lazyload')
  }, 1230)

  setTimeout(function () {
    let sliderBullet = $('.ias-tpl-hm-section03-4 .swiper-pagination-bullet').eq(0).innerWidth()
    $('.ias-tpl-hm-section03-4 .ias-tpl-hm-tool .ias-tpl-pagination-bg').width(sliderBullet)
  }, 50)

  var mySwiper = new Swiper('.as-tpl-hm-banner4', {
    loop: false,
    pagination: {
      el: '.swiper-pagination4',
      clickable: true,
      renderBullet: function (index, className) {
        switch (index) {
          case 0:
            text = '代客洗车'
            break
          case 1:
            text = '预约充电'
            break
          case 2:
            text = '人工代充代洗'
            break
          case 3:
            text = '便捷缴费'
            break
        }
        return (
          '<span  data-tabhash="" data-tabactiontype="click tab"  data-tabmodule="生态升级" data-tabname=' +
          "'" +
          text +
          "'" +
          'class="' +
          className +
          ' ' +
          'ga-tab' +
          '"' +
          'onclick="' +
          "reportUem('乾崑智驾-生态升级-" +
          text +
          "')" +
          '"' +
          '>' +
          text +
          '</span>'
        )
      },
    },
    navigation: {
      nextEl: '.swiper-button-next4',
      prevEl: '.swiper-button-prev4',
    },
    slidesPerView: 1,
    speed: 500,
    loop: false,
    autoplay: false,
    spaceBetween: 4,
    keyboard: true,
    observer: true,
    observeParents: true,
    on: {
      transitionStart: function (mySwiper) {
        let sliderWidth = $('.ias-tpl-hm-section03-4 .swiper-pagination-bullet').eq(this.activeIndex).innerWidth()
        let sliderActiveWidth = $('.ias-tpl-hm-section03-4 .swiper-pagination-bullet').eq(this.activeIndex).position().left
        $('.ias-tpl-hm-section03-4 .ias-tpl-hm-tool .ias-tpl-pagination-bg').css({ 'left': sliderActiveWidth, 'width': sliderWidth })
        $('.as-tpl-hm-banner4').find('img').trigger('appear')
      },
    },
  })

  setTimeout(function () {
    let sliderBullet = $('.ias-tpl-hm-section03-01 .swiper-pagination-bullet').eq(0).innerWidth()
    $('.ias-tpl-hm-section03-01 .ias-tpl-hm-tool .ias-tpl-pagination-bg').width(sliderBullet)
  }, 50)

  var mySwiper = new Swiper('.as-tpl-hm-banner01', {
    loop: false,
    pagination: {
      el: '.swiper-pagination01',
      clickable: true,
      renderBullet: function (index, className) {
        switch (index) {
          case 0:
            text = '全时速'
            break
          case 1:
            text = '全方向'
            break
          case 2:
            text = '全目标'
            break
          case 3:
            text = '全天候'
            break
          case 4:
            text = '全场景'
            break
        }
        return (
          '<span  data-tabhash="" data-tabactiontype="click tab"  data-tabmodule="安全升级" data-tabname=' +
          "'" +
          text +
          "'" +
          'class="' +
          className +
          ' ' +
          'ga-tab' +
          '"' +
          'onclick="' +
          "reportUem('乾崑智驾-安全升级-" +
          text +
          "')" +
          '"' +
          '>' +
          text +
          '</span>'
        )
      },
    },
    navigation: {
      nextEl: '.swiper-button-next01',
      prevEl: '.swiper-button-prev01',
    },
    slidesPerView: 1,
    speed: 500,
    loop: false,
    autoplay: false,
    spaceBetween: 4,
    keyboard: true,
    observer: true,
    observeParents: true,

    on: {
      transitionStart: function (mySwiper) {

        let sliderWidth = $('.ias-tpl-hm-section03-01 .swiper-pagination-bullet').eq(this.activeIndex).innerWidth()
        let sliderActiveWidth = $('.ias-tpl-hm-section03-01 .swiper-pagination-bullet').eq(this.activeIndex).position().left
        $('.ias-tpl-hm-section03-01 .ias-tpl-hm-tool .ias-tpl-pagination-bg').css({ 'left': sliderActiveWidth, 'width': sliderWidth })
        $('.as-tpl-hm-banner01').find('img').trigger('appear')
      },
    },
  })

  setTimeout(function () {
    let sliderBullet = $('.ias-tpl-hm-section03-02 .swiper-pagination-bullet').eq(0).innerWidth()
    $('.ias-tpl-hm-section03-02 .ias-tpl-hm-tool .ias-tpl-pagination-bg').width(sliderBullet)
  }, 50)
  var mySwiper2 = new Swiper('.as-tpl-hm-banner02', {
    loop: false,
    pagination: {
      el: '.swiper-pagination02',
      clickable: true,
      renderBullet: function (index, className) {
        switch (index) {
          case 0:
            text = '路况险情预警'
            break
          case 1:
            text = '人驾急弯主动降速'
            break
          case 2:
            text = '座椅联动防护'
            break
          case 3:
            text = '驾驶员失能辅助 2.0'
        }
        return (
          '<span  data-tabhash="" data-tabactiontype="click tab"  data-tabmodule="安全升级" data-tabname=' +
          "'" +
          text +
          "'" +
          'class="' +
          className +
          ' ' +
          'ga-tab' +
          '"' +
          'onclick="' +
          "reportUem('乾崑智驾-安全升级-" +
          text +
          "')" +
          '"' +
          '>' +
          text +
          '</span>'
        )
      },
    },
    navigation: {
      nextEl: '.swiper-button-next02',
      prevEl: '.swiper-button-prev02',
    },
    slidesPerView: 1,
    loop: false,
    autoplay: false,
    spaceBetween: 4,
    keyboard: true,
    observer: true,
    observeParents: true,
    on: {
      transitionStart: function (mySwiper2) {
        let sliderWidth = $('.ias-tpl-hm-section03-02 .swiper-pagination-bullet').eq(this.activeIndex).innerWidth()
        let sliderActiveWidth = $('.ias-tpl-hm-section03-02 .swiper-pagination-bullet').eq(this.activeIndex).position().left
        $('.ias-tpl-hm-section03-02 .ias-tpl-hm-tool .ias-tpl-pagination-bg').css({ 'left': sliderActiveWidth, 'width': sliderWidth })
        $('.as-tpl-hm-banner02').find('img').trigger('appear')
      },
    },
  })

  setTimeout(function () {
    let sliderBullet = $('.ias-tpl-hm-section03-03 .swiper-pagination-bullet').eq(0).innerWidth()
    $('.ias-tpl-hm-section03-03 .ias-tpl-hm-tool .ias-tpl-pagination-bg').width(sliderBullet)
  }, 50)

  var mySwiper2 = new Swiper('.as-tpl-hm-banner03', {
    loop: false,
    pagination: {
      el: '.swiper-pagination03',
      clickable: true,
      renderBullet: function (index, className) {
        switch (index) {
          case 0:
            text = '随时随地可激活'
            break
          case 1:
            text = '城区通行更高效 T型路口更从容'
            break
          case 2:
            text = '脱困能力再提升'
            break
          case 3:
            text = '充电车位一键直达'
            break
        }
        return (
          '<span  data-tabhash="" data-tabactiontype="click tab"  data-tabmodule="体验升级" data-tabname=' +
          "'" +
          text +
          "'" +
          'class="' +
          className +
          ' ' +
          'ga-tab' +
          '"' +
          'onclick="' +
          "reportUem('乾崑智驾-体验升级-" +
          text +
          "')" +
          '"' +
          '>' +
          text +
          '</span>'
        )
      },
    },
    navigation: {
      nextEl: '.swiper-button-next03',
      prevEl: '.swiper-button-prev03',
    },
    slidesPerView: 1,
    loop: false,
    autoplay: false,
    spaceBetween: 4,
    keyboard: true,
    observer: true,
    observeParents: true,
    on: {
      transitionStart: function (mySwiper2) {

        let sliderWidth = $('.ias-tpl-hm-section03-03 .swiper-pagination-bullet').eq(this.activeIndex).innerWidth()
        let sliderActiveWidth = $('.ias-tpl-hm-section03-03 .swiper-pagination-bullet').eq(this.activeIndex).position().left
        $('.ias-tpl-hm-section03-03 .ias-tpl-hm-tool .ias-tpl-pagination-bg').css({ 'left': sliderActiveWidth, 'width': sliderWidth })
        $('.as-tpl-hm-banner03').find('img').trigger('appear')
      },
    },
  })

  setTimeout(function () {
    let sliderBullet = $('.ias-tpl-hm-section03-4 .swiper-pagination-bullet').eq(0).innerWidth()
    $('.ias-tpl-hm-section03-4 .ias-tpl-hm-tool .ias-tpl-pagination-bg').width(sliderBullet)
  }, 50)

  var mySwiper2 = new Swiper('.as-tpl-hm-banner04', {
    loop: false,
    pagination: {
      el: '.swiper-pagination04',
      clickable: true,
      renderBullet: function (index, className) {
        switch (index) {
          case 0:
            text = '离车泊入辅助'
            break
          case 1:
            text = '一键挪车'
            break
          case 2:
            text = '极窄车位'
            break
        }
        return (
          '<span  data-tabhash="" data-tabactiontype="click tab"  data-tabmodule="体验升级" data-tabname=' +
          "'" +
          text +
          "'" +
          'class="' +
          className +
          ' ' +
          'ga-tab' +
          '"' +
          'onclick="' +
          "reportUem('乾崑智驾-体验升级-" +
          text +
          "')" +
          '"' +
          '>' +
          text +
          '</span>'
        )
      },
    },
    navigation: {
      nextEl: '.swiper-button-next04',
      prevEl: '.swiper-button-prev04',
    },
    slidesPerView: 1,
    loop: false,
    autoplay: false,
    spaceBetween: 4,
    keyboard: true,
    observer: true,
    observeParents: true,
    on: {
      transitionStart: function (mySwiper2) {

        let sliderWidth = $('.ias-tpl-hm-section03-04 .swiper-pagination-bullet').eq(this.activeIndex).innerWidth()
        let sliderActiveWidth = $('.ias-tpl-hm-section03-04 .swiper-pagination-bullet').eq(this.activeIndex).position().left
        $('.ias-tpl-hm-section03-04 .ias-tpl-hm-tool .ias-tpl-pagination-bg').css({ 'left': sliderActiveWidth, 'width': sliderWidth })
        $('.as-tpl-hm-banner04').find('img').trigger('appear')
      },
    },
  })

  $('.ias-tpl-tip1').on('click', function () {
    let currentPosition = $(window).scrollTop()
    let top = $('.ias-tpl-hm-bm').offset().top - 60
    $('html, body').animate(
      {
        scrollTop: top,
      },
      1000
    )
    $('.ias-tpl-hm-bm p').removeClass('active')
    $('.ias-tpl-tip01').addClass('active')
    currentPositionTop = currentPosition
    return currentPositionTop
  })

  $('.ias-tpl-hm-bm').on('click', '.ias-tpl-tip01.active', function () {
    $('html, body').animate(
      {
        scrollTop: currentPositionTop,
      },
      1000
    )
    $('.ias-tpl-hm-bm p').removeClass('active')
  })

  // 智圆行方

  let aiFeature3TextIndex = 0
  $('.ads-bionics-3-prev-btn').on('click', function () {
    let _prevIndex = aiFeature3TextIndex
    aiFeature3TextIndex--
    if (aiFeature3TextIndex < 0) {
      aiFeature3TextIndex = 1
    }
    $('.ads-bionics-3-swiper-control-text-active-index').attr('data-index', aiFeature3TextIndex)

    $('.ads-bionics-3-swiper .ads-bionics-3-item').each(function () {
      let _index = $(this).attr('data-index')
      _index++
      if (_index >= $('.ads-bionics-3-swiper .ads-bionics-3-item').length) {
        _index = 0
      }
      $(this).attr('data-index', _index)
    })
  })

  $('.ads-bionics-3-next-btn').on('click', function () {

    let _prevIndex = aiFeature3TextIndex
    aiFeature3TextIndex++
    if (aiFeature3TextIndex > 1) {
      aiFeature3TextIndex = 0
    }

    $('.ads-bionics-3-swiper-control-text-active-index').attr('data-index', aiFeature3TextIndex)

    $('.ads-bionics-3-swiper .ads-bionics-3-item').each(function () {
      let _index = $(this).attr('data-index')
      _index--
      if (_index < 0) {
        _index = $('.ads-bionics-3-swiper .ads-bionics-3-item').length - 1
      }
      $(this).attr('data-index', _index)
    })
  })


  function isMobileWeChatBrowser() {
    const ua = navigator.userAgent.toLowerCase()
    const isWeChat = ua.indexOf('micromessenger') !== -1 // 微信浏览器检测‌:ml-citation{ref="2,7" data="citationList"}
    const isMobile = /android|iphone|ipad/i.test(ua) // 移动端检测‌:ml-citation{ref="7,8" data="citationList"}
    return isWeChat && isMobile
  }
  // 使用示例
  if (isMobileWeChatBrowser()) {
    $('.wechat-hide').hide()
    $('.wechat-show').show()
  } else {
    $('.wechat-hide').show()
    $('.wechat-show').hide()
  }

  const scrollButton1 = document.getElementById('ask1')
  const section1 = document.getElementById('answer1')
  scrollButton1.addEventListener('click', () => {
    section1.scrollIntoView({ block: 'center', behavior: 'smooth' })
    section1.classList.add('nhov')
    section2.classList.remove('nhov')
    section3.classList.remove('nhov')
    section4.classList.remove('nhov')
    section5.classList.remove('nhov')
  })
  const scrollButton2 = document.getElementById('ask2')
  const section2 = document.getElementById('answer2')
  scrollButton2.addEventListener('click', () => {
    section2.scrollIntoView({ block: 'center', behavior: 'smooth' })
    section2.classList.add('nhov')
    section1.classList.remove('nhov')
    section3.classList.remove('nhov')
    section4.classList.remove('nhov')
    section5.classList.remove('nhov')
  })

  // WebP支持检测（首次运行时缓存结果）
  function checkWebPSupport(callback) {
    if (typeof localStorage !== 'undefined' && localStorage.getItem('webpSupport') !== null) {
      return callback(localStorage.getItem('webpSupport') === 'true')
    }

    const img = new Image()
    img.onload = function () {
      const result = img.width > 0 && img.height > 0
      localStorage.setItem('webpSupport', result)
      callback(result)
    }
    img.onerror = function () {
      localStorage.setItem('webpSupport', false)
      callback(false)
    }

    img.src =
      'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mNkYAAAAAYAAjCB0C8AAAAASUVORK5CYII='
  }
  checkWebPSupport(function (isSupported) {
    $('img').each(function () {
      const $img = $(this)
      let webpSrc = $img.closest('picture').find('source[type="image/webp"]').data('srcset')
      const webpSrcMob = $img
        .closest('picture')
        .find('source[type="image/webp"][media*="max-width: 900px"]')
        .data('srcset')
      if ($(window).width() < 900) {
        if (webpSrcMob != undefined) {
          webpSrc = webpSrcMob
        }
      }
      const fallbackSrc = $img.data('src')

      // 动态设置真实图片路径
      $img.data('original', isSupported ? webpSrc : fallbackSrc)
    })

    $('img').lazyload({
      threshold: 200,
      effect: 'fadeIn',
      appear: function () {
        const realSrc = $(this).data('original')
        $(this).attr('src', realSrc)
        $(this).addClass('lazy-loaded')
      },
      load: function () {
        $(this).addClass('lazy-loaded')
      },
      error: function () {
        $(this).attr('src', 'img/error.jpg')
      },
    })
  })

  // 初始化懒加载
  $('img').lazyload({
    effect: 'fadeIn', // 淡入效果
    threshold: 100, // 提前300px加载
    failure_limit: 15, // 最大容错数量
    skip_invisible: true, // 加载隐藏图片
    appear: function () {
      // 加载前回调
      // $(this).css('background', 'transparent')
      // $(this).removeClass('lazyload')
      let _this = $(this)
      if (_this.data('original') != undefined) {
        _this.on('load', function () {
          // _this.css("background", "transparent");
          _this.removeClass('lazyload')
        })
      }
    },
    load: function () {
      // 加载完成回调
      $(this).addClass('lazy-loaded')
    },
  })



  // 二级导航
  let windowHeight = window.innerHeight
  let threeQuartersHeight = windowHeight * 0.55
  if ($(window) < 899) {
    threeQuartersHeight = windowHeight * 0.15
  }

  let prevScroll = 0
  $(window).scroll(function () {
    if ($(this).scrollTop() >= threeQuartersHeight) {
      $('#localnav').addClass('active')
    } else {
      $('#localnav').removeClass('active')
    }
    $('#localnav').removeClass('ln-expanded')
  })
  $('#localnav .ln-title ').click(function () {
    $('#localnav').toggleClass('ln-expanded')
  })
  $('.ln-menu-list .ln-menu-item').each(function (i) {
    let lab = $(this).find('a').attr('href')
    $(this).click(function () {
      let top;
      if (SCREEN_WIDTH > 900) {
        top = $(lab).offset().top - 100
      } else {
        top = $(lab).offset().top
      }

      $('body,html').animate(
        {
          scrollTop: top,
        },
        1000
      )

      $('#title').css('transform', 'scale(1, 1)')
      $('#title1').css('transform', 'scale(1, 1)')

      flag = false

      setTimeout(function () {
        flag = true
      }, 1100)
    })
  })

  $('.ias-ads-kvnav li').each(function (i) {
    let lab = $(this).attr('data-href')
    $(this).click(function () {
      if (SCREEN_WIDTH > 900) {
        let top = $(lab).offset().top - 100
      } else {
        let top = $(lab).offset().top
      }

      $('body,html').animate(
        {
          scrollTop: top,
        },
        1000
      )

      $('#title').css('transform', 'scale(1, 1)')
      $('#title1').css('transform', 'scale(1, 1)')

      $('#title0').css('transform', 'scale(1, 1)')
      $('#title01').css('transform', 'scale(1, 1)')

      $('#title03').css('transform', 'scale(1, 1)')
      $('#title003').css('transform', 'scale(1, 1)')

      $('#title04').css('transform', 'scale(1, 1)')
      $('#title004').css('transform', 'scale(1, 1)')

      flag = false

      setTimeout(function () {
        flag = true
      }, 1100)
    })
  })

})