var body = document.querySelector("body");
var people = document.querySelector(".people");
var bombAudio = document.querySelector(".bombAudio");
var appleAudio = document.querySelector(".appleAudio");
// 屏幕的宽度
var screenWidth = document.body.clientWidth;
var screenHeight = document.body.clientHeight;
var fraction = 0;
var gameProbability = 0.4;
var bmobSpeed = 80;
var appleOffset = 20;
function createdEle(type) {

  var Img = document.createElement("img");
  Img.src = type == 1 ? './img/apple.png' : './img/boom.png';
  Img.className = type == 1 ? 'apple' : 'boom';
   // 56  84
  // 元素的宽度
  var SpanWidth = type == 1 ? 40 : 60;
  var SpanLeft = Math.random() * (screenWidth - SpanWidth)
  if (SpanLeft <= SpanWidth) {
    SpanLeft = 0
  }

  Img.style = `
    position: absolute;
    left: ${SpanLeft}px;
    top: ${type == 1 ? -56 : -84}px;
  `;

  body.appendChild(Img);
  animation(type, Img)
}

function animation(type, span) {
  // 苹果🍎
  if (type == 1) {
    var appleInterval = setInterval(function (){
      span.style.top = `${parseInt(span.style.top) + appleOffset}px`;
      // 判断苹果是否超过苹果最大高度，如果超过，删除苹果并清除定时器
      if (parseInt(span.style.top) > screenHeight) {
        body.removeChild(span)
        clearInterval(appleInterval)
      } else {
        JudgingCollision(span, appleInterval)
      }
    },60)
  // 炸弹💣
  } else {
    var boomInterval = setInterval(function (){
      span.style.top = `${parseInt(span.style.top) + 20}px`;
      //判断炸弹是否超过苹果最大高度，如果超过，删除炸弹并清除定时器
      if (parseInt(span.style.top) > screenHeight) {
        body.removeChild(span)
        clearInterval(boomInterval)
      } else {
        JudgingCollision(span, boomInterval)
      }
    },bmobSpeed)
  }
}

/**
 * 判断是否碰撞
 * @constructor
 */
function JudgingCollision(span, timeout) {
  var people = document.querySelector(".people");
  var peopleX1 = parseInt(people.style.left);
  var peopleX2 = parseInt(people.style.left) + people.clientWidth;
  var peopleX3 = people.offsetTop;
  var peopleX4 = people.offsetTop + people.clientHeight;
  
  var spanX1 = parseInt(span.style.left);
  var spanX2 = parseInt(span.style.left) + span.clientWidth;
  var spanX3 = parseInt(span.style.top);
  var spanX4 = parseInt(span.style.top) +  span.clientHeight;

  // 碰撞检测
  if(peopleX4<spanX3 || peopleX1>spanX2 || peopleX3>spanX4 || peopleX2<spanX1){
    // 没碰上
  }else{
    if (span.className == "apple") {
      fraction += 10;

      // 如果分数超过100分，
      if (fraction >= 100) {
        // 降低苹果出现的概率，也就是提高炸弹数量
        gameProbability = 0.2;
        // 并且加快炸弹的速度
        bmobSpeed = 80;
        appleOffset = 40;
      }

      document.querySelector(".fraction").innerText = `${fraction}分`;
      appleAudio.play()
      body.removeChild(span)
      clearInterval(timeout)
    } else {
      fraction -= 20;
      document.querySelector(".fraction").innerText = `${fraction}分`;
      bombAudio.play();

      if (fraction <= 0) {
        clearInterval(timeout)
        confirm("游戏失败")
        location.reload()
      } else {
        span.src = "./img/bombimg.png"
        clearInterval(timeout)
        setTimeout(function (){
          body.removeChild(span)
        },100)
      }
    }
  }
}

function init () {
  var probability = Number(Math.random().toFixed(1))
  if (probability <= gameProbability) {
    createdEle(1)
  } else {
    createdEle(2)
  }
}

setInterval(function (){
  init();
},200)

body.onmousemove = function (e) {
  if (e.x <= 100) {
    people.style.left = `0px`;
  } else {
    people.style.left = `${e.x - 100}px`;
  }

  // 判断人物向右移动
  if (parseInt(people.style.left) > screenWidth / 2) {
    people.className = 'people'
  // 判断人物向左移动 添加类名 leftPeople，使用css3的水平镜像翻转人物
  } else {
    people.className = 'people leftPeople'
  }
}


// 接到一个苹果加10分
// 接到炸弹减20
// 默认0分
// 结束条件：分数 < 0


// 任务
// 分数 >100 的时候 炸弹速度加快（），炸弹的数量变多（概率）
//