Shirley Chen – Final Project – Little Red Riding Hood

For the final project I create a game based on the story of “Little Red Riding Hood”. In this game, the user use mouse to control the position of Little Red to avoid a group of wolves running randomly. The Little Red should try to get more apples, and for each apple she gets the user can earn 10 points. There is another snake which wants to eat Little Red’s apple, so Little Red should get the apple before the snake reaches it. If the snake eats the apple before Little Red reaches it, the user will lose 10 points. The game would be over if the wolves hit Little Red. Little Red’s grandma is very worried about her granddaughter at the bottom right corner. This project is very fun and I enjoy the process of solving different problems that I met.
Have fun playing it! 🙂

sketch

// Shirley Chen
// Section B
// junfanc@andrew.cmu.edu
// FINAL PROJECT

var xWolf = [];
var yWolf = [];
var dxW = [];
var dyW = [];
var bushesX = [];
var bushesY = [];
var appleX = 300;
var appleY = 300;
var girl;
var wolf;
var bushes;
var apple;
var grandma;
var count = 0;
var snakeX = 590;
var snakeY = 0;
var textAppear = false;


function preload(){
  girl = loadImage("https://i.imgur.com/X6Tfuu7.png");
  wolf = loadImage("https://i.imgur.com/80Jv2F4.png");
  grass = loadImage("https://i.imgur.com/zTPmG8i.png");
  apple = loadImage("https://i.imgur.com/dgBmn61.png");
  snake = loadImage("https://i.imgur.com/QpLwiaZ.png");
  snakeflip = loadImage("https://i.imgur.com/aGK7Aa3.png");
  bushes = loadImage("https://i.imgur.com/mfdC2Ny.png");
  grandma = loadImage("https://i.imgur.com/3dTTlzG.png");
}


function setup(){
  createCanvas(600, 600);
  imageMode(CENTER);
// Randomly select bushes' location
  for (var i = 0; i < 10; i++){
    bushesX.push(random(20, 580));
    bushesY.push(random(20, 580));
  }
// Randomly select wolf's starting location and speed
  for (var i = 1; i < 15; i++) { 
    xWolf[i] = random(0, width);
    yWolf[i] = random(0, height);
    dxW[i] = random(-4, 4);
    dyW[i] = random(-4, 4);
  }
}


function draw(){
  background(229, 255, 229);
// Draw the bushes as background
  for (var i = 0; i < 10; i ++){
    image(bushes, bushesX[i], bushesY[i]);
  }
// Make the wolves move randomly in the canvas
  for (var i = 1; i < 15; i ++){
    image(wolf, xWolf[i], yWolf[i]);
    xWolf[i] += dxW[i];
    yWolf[i] += dyW[i];
// Make the wolves bounce back if they hit the boundary of the canvas 
    if (xWolf[i] + 10 > width || xWolf[i] - 10 < 0){
      dxW[i] =- dxW[i];
      }
    if (yWolf[i] + 15 > height || yWolf[i] - 15 < 0){
      dyW[i] =- dyW[i];
      }
// Create a girl controled by user's mouse
    image(girl, mouseX, mouseY);
// When the girl hits a wolf the game is over
    if (xWolf[i] > mouseX - 10  & xWolf[i] < mouseX + 10){
      if (yWolf[i] > mouseY - 10 && yWolf[i] < mouseY + 10){
        gameOver();
      }      
    }
  }
// Draw an apple with starting location (300, 300)
  image(apple, appleX, appleY);
// Create a snake that will move to eat apple
  var dx = appleX - snakeX;
  var dy = appleY - snakeY;
  snakeX += dx / 70;
  snakeY += dy / 70;
  image(snake, snakeX, snakeY);

// If the girl gets apple, adds 10 point to the score
// If the snake eats apple, minus 10 point to the score
  fill(255, 153, 175);
  textSize(15);
  text("SCORE: " + str(count), 20, 30);
  if (girlGetsApple()){
    pickAppleLocation(); 
    count +=10;
  }
  if (snakeGetsApple()){
    pickAppleLocation();
    count -=10;
  }
// Grandma is very worried about her granddaughter
  image(grandma, 540, 500);
}

// Randomly pick apple's location
function pickAppleLocation(){
  appleX = random(10, 290);
  appleY = random(10, 290);
}

// If the girl or snake gets apple,
// the apple will change to another location
function girlGetsApple(){
  var d = dist(mouseX, mouseY, appleX, appleY);
  if (d < 13){
    return true;
  }
  else{
    return false;
  }
}
function snakeGetsApple(){
  var s = dist(appleX, appleY, snakeX, snakeY);
  if (s < 13){
    return true;
  }
  else{
    return false;
  }
}

// When the gram is over, screen will appear "GAME OVER!"
// and the game will stop
function gameOver(){
  textAppear = true;
  fill(255, 153, 175);
  textSize(30);
  textStyle(BOLD);
  textFont('Arial');
  text("GAME OVER!", 200, 300);
  noLoop();
}


Leave a Reply