1

I'm attempting to write a JavaScript program where the ball ignores hitting a green obstacle but ends the game when a red obstacle indicates game over. However in my code the game ends when the ball hits an obstacle of any color.

My definition of the obstacle is:

function Obstacle(x, size, horizon, color) {

  this.x = x;
  this.y = horizon - size;

  this.size = size;
  this.color = color;

  this.onScreen = true;
}

/**
    *   handle x and onScreen values
    */
Obstacle.prototype.update = function(speed) {

    /* check if offscreen */
    this.onScreen = (this.x > -this.size);

    /* movement */
    this.x -= speed;
};

Obstacle.prototype.draw = function() {

    fill(this.color);
    stroke(255);
    strokeWeight(2);
    rect(this.x, this.y, this.size, this.size);
};


Obstacle.prototype.hits = function(ball) {

    var halfSize = this.size / 2;
    var minimumDistance = halfSize + (ball.radius); // closest before collision

    /* find center coordinates */
    var xCenter = this.x + halfSize;
    var yCenter = this.y + halfSize;

    var distance = dist(xCenter, yCenter, ball.x, ball.y); // calculate distance from centers

    return (distance < minimumDistance); // return result

}; 

This is the code for the game:

function setup() {
  createCanvas(600, 200);
  textAlign(CENTER);
  horizon = height - 40;
  score = 0;
  obstacleSpeed = 6;
  var size = 20;
  ball = new bol(size * 2, height - horizon, size);
  textSize(20);
}

function draw() {
  background(51);
  drawHUD();
  handleLevel(frameCount);
  ball.update(horizon);
  handleObstacles();
  //handlepowerups();
}

/**
 * draws horizon & score
 */
function drawHUD() {
  /* draw horizon */
  stroke(255);
  strokeWeight(2);
  line(0, horizon, width, horizon);

  /* draw score */
  noStroke();
  text("Score: " + score, width / 2, 30);

ball.draw();
}

/**
 *  updates, draws, and cleans out the obstacles
 */
function handleObstacles() {
  for (var i = obstacles.length - 1; i >= 0; i--) {
    obstacles[i].update(obstacleSpeed);
    obstacles[i].draw();
    if (obstacles[i].hits(ball)) // if there's a collision
    {
      if (obstacles[i].color = color(225, 0, 0))
        endGame();
      else
        obstacles[i].color = color(0, 0, 225)
    }

    if (!obstacles[i].onScreen) // if it's no longer showing
      obstacles.splice(i, 1); // delete from array
  }
}

/**
 * speeds game up, pushes new obstacles, & handles score
 */
function handleLevel(n) {
  if (n % 100 === 0) { // every 0.5 seconds
    var n = noise(n);
    if (n > 0.5)
      newObstacle(n); // push new obstacle
    if (n % 120 === 0) // every 2 seconds
      obstacleSpeed *= 1.05; // speed up
  }
  score++;
}

/**
 * pushes random obstacle
 */
function newObstacle(n) {
  var col1 = color(225, 0, 0);
  var col2 = color(0, 225, 0);
  var size = random(25) + 20;
  var obs = new Obstacle(width + size, size, horizon, col2);
  var obs2 = new Obstacle(width + size, size, horizon, col1);
  var cases = random(1);
  if (cases < 0.5)
    obstacles.push(obs);
  else
    obstacles.push(obs2)
}

function keyPressed() {
  if ((keyCode === UP_ARROW || keyCode === 32) && ball.onGround) // jump if possible
    ball.jump();
  boingaudio.play()
}

function endGame() {
  noLoop();
  noStroke();
  textSize(40);
  text("GAME OVER", width / 2, height / 2);
  if (highscore !== null) {
    if (score > highscore) {
      localStorage.setItem("highscore", score);
    }
  } else {
    localStorage.setItem("highscore", score);
  }

  textSize(20);
  text("Highscore: " + highscore, width / 2, height / 2 + 20);
  gameoveraudio.play()
}

I don't understand why the ball keeps ending game for no matter what colored ball appears. Can you help me figure out what's wrong?

Barmar
  • 741,623
  • 53
  • 500
  • 612
shru_kum
  • 11
  • 2
  • I'm not sure if it's related to the problem, but shouldn't you break out of the loop when the game ends? – Barmar May 16 '20 at 06:56

1 Answers1

0

You seem to be assigning a value to obstacles[i].color rather than testing it:

if (obstacles[i].color = color(225, 0, 0))
  endGame();
else
  obstacles[i].color = color(0, 0, 225)

This should probably read:

if (obstacles[i].color == color(225, 0, 0))
  endGame();

Without your else, which seemed to serve no purpose.

kmoser
  • 8,780
  • 3
  • 24
  • 40
  • when i do that, it just passes through all of the obstacles without the game ever ending – shru_kum May 16 '20 at 08:39
  • That's probably because `color(255, 0, 0)` is an object, and you can't [compare two objects directly](https://stackoverflow.com/questions/201183/how-to-determine-equality-for-two-javascript-objects). You need to tell us more about what is contained in `obstacles[i].color`. – kmoser May 16 '20 at 16:52