Zappa Zay – game.awkwardrelica.com

Come Game With Zay! Ayoooo!
Index.html Update:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Sam's Bug Collector Game</title>

<script src="https://cdn.jsdelivr.net/npm/phaser@3.80.1/dist/phaser.min.js"></script>

<style>
body { margin:0; background:#111; }
canvas { display:block; margin:auto; }
</style>

</head>
<body>

<script>

const config = {
    type: Phaser.AUTO,
    width: 800,
    height: 450,
    backgroundColor: "#1b1b1b",

    physics: {
        default: "arcade",
        arcade: { gravity: { y: 0 } }
    },

    scene: {
        create: create,
        update: update
    }
};

const game = new Phaser.Game(config);

let player;
let cursors;
let walls;
let bugs;
let score = 0;
let scoreText;

function create() {

    this.physics.world.setBounds(0,0,2000,1200);
    this.cameras.main.setBounds(0,0,2000,1200);

    player = this.add.rectangle(200,200,40,40,0x4aa3ff);
    this.physics.add.existing(player);
    player.body.setCollideWorldBounds(true);

    walls = this.physics.add.staticGroup();

    addWall(this,400,200,300,40);
    addWall(this,700,380,40,300);
    addWall(this,300,500,500,40);

    this.physics.add.collider(player,walls);

    this.cameras.main.startFollow(player);

    cursors = this.input.keyboard.createCursorKeys();

    bugs = this.physics.add.group();

    scoreText = this.add.text(20,20,"Bugs: 0",{font:"20px Arial",fill:"#ffffff"});
    scoreText.setScrollFactor(0);

    this.physics.add.overlap(player,bugs,collectBug,null,this);

    spawnBugs(this);

}

function update(){

    const speed = 250;

    player.body.setVelocity(0);

    if(cursors.left.isDown) player.body.setVelocityX(-speed);
    else if(cursors.right.isDown) player.body.setVelocityX(speed);

    if(cursors.up.isDown) player.body.setVelocityY(-speed);
    else if(cursors.down.isDown) player.body.setVelocityY(speed);

    player.body.velocity.normalize().scale(speed);
}

function addWall(scene,x,y,w,h){

    const wall = scene.add.rectangle(x,y,w,h,0x777777);
    scene.physics.add.existing(wall,true);
    walls.add(wall);

}

function spawnBugs(scene){

    for(let i=0;i<15;i++){

        let x = Phaser.Math.Between(100,1800);
        let y = Phaser.Math.Between(100,1000);

        let bug = scene.add.text(x,y,"🐞",{font:"28px Arial"});
        scene.physics.add.existing(bug);

        bug.body.setImmovable(true);
        bug.body.setAllowGravity(false);

        bugs.add(bug);
    }
}

function collectBug(player,bug){

    bug.destroy();

    score++;
    scoreText.setText("Bugs: "+score);

}

</script>

</body>
</html>
Main.js