function throttle(func, wait = 300) {
  let previous = 0
  return function() {
    let now = date.now()
    if (now - previous > wait) {
      func.apply(this, arguments)
      previous = now
    }
  }
}

window.onload = () => {
  const header = document.queryselector('.header')
  const { offsetheight } = header
  window.addeventlistener('scroll', throttle(function () {
    const initialtopvalue = 50
    const scrolly = window.scrolly
    if (scrolly > offsetheight + initialtopvalue) {
      header.classlist.add('sticky')
    } else {
      header.classlist.remove('sticky')
    }
  }))

  new swiper('.banner-swiper', {
    autoplay: true,
    loop: true,
    pagination: {
      el: '.banner-swiper-pagination',
      clickable: true
    }
  })
  new swiper('.company-news-swiper', {
    effect: 'fade',
    speed: 500,
    autoplay: true,
    loop: true,
    pagination: {
      el: '.company-news-swiper-pagination',
      clickable: true
    }
  })
  new swiper('.special-column-swiper', {
    autoplay: true,
    loop: true,
    slidesperview: 3,
    spacebetween: 30,
    navigation: {
      nextel: '.swiper-button-next',
      prevel: '.swiper-button-prev'
    }
  })

  const tab = (function () {
    function _tab(domelement) {
      this.target = domelement
      this.getelement()
      this.bindevent()
    }
    _tab.prototype.getelement = function() {
      this.inkbar = this.target.queryselector('.tab-nav-ink-bar')
      this.navlis = this.target.queryselectorall('.tab-nav-item')
      this.contentlis = this.target.queryselectorall('.tab-content-item')
      const { width } = getcomputedstyle(this.navlis[0])
      this.leftvalue = width.split('px')[0]
      this.inkbar.style.width = width
      this.navlis[0].classlist.add('active')
      this.contentlis[0].classlist.add('active')
    }
    _tab.prototype.bindevent = function() {
      const selectedtab = this
      this.navlis.foreach(navli => {
        navli.addeventlistener('mouseenter', event => {
          let clickedli = event.currenttarget
          let index = array.prototype.indexof.call(selectedtab.navlis,clickedli)
          this.inkbar.style.left = `${this.leftvalue * index}px`
          selectedtab.show(index)
        })
      })
    }
    _tab.prototype.show = function(index) {
      this.navlis.foreach((navli) => {
        navli.classlist.remove('active')
      })
      this.navlis[index].classlist.add('active')
      this.contentlis.foreach(contentli => {
        contentli.classlist.remove('active')
      })
      this.contentlis[index].classlist.add('active')
    }
    return {
      init (domelement) {
        domelement.foreach(element =>{
          new _tab(element)
        })
      }
    }
  })()
  tab.init(document.queryselectorall('.tab'))

  const aboutuselement= document.queryselector('.about-us')
  const datavalueelements = document.queryselectorall('.about-us .data-value')
  const datavalues = [...datavalueelements].map(el => el.innertext)
  document.addeventlistener('scrollend', throttle(function() {
    const { top, height } = aboutuselement.getboundingclientrect( )
    if (top < 50 && math.abs(top) < height) {
      const { countup } = window.countup
      datavalueelements.foreach((el, index) => {
        const value = datavalues[index]
        const countup = new countup(el, value, {
          duration: 3
        })
        countup.start()
      })
    }
  }))
}