canvas issue - one element is effecting the others

[amishizaki]

What's the problem you're trying to solve?

The canvas class I've created for my player seems to be overriding the code for other canvas elements. For example, if I set my player color to black, the other elements become black.

Post any code you think might be relevant (one fenced block per file)

class Character {
    constructor(alive) {
        this.x = 0,
        this.y = 550,
        this.width = 50,
        this.height = 50,
        this.alive = alive,
        this.color = 'black',
        this.jumpHeight = 12;
        this.shouldJump = false;
        // this.jumpCounter = 0;
        // this.isHolding = false,
        // this.escaped = false,
        this.speed = 15,
        this.direction = {
            // up: false,
            // down: false,
            left: false,
            right: false,
        }
...
this.render = function () {
            ctx.fillStyle = this.color
            ctx.fillRect(this.x, this.y, this.width, this.height)
            }

If you see an error message, post it here. If you don't, what unexpected behavior are you seeing?

No error messages, but I see a cascade of issues where my code won't listen to the edits that I need to make.

What is your best guess as to the source of the problem?

I think that the render function is overwriting the draw function?

What things have you already tried to solve the problem?

I'm trying to edit my character class, but I feel a little lost.

Paste a link to your repository here

https://github.com/amishizaki/Unit-One-Project

[amishizaki]

looks like the render function on the character is overwriting the draw functions for the boxes and the portal

[amishizaki]

It's not super important right now, but it might impact the ending of my game - which involves a crazy amount of colors