var body = $("body"),
    people = $(".people"),
    clientWidth = document.body.clientWidth,
    clientHeight = document.body.clientHeight,
    totalNums = 0;

body.onmousemove = function(e) {
    var x = e.x,
        moveX = x - 100;
    people.style.left = `${moveX < 0 ? 0 : moveX}px`;


    if (moveX > clientWidth / 2) {
        people.classList.remove("right")

    } else {
        people.classList.add("right")
    }
}

function CreatedResources(type) {
    var x = parseInt(Math.random() * clientWidth) - (type == 'apple' ? 40 : 60);
    x < 0 ? x = 0 : x;

    var apple = document.createElement("img");
    apple.src = type == "apple" ? "./img/apple.png" : "./img/boom.png";
    apple.className = type == "apple" ? "apple motion" : "boom motion";
    apple.style.left = `${x}px`;
    apple.style.top = `${type == 'apple'? -40 : -60}px`;
    body.appendChild(apple);
    motion(apple, type)
}

function motion(el, type) {
    var apple = 0,
        bmob = 0
    if (type == "apple") {
        apple = setInterval(() => {
            el.style.top = `${parseInt(el.style.top) + 30}px`;
            if (parseInt(el.style.top) > clientHeight) {
                body.removeChild(el)
                clearInterval(apple)
            } else {
                JudgingCollision(el, apple)
            }
        }, 60)

    } else {
        bmob = setInterval(() => {
            el.style.top = `${parseInt(el.style.top) + 50}px`;
            if (parseInt(el.style.top) > clientHeight) {
                setTimeout(() => {
                    try {
                        body.removeChild(el)
                        clearInterval(bmob)
                    } catch (e) {}

                }, 500)
            } else {
                JudgingCollision(el, bmob)
            }
        }, 80)

    }


}



function JudgingCollision(span, timeout) {
    var people = $(".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.classList.contains("apple")) {
            console.log("苹果");
            totalNums += 30;
            $(".appleaudio").play()
            $(".totalNums").innerText = `${totalNums}分`
            setTimeout(() => {
                body.removeChild(span)
                clearInterval(timeout)
            }, 540)
        } else {
            totalNums -= 40;
            span.src = "./img/bombimg.png"
            $(".boomaudio").play()
            $(".totalNums").innerText = `${totalNums}分`
            setTimeout(() => {
                body.removeChild(span)
                clearInterval(timeout)
            }, 540)
            console.log("炸弹")
        }
    }
}

function Created() {
    var random = parseInt(Math.random() * 100);
    if (random <= 80) {
        CreatedResources("bomb")
        console.log("生成炸弹")
    } else {
        CreatedResources("apple")
        console.log("生成苹果")
    }
}

setInterval(() => {
    Created();
}, 1000)


function $(className) {
    return document.querySelector(className)
}