class HoseBirds {
    innerWidth = window.innerWidth;
    innerHeight = window.innerHeight;
    //游戏状态
    gameStatus = false;
    //地板速度
    dibanMotionSpeed = 1;
    //向上
    Moveup = 50;
    //向下
    Movedown = 2;
    //鸟皮肤
    skinBirds = "instigateong";
    //管道中间间隙
    interval = 150;
    //管道的间隙
    space = 300;
    //管道的数量
    index = 0;
    //水管移动
    PipeSpeed = 10

    indx = 0;

    IntervalList = []
    constructor() {
        this.scroll();
        this.SkinResurfacing();
        this.Begin()
        // this.pipelineimg()
        this.Timeout()
        $(".diban").style = `top:${(parseInt(this.innerHeight) - 112)}px;
        width:${this.innerWidth}px;
        height: 112px;
        left:0px`
        console.log((parseInt( this.innerWidth)%10))
    }
    scroll() {
        $(".ong_img").style = `left:0px`;
        $(".two_img").style.left = `${this.innerWidth}px`;
        // console.log(this.innerWidth)
        setInterval(() => {
            // $(".ong_img").style.left = `px`;
            if (parseInt($(".ong_img").style.left) <= -this.innerWidth) {

                $(".ong_img").style.left = `${this.innerWidth}px`
            } else {
                $(".ong_img").style.left = `${parseInt($(".ong_img").style.left) - this.dibanMotionSpeed}px`
            }


            if (parseInt($(".two_img").style.left) <= -this.innerWidth) {
                $(".two_img").style.left = `${this.innerWidth}px`
            } else {
                $(".two_img").style.left = `${parseInt($(".two_img").style.left) - this.dibanMotionSpeed}px`
            }
        }, 1)
    }
    //换主题
    SkinResurfacing() {
        // console.log((this.innerHeight - 112) / 2 - 12)
        $(".bird").style.top = `${(this.innerHeight - 112) / 2 - 12}px`
        _(".bird_title .bird_list img").forEach((v, i) => {
            v.onclick = () => {
                switch (i) {
                    case 0:
                        this.skinBirds = "instigateong"
                        $(".bird").style.animationName = "instigateong,birdShake"
                        break;
                    case 1:
                        this.skinBirds = "instigatetwo"
                        $(".bird").style.animationName = "instigatetwo,birdShake"
                        break;
                    case 2:
                        this.skinBirds = "instigatethress"
                        $(".bird").style.animationName = "instigatethress,birdShake"
                        break;
                    default:
                        break;
                }
            }
        })
    }
    //开始
    Begin() {
        let clickTime;
        //点击开始

        $(".bird_title .start").onclick = (e) => {
            $(".out").show();
            $(".Integral").show();
            this.gameStatus = true
            $(".bird_title").none()
            $(".bird").style.animationName = this.skinBirds;
            //小鸟下降
            this.IntervalList[1] = setInterval(() => {
                // console.log("03b"+downclickTime)
                if (this.gameStatus == true) {
                    let downclickTime = new Date().getTime();
                    // console.log(parseInt(clickTime)-parseInt(downclickTime))
                    if (clickTime - downclickTime < -300) {
                        $(".bird").remove("up")
                        $(".bird").add("down")
                    }
                    let Birdsy = parseInt($(".bird").style.top) + this.Movedown;
                    $(".bird").style.top = `${Birdsy}px`
                }

            }, 15)
            //小鸟上升
            $("body").onclick = () => {
                if (this.gameStatus) {
                    clickTime = new Date().getTime();
                    // console.log("pp"+ clickTime)
                    //获取当前小鸟top值
                    let Birdsy = parseInt($(".bird").style.top);
                    $(".bird").style.top = `${Birdsy - this.Moveup}px`
                    $(".bird").add("up");
                    $(".bird").remove("down")
                }

            }
            //生成管道计时器
            this.IntervalList[0] = setInterval(() => {
                this.pipelineimg()
            }, 1000)
        }

    }

    pipelineimg() {

        //两个管道的高度
        let qq = parseInt(this.innerHeight - 112 - this.interval);
        //上管道的高度
        let Toptube = getRandom(60, qq - 60);
        let Downtube = qq - Toptube;

        // console.log(qq, Toptube, Downtube)

        //创建管道图片标签
        let create = (t) => {
            let img = document.createElement("img");
            img.src = `./img/sg_${t}.png`
            img.typ = t;
            img.className = "pipe"
            img.style = `
            top:${t == "t" ? 0 : Toptube + this.interval}px;
            left:${this.innerWidth + 55 + (this.space * this.index)}px;
            height:${t == "t" ? Toptube : Downtube}px;
            width: 55px;
            `
            return img
        }
        let img1 = create("b");
        let img2 = create("t");
        $("body").appendChild(img1)
        $("body").appendChild(img2)

        this.PipeMove([img1, img2])
        this.index += 1;

    }
    //暂停
    Timeout() {

        $(".out").onclick = (e) => {
            this.gameStatus = false;
            e?.stopPropagation();
            this.IntervalList.forEach((v) => {
                clearInterval(v)
            })
            _(".pipe").forEach((v) => {
                clearInterval(v.idd)
            })

            $(".bird_logo").show();
            $(".Goon").show();
            $(".tite").show();
        }

        $(".Goon").onclick = (e) => {
            this.gameStatus = true;
            e?.stopPropagation();
            $(".start").onclick()
            this.PipeMove(_(".pipe"))
            $(".Goon").none();
            $(".tite").none();
        }
        $(".Hungup").onclick = () => {
            location.reload()
        }

        $(".difficulty").onclick = () => {
            this.difficulty()
            $(".start").onclick()
        }

    }
    difficulty() {
       this.Moveup = 50;
        //向下
        this.Movedown = 4;
        //鸟皮肤
        this.skinBirds = "instigateong";
        //管道中间间隙
        this.interval = 100;
        //管道的间隙
        this.space = 250;
        //管道的数量
        this.index = 0;
        //水管移动
        this.PipeSpeed = 10
    }

    //水管移动方法
    PipeMove(a) {

        a.forEach(img => {
            //计时器 
            img.idd = setInterval(() => {
                if (this.gameStatus == true) {
                    img.style.left = `${parseInt(img.style.left) - this.PipeSpeed}px`
                    //达到条件删除水管
                    if (parseInt(img.style.left) <= -55) {
                        $("body").removeChild(img);
                        clearInterval(img.idd)
                    } else {
                        this.Collisiondetection($(".bird"), img)
                        this.Collisiondetection($(".diban"), $(".bird"));
                        // this.collision($(".diban"), $(".bird"))
                    }
                }
            }, 100)
        })

    }

    //碰撞检测
    Collisiondetection(one, two) {

        if (parseInt(one.style.left) < parseInt(two.style.left) + parseInt(two.style.width) &&
            parseInt(one.style.left) + parseInt(one.style.width) > parseInt(two.style.left) &&
            parseInt(one.style.top) < parseInt(two.style.top) + parseInt(two.style.height) &&
            parseInt(one.style.height) + parseInt(one.style.top) > parseInt(two.style.top)
        ) {
            this.conss()


        } else {
            if (two.typ == "t") {
                // console.log(this.innerWidth)
                if ((parseInt(two.style.left) + parseInt(two.offsetWidth)) == (100+(parseInt( this.innerWidth)%10))) {
                    this.indx += 1;
                    if (this.indx == 10) {
                        $("body").style = `background-image: url(./img/back_dark.png);`
                    }
                    let indx1 = this.indx.toString().split("");
                    $(".Integral").innerHTML = ""
                    indx1.forEach(v => {
                        $(".Integral").innerHTML += `<img src="./img/${v}.png">`
                    })
                }
            }

        }
    }
    conss() {
        $(".Hungup1").show();
        $(".Hungup").show();
        this.gameStatus = false;
        setTimeout(() => {
            $(".bird").remove("up");
            $(".bird").add("down");

            $(".bird").style.top = `${(parseInt(this.innerHeight) - 136)}px`
        }, 300)
    }
}
new HoseBirds();