Basically, I have some code that fires circles at the mouse from a player (also a circle) when the mouse is pressed. I'm trying to create another circle that also fires at the mouse (ideally from a key instead of mouse pressed), but I'm struggling to do so. I've pasted my p5.js code. Would greatly appreciate any suggestions!

var bullets = [];

function setup() {
    createCanvas(600, 600);
    player = new Player();

}

function draw() {
    clear();
    background(51);
    player.show();

    for (let i = 0; i < bullets.length; ++i) {
        bullets[i].toMouse();
        bullets[i].show();
    }
}


function mousePressed() {
    if (mouseX != player.x || mouseY != player.y) {
        bullets.push(new Bullet(mouseX, mouseY, player.x, player.y))
    }

}

function Bullet(X, Y, PX, PY) {
    this.speed = 5;
    this.x = PX;
    this.y = PY;
    this.dir = createVector(X - PX, Y - PY).normalize()
    this.r = 7;

    this.show = function() {
        fill(255, 255, 0);
        stroke(128, 128, 0);
        circle(this.x, this.y, this.r);
        circle(this.x + 50, this.y, this.r);
    }
    this.toMouse = function() {
        this.x += this.dir.x * this.speed;
        this.y += this.dir.y * this.speed;
    }

}

function Player() {
    this.x = width / 2;
    this.y = 450;
    this.r = 20;
    this.speed = 4;
    this.show = function() {
        fill(0, 255, 0);
        stroke(0, 128, 0);
        circle(this.x, this.y, this.r);
        circle(this.x + 50, this.y, this.r);
    }

}
}