class Spot {
  constructor() {
let x;
let y;
let speed;
let diameter;
let direction = 1;
  }
  display() {
    ellipse(spot.x, spot.y, spot.diameter, spot.diameter);
  }

  move(x, y, speed, height,  diameter, direction) {
//let x;
//let y;
//let speed;
//let diameter;
    direction = 1;
    y += speed * direction;
    if (y > height - diameter / 2 || y < diameter / 2) {
      direction *= -1;
    }
  }

  // Spot(xpos, ypos, dia, sp) {
  //   x = xpos;
  //   y = ypos;
  //   diameter = dia;
  //   speed = sp;
  // }
}

let spot = new Spot();

   function setup() {
 createCanvas(100, 100);
 noStroke();
 spot = new Spot(33, 50, 30, 1.5);
 console.log(spot);

  //sp = new Spot(33, 50, 30);

  spot.x = 33;
  spot.y = 50;
  spot.diameter = 30;
}

function draw() {
  spot.move();
  fill(0, 15);
  rect(0, 0, width, height);
  fill(255);

  //background(0);
  spot.display();
}

   ` //in the main program we initialize
    var puck = new Puck(); 
    var left = new Paddle(true);
    var right = new Paddle(false);
    //and then call the method like this
    puck.checkPaddleLeft(left);
    puck.checkPaddleRight(right);
...`


  `  //in the puck class we have this
    function Puck(){
     this.x = 600/2; // Place the puck in the middle of the x axis.
     this.y = 400/2; // Place the puck in the middle of the y axis.
     this.xspeed = 0; // Sets the initial puck speed along the x axis.
     this.yspeed = 0; // Sets the initial puck speed along the y axis.
     this.r = 12; // Establishes the radius of the puck at 12 pixels.
     //reset();

    Puck.protoype.checkPaddleLeft = function(p) { // Function to determine collision between the puck and the left paddle.
      if (y < p.y + p.h/2 && y > p.y - p.h/2 && this.x - this.r < p.x + p.w/2) {
        if (this.x > p.x) {
          var diff = y - (p.y - p.h/2);
          var rad = radians(45);
          var angle = map(diff, 0, p.h, -rad, rad);
          this.xspeed = 5 * cos(angle);
          this.yspeed = 5 * sin(angle);
          this.x = p.x + p.w/2 + this.r;
        }
      }
    }
...}`

When you try to run this, it returns "Cannot set property 'checkPaddleLeft' of undefined" Any assistance on how to structure such calls is appreciated.

var canvasWidth = 700;
var canvasHeight = 400;
var yoff = 0.0;   

function setup() { 
  createCanvas(canvasWidth, canvasHeight);
} 


function draw() {
  drawBackground();
    drawCar();
}


//Car (player)
var car = {
  x : 50,
  y : 230,
  draw : function() {
    fill(0);
    rect(this.x, this.y, 50, 50);
    }
}



//Rock (enemies to avoid)
var rocks = [];

function rock(I) {
  I.active = true;
  I.yvelocity = 2;
  I.width = 20;
  I.height = 20;
  I.y = Math.random() * (canvasHeight-I.height);
  I.x = 400;
  I.inBounds = function() {
    return I.x >= 700 && I.x < canvasWidth + I.width;
  };
  I.draw = function() {
    //fill(0); this comes up as an error every now and then, not sure how to add 
    //this attribute to the var in the array, unlike I did with the car. 
    //The rect attribute also comes up with an error sometimes
    rect(I.x, I.y, I.width, I.height);
  };
  I.update = function() {
    I.active = I.active && I.inBounds();
    I.x -= I.xvelocity;
  };
  return I;

}


//Background and setting
function drawBackground() { 
  background(175, 213, 255);
  //noStroke();
  fill(225, 212, 160);
  beginShape(); 
    var xoff = 0;     
    // Iterate over horizontal pixels
    for (var x = 0; x <= width; x += 10) {
        // Calculate a y value according to noise, map to 
        var y = map(noise(xoff, yoff), 0, 1, 100,200);
        vertex(x, y); 
        // Increment x dimension for noise
        xoff += 0.05;
    }
    // increment y dimension for noise
    yoff += 0.01;
    vertex(width, height);
    vertex(0, height);
  endShape(CLOSE);
}


//Car controls / drawing
function drawCar() {

  car.draw();
  if (keyIsDown(DOWN_ARROW)) {
    if (car.y + 5 >= 350)
      car.y = 350;
    else
      car.y += 5;
    }
    if (keyIsDown(UP_ARROW)) {
    if (car.y <= 150)
        car.y = 150;
    else
      car.y -= 5;
    }
}

if(Math.random() < 0.05){
    rocks.push(rock({}));
}

rocks = rocks.filter(function(rock){
  return rock.active;
});
rocks.forEach(function(rock){
    rock.update();
  rock.draw();
});

My code for the object, and movement is as follows:

`function bomberMan(){

this.x = 100; this.y = 100; this.xpseed = 0; this.yspeed = 0;

this.dir = function(x,y){ this.xspeed = x; this.yspeed = y; }

this.update = function(){ this.x = this.x + this.xpseed; this.y = this.y + this.yspeed; }

this.show = function(){ fill(0); rect(this.x, this.y, 15, 15); }

}

function keyPressed(){ if (keyCode === UP_ARROW){ bomber.dir(0, -1); }

if (keyCode === DOWN_ARROW){ bomber.dir(0,1); }

if (keyCode === LEFT_ARROW){ bomber.dir(-1,0); }

if (keyCode === RIGHT_ARROW){ bomber.dir(1,0); } }`

Any help as to why this doesn't seem to work would be greatly appreciated, thanks so much!

I have no idea what do to.

If you answer, please talk to me like you'd talk to a five year old... Thanks.

https://openprocessing.org/sketch/421935