CocosCreator classic entry project flappybird

cc.Class({
    extends: cc.Component,

    properties:
        skyNode: cc.Node, //define sky node pipeNode: cc.Node, //define pipe node birdNode: cc.Node, //define bird node clickLayerNode: cc.Node, //define listener node to listen to mouse click events scoreNode: cc.Node, //define score node total score node buttonNode: cc.Node, //define button node to start the game button numberNode: cc.Node, //define number node to add points combo
        overNode: cc.Node, //Define the game end node end button spriteFrame: { //Define the sprite frame node,
            default: [], //Array type, will bind three picture sprites bird0, bird1, and bird2, and form animation by constantly changing them in the update() method type: cc.SpriteFrame //Picture sprite type},
        clip: {//Define the sound effect node default: [], //Also an array type, which is convenient for binding multiple resources. For subsequent learning, you can try to use dynamic loading type: cc.AudioClip //audio type}
    },
    onClickButton() {//Set the click button method this.num = 0;//Reset num to 0
        this.sign = true;//Set the identifier that controls whether the game continues to be true this.buttonNode.active = false;//Make the button node invisible this.overNode.active = false;//Make the overNode node that controls the "Game Over" text invisible this.birdNode.y = 50;//After clicking the button, the bird's position returns to its original position this.power = 0;//Change the power factor to 0 to prevent the bird from falling too fast after resurrection this.scoreNode.getComponent(cc.Label).string = "" + this.num;//Change the string value of the score node to 0, this.scoreNode.getComponent(cc.Label).string
        let list = this.pipeNode.children; //Use a list to store the child nodes of the metal pipe (.children)
        for (let i = 0; i < list.length; i++) { //Set up a loop, the termination condition is that i is less than the length of list let child = list[i]; //let a child variable is used to store each list[i] in the loop
            child.x += 1000; //Shift the x of the pipeline node right by 1000
        }
        cc.audioEngine.playMusic(this.clip[0], true);
    },
    onClickBagButton(event, data) { //Define backpack button method// cc.log(event, data);
        if (data == "bag") {//Judge whether the passed parameter is equal to the CustomEventData of an event
            this.showBag(); //Call the function to display the backpack}
    },
    showBag() { //Define the function to display the backpack if (this.bagPrefab == null) { //If the resource loading is not successful setTimeout(() => { //Set a delay of 0.5s before continuing to call the display bag method this.showBag();
            }, 500);
            return;
        }
        //Resource loading completed let node = null; //Define a node and assign it to null if (this.isOpen) { //Judge whether the backpack is open, the initial value of this.isOpen is false
            node = cc.find("Canvas/panelBag");
            node.active = true;
        }
        else{
            node = cc.instantiate(this.bagPrefab); //Load specific preset resources and assign them to node
            cc.find("Canvas").addChild(node); //Add the node to the Canvas screen}
        node.opacity = 0; //Set the transparency of the node to 0;
        node.scale = 0.1; //Set the initial scale of node to 0.1;
        let ac = cc.spawn( //Encapsulate parallel animation and assign it to ac
            cc.fadeIn(0.5), // fade in at a speed of 0.5s cc.scaleTo(0.5,1), // scale to 1 at a speed of 0.5s
        );
        node.runAction(ac); //Use the runAction function to execute the encapsulated ac
        this.isOpen = true; //Assign the backpack opening parameter to true
    },
    gameOver() { //Set the game end method this.sign = false; //Game over, change the game continuation identifier to false
        this.checkStill = false; //Check whether the game is in progress and the parameter becomes false
        this.buttonNode.active = true; //Game over, make the start button this.buttonNode visible this.overNode.active = true; //Game over, make the overNode node of the "Game Over" text visible cc.audioEngine.stopMusic(this.clip[0]); //Game over, stop background music},
    addScore() { //Set the scoring method this.numberNode.opacity = 255; //Set the .opacity element (transparency) of the score node numberNode to 255
        this.num++; //Let num value++
        this.scoreNode.getComponent(cc.Label).string = "" + this.num; //Let the string element of the score node = empty string "" plus num
        this.numberNode.y = this.birdNode.y; //Let the y of the bonus combo node numberNode be equal to the y of the bird node this.numberNode.runAction(//Let the bonus combo node numberNode fade in and out runAction, spawn, fadeOut, moveBy
            cc.spawn(
                cc.fadeOut(0.5),
                cc.moveBy(0.5, cc.v2(0, 50))
            )
        )
        cc.audioEngine.playEffect(this.clip[2]); // Bonus music},

    // LIFE-CYCLE CALLBACKS:

    onLoad() {
        // cc.director.getCollisionManager().enabled = true; //Open the collision management system cc.director.getCollisionManager().
        this.bagPrefab = null; //Define bagPrefab variable and assign it to null // cc.loader.loadRes(path, resource type, callback function); error If error, print error information, data is the successfully loaded resource cc.loader.loadRes("prefab/panelBag", cc.Prefab, (error, data) => {
            if (error) {//Judge if the error message is not empty cc.log(error);//Print error message return;         
            }
            this.bagPrefab = data; //Assign the loaded resources to this.bafPrefab
        });
    },

    start() {
        this.isOpen = false; //Define whether the backpack is open and set it to false;
        this.num = 0; //Change the num parameter to 0 to prevent the score from inheriting the score of the previous game when the game starts again this.scoreNode.getComponent(cc.Label).string = "" + 0; //Set the initial score value to 0
        this.speed = 5; //Set the relative displacement speed to 5
        this.power = 0; //Set the power parameter to 0
        this.checkStill = true; //Check if the game is in progress and the parameter becomes true
        this.curFrame = 0; //Define a variable for looping the skinnode list this.sign = false; //Define an identifier to control whether the game starts, the initial value is false
        this.checkState = false; // false - non-collision detection state true - collision detection state this.up = 0; //
        this.clickLayerNode.on(cc.Node.EventType.TOUCH_START, () => {//Who.on(cc.Node.EventType type.Event, execute anonymous method() =>)
            this.power = 4; //Set the initial power parameter from 0 to 4 directly to ensure that each time the bird is clicked, there is a significant increase this.up++;
            cc.audioEngine.playEffect(this.clip[1]);
        })

        cc.audioEngine.playMusic(this.clip[0], true);
    },

    update(dt) {
        if (!this.sign) {//Set the identifier to pause the game return;
        }
        cc.log(2);
        this.skyNode.x -= this.speed;//Control the movement of the background by controlling the x value of the sky nodethis.birdNode.y += this.power + this.up;//Control the speed of the bird's free fall by the y value of the bird node and the initial power parameterthis.power -= 0.2;//Make the bird move smoothly by gradually changing the power value in small amplitudethis.birdNode.angle = this.speed * this.power;//Control the angle of the bird's rise and fall by power and speed parametersif (this.skyNode.x < -1200) {//Judge when the background and the starting point are 1200 pixels apart, and return the background node skyNode.x to 0 (infinite loop background)
            this.skyNode.x = 0;
        }
        //node.children is the child node of the pipe node let list = this.pipeNode.children; //Use a list to store the child nodes of the metal pipe (.children)
        let checkNode = null; //Define the check pipeline node variable and assign it to null
        for (let i = 0; i < list.length; i++) {//Use a loop to assign values ​​to all pipeline nodes and assign speeds let child = list[i];//let a child variable to store each element in the list child.x -= this.speed;//Control the x-=this.speed of the pipeline node
            // cc.log(child);
            if (child.x < -600) {
                child.x = 600; //When the child is out of bounds < -600, return the child to 600
                child.y = (Math.random() - 0.5) * 200; //Use Math.random() (its value is between 0-1) function to control the random appearance of the pipeline through the port, and the easing value is 200
            }
            let dis = Math.abs(this.birdNode.x - child.x) //let a variable dis is used to calculate the difference between the x of the bird and the pipe (Math.abs takes the absolute value)
            let width = (this.birdNode.width + child.children[0].width) / 2; //Define the width variable to store the critical value of the collision between the bird and the pipe if (dis < width) { //If dis <= width, assign the value child to the check pipe node variable
                checkNode = child;
            }
        }
        if(this.birdNode.y + this.birdNode.height / 2 > cc.winSize.height / 2 //Judge whether the bird's head is larger than the upper edge of the screen or the bottom of the bird is smaller than the lower edge of the screen|| this.birdNode.y - this.birdNode.height / 2 < -cc.winSize.height / 2){
                this.gameOver(); //Execute the game end method}
        if(checkNode) {//Directly judge checkNode, if it is not assigned a value, it is empty this.checkState = true;//The state goes from nothing to something, and the check state variable checkState is assigned to true
            // Check if the upper border of the rectangular bird (.y + height / 2) is greater than or equal to the upper border of the channel (checkNode.y + 100) or the lower border of the bird is less than or equal to the channel if (this.birdNode.y + this.birdNode.height / 2 > checkNode.y + 100
                || this.birdNode.y - this.birdNode.height / 2 < checkNode.y) {
                this.gameOver(); //Game over}
        }else{
            if (this.checkState && this.checkStill) {//Judge whether the check state variable and the check whether the game is in progress variable are both true (&&)
                this.addScore(); //Call the score adding function}
            this.checkStill = true; //Will check whether the game has assigned the variable true
            this.checkState = false; //Assign the check state variable to false
            this.up = 0;
        }
        this.curFrame++; //Increase the bird frame rate variable if (this.curFrame > 2) { //If the frame rate variable is greater than 2, change the frame rate variable to 0;
            this.curFrame = 0;
        }
        if (this.birdNode.y) { //If the strength parameter is greater than 0
            //Let the spriteFrame parameter of the Sprite component of the bird node change with the frame rate parameter this.birdNode.getComponent(cc.Sprite).spriteFrame = this.spriteFrame[this.curFrame];
        }
    }
})