var timer;

// 下一页
$(".swiper-button-next").onclick = function () {
  animation(-520)
}

// 上一页
$(".swiper-button-prev").onclick = function () {
  animation(520)
}


// 计算移动距离，和越界处理
function animation(offset) {
  var oldOffset = parseInt($(".swiper-wrapper").style.transform.substring(11));
  var newOffset = oldOffset + offset;

  if (newOffset < -1040) {
    newOffset = 0
  };

  if (newOffset > 0) {
    newOffset =  -1040
  };

  DotChange(Math.abs(newOffset / 520))
  changeX(newOffset)

}


// 绑定小圆点的点击事件
var dot = $(".swiper-pagination .swiper-pagination-dot")
dot.forEach(function (v,i){
  v.onclick = function () {
    DotChange(i)
  }
})


// 切换小圆点
function DotChange(i) {
  dot.forEach(function (val,index){
    val.classList.remove("dot-active")
  })
  dot[i].classList.add("dot-active")
  changeX(i*-520)
}

// 让图片动起来
function changeX(x) {
  $(".swiper-wrapper").style = `
    transform: translateX(${x}px);
  `
}

// 鼠标悬浮，清除定时器
$(".swiper-container").onmousemove = function () {
  clearInterval(timer)
}

// 鼠标离开，自动播放
$(".swiper-container").onmouseout = function () {
  AutoPlay()
}

function AutoPlay() {
  // 定时器，自动播放
  timer = setInterval(function (){
    $(".swiper-button-next").onclick()
  }, 1000)
}

AutoPlay()


// 模仿框架jq实现 $ 功能
function $(className) {
  var classNameArr = className.split(" ");

  if (classNameArr.length == 1) {
    return document.querySelector(className)
  } else {
    // 多类名的时候，获取最后一个类名的上一个类名
    var fatherClassName = classNameArr[classNameArr.length-2];
    // 获取最后一个类名
    var lastClassName = classNameArr[classNameArr.length -1];

    var NewArr = []
    // 获取父级有多少个子元素
    var childrenList = document.querySelector(fatherClassName).children;
    // 返回你要的子元素
    for (let i = 0; i < childrenList.length; i++) {
      if (childrenList[i].className.indexOf(lastClassName.replace(".","")) != -1) {
        NewArr.push(childrenList[i])
      }
    }

    return NewArr.length == 1 ? NewArr[0] : NewArr
    // // 如果只有一个，返回html
    // if (NewArr.length == 1) {
    //   return NewArr[0]
    // // 多个直接返回数组
    // } else {
    //   return NewArr
    // }
  }

}