p5.js Web Editor | Boy Who Cried Wolf!

xxxxxxxxxx
let number_sheep;
let step;
let sheep_size;
let boy_size;
let w;
let h;
let sheep_images = [];
let up;
let down;
let right;
let left;
let player_speed = 5;
​
function preload() {
  white_sheep = loadImage("images/white sheep.png");
  black_sheep = loadImage("images/black sheep.png");
  brown_sheep = loadImage("images/brown sheep.png");
  boy = loadImage("images/boy.gif");
  grass = loadImage("images/grass.jpg");
}
​
function setup() {
  frameRate(24);
  noCursor();
  sheep_images = [white_sheep, black_sheep, brown_sheep];
  w = 800;
  h = 800;
  sheep_size = 30;
  step = 15;
  boy_size = 40;
  number_sheep = 5;
  createCanvas(w, h);
​
  g = new Game();
}
​
function draw() {
  for (let i = 0; i < 2; i++) {
    for (let j = 0; j < 4; j++) {
      image(grass, i * 400, j * 200, 400, 200);
    }
  }
​
  // for (var x = 0; x < width; x += width / 20) {
  //   for (var y = 0; y < height; y += height / 20) {
  //     stroke(0);
  //     strokeWeight(1);
  //     line(x, 0, x, height);
  //     line(0, y, width, y);
  //   }
  // }
  g.game();
}
​
// fable about the young man and the wolf (The boy who cried wolf) - inspiration
​
class Pen {
  constructor(width, height, x, y) {
    this.width = width;
    this.height = height;
    this.x = x;
    this.y = y;
  }
​
  display() {
    noFill();
    frameRate(144);
    strokeWeight(1);
    stroke(0);
    rect(this.x, this.y, this.width, this.height);
  }
}
​
class Player {
  constructor(radius, x, y) {
    this.radius = radius;
    this.x = x;
    this.y = y;
  }
​
  move() {
    if (up == true) {
      this.y -= player_speed;
    } else if (down == true) {
      this.y += player_speed;
    } else if (right == true) {
      this.x += player_speed;
    } else if (left == true) {
      this.x -= player_speed;
    }
  }
​
  display() {
    noFill();
    noStroke();
    //fill(255)
    ellipse(this.x, this.y, this.radius, 2 * this.radius);
    this.image = image(
      boy,
      this.x - boy_size,
      this.y - boy_size - 5,
      2 * boy_size,
      2 * boy_size
    );
  }
}
​
class Sheep {
  constructor(radius, x, y) {
    this.radius = radius;
    this.x = x;
    this.y = y;
    this.image = random(sheep_images);
    this.step = 0;
​
    // console.log(x)
    // console.log(y)
    // console.log("\n")
  }
​
  move(new_x, new_y) {
    this.x = constrain(new_x, 50 + sheep_size / 2, width - sheep_size / 2 - 50);
    this.y = constrain(new_y, 50 + sheep_size / 2, height - sheep_size / 2 - 50);
  }
​
  display() {
    // noFill()
    noStroke();
    fill(255);
    ellipse(this.x, this.y, this.radius);
    image(
      this.image,
      this.x - sheep_size,
      this.y - sheep_size,
      2 * sheep_size,
      2 * sheep_size
    );
  }
}
​
class Game {
  constructor() {
    this.score = 0;
    this.player = new Player(boy_size, 5, 10, 40);
    this.sheep = [];
    this.pen = [
      (this.left_pen = new Pen(10, 400, width / 2 - 150, height / 2 - 200)),
      (this.right_pen = new Pen(
        10,
        400,
        width / 2 + 150 - 10,
        height / 2 - 200
      )),
      (this.bottom_pen = new Pen(
        280,
        10,
        width / 2 - 150 + 10,
        height / 2 + 200
      )),
    ];
​
    for (let i = 0; i < number_sheep; i++) {
      this.sheep.push(
        new Sheep(sheep_size, random(10, width - 10), random(10, height - 10))
      );
    }
  }
​
  sheep_player_contact() {
    for (let j = 0; j < this.sheep.length; j++) {
      for (let i = 0; i < this.pen.length; i++) {
        if (
          collideRectCircle(
            this.pen[i].x,
            this.pen[i].y,
            this.pen[i].width,
            this.pen[i].height,
            this.sheep[j].x,
            this.sheep[j].y,
            25
          )
        ) {
​
          step = 0
          this.sheep_pen_interaction();
        } else {
          for (let i = 0; i < number_sheep; i++) {
            step = 1
            if (
              dist(
                this.sheep[i].x,
                this.sheep[i].y,
                this.player.x,
                this.player.y
              ) <= 75
            ) {
              if (this.sheep[i].y < this.player.y) {
                if (this.sheep[i].x < this.player.x) {
                  this.sheep[i].move(
                    this.sheep[i].x - step,
                    this.sheep[i].y - step
                  );
                } else {
                  this.sheep[i].move(
                    this.sheep[i].x + step,
                    this.sheep[i].y - step
                  );
                }
              } else {
                if (this.sheep[i].x < this.player.x) {
                  this.sheep[i].move(
                    this.sheep[i].x - step,
                    this.sheep[i].y + step
                  );
                } else {
                  this.sheep[i].move(
                    this.sheep[i].x + step,
                    this.sheep[i].y + step
                  );
                }
              }
            }
          }
        }
      }
    }
  }
​
  sheep_sheep_contact() {
    for (let i = 0; i < number_sheep; i++) {
      for (let j = i + 1; j < number_sheep; j++) {
        if (
          dist(
            this.sheep[i].x,
            this.sheep[i].y,
            this.sheep[j].x,
            this.sheep[j].y
          ) <= 75
        ) {
          let s1 = dist(
            this.sheep[i].x,
            this.sheep[i].y,
            this.player.x,
            this.player.y
          );
          let s2 = dist(
            this.sheep[j].x,
            this.sheep[j].y,
            this.player.x,
            this.player.y
          );
​
          let closest_sheep = min(s1, s2);
​
          if (closest_sheep == s2) {
            if (this.sheep[i].y < this.sheep[j].y) {
              if (this.sheep[i].x < this.sheep[j].x) {
                this.sheep[i].move(
                  this.sheep[i].x - step,
                  this.sheep[i].y - step
                );
              } else {
                this.sheep[i].move(
                  this.sheep[i].x + step,
                  this.sheep[i].y - step
                );
              }
            } else {
              if (this.sheep[i].x < this.sheep[j].x) {
                this.sheep[i].move(
                  this.sheep[i].x - step,
                  this.sheep[i].y + step
                );
              } else {
                this.sheep[i].move(
                  this.sheep[i].x + step,
                  this.sheep[i].y + step
                );
              }
            }
          } else {
            if (this.sheep[j].y < this.sheep[i].y) {
              if (this.sheep[j].x < this.sheep[i].x) {
                this.sheep[j].move(
                  this.sheep[j].x - step,
                  this.sheep[j].y - step
                );
              } else {
                this.sheep[j].move(
                  this.sheep[j].x + step,
                  this.sheep[j].y - step
                );
              }
            } else {
              if (this.sheep[j].x < this.sheep[j].x) {
                this.sheep[j].move(
                  this.sheep[j].x - step,
                  this.sheep[j].y + step
                );
              } else {
                this.sheep[j].move(
                  this.sheep[j].x + step,
                  this.sheep[j].y + step
                );
              }
            }
          }
        }
      }
    }
  }
​
  sheep_pen_interaction() {
    for (let j = 0; j < this.sheep.length; j++) {
      for (let i = 0; i < this.pen.length; i++) {
        if (
          collideRectCircle(
            this.pen[i].x,
            this.pen[i].y,
            this.pen[i].width,
            this.pen[i].height,
            this.sheep[j].x,
            this.sheep[j].y,
            25
          )
        ) {
          if (right == true) {
            if (this.sheep[j].x < this.pen[i].x) {
              left = false;
              this.sheep[j].x = this.pen[i].x - 10;
            }
          } else if (left == true) {
            if (this.sheep[j].x > this.pen[i].x + this.pen[i].width) {
              right = false;
              this.sheep[j].x = this.pen[i].x + 10;
            }
          } else if (down == true) {
            if (this.sheep[j].y < this.pen[i].y) {
              up = false;
              this.sheep[j].y = this.pen[i].y - 10;
            }
          } else if (up == true) {
            if (this.sheep[j].y > this.pen[i].y + this.pen[i].height) {
              down = false;
              this.sheep[j].y = this.pen[i].y + 10;
            }
          }
        }
      }
    }
  }
​
  game() {
    // this.sheep_pen_interaction()
    this.player.move();
    this.player.display();
    // for (let p = 0; p < this.pen.length; p++) {
    //   this.pen[p].display();
    // }
​
    for (let i = 0; i < number_sheep; i++) {
      this.sheep[i].display();
    }
​
    this.sheep_player_contact();
    this.sheep_sheep_contact();
  }
}
​
function keyPressed() {
  if (keyPressed) {
    if (keyCode == UP_ARROW) {
      up = true;
    }
    if (keyCode == DOWN_ARROW) {
      down = true;
    }
    if (keyCode == RIGHT_ARROW) {
      right = true;
    }
    if (keyCode == LEFT_ARROW) {
      left = true;
    }
  }
}
​
function keyReleased() {
  if (keyReleased) {
    if (keyCode == UP_ARROW) {
      up = false;
    }
    if (keyCode == DOWN_ARROW) {
      down = false;
    }
    if (keyCode == LEFT_ARROW) {
      left = false;
    }
    if (keyCode == RIGHT_ARROW) {
      right = false;
    }
  }
}
​
Cookies

Sketch Files

Console

Preview
