Add timer, instructions and big green bird

CM2030 Graphics Programming/Topic 4/4.5.1/physics.js

@@ -14,12 +14,14 @@ function drawGround() {
   drawVertices(ground.vertices);
   pop();
 }
+
 ////////////////////////////////////////////////////////////////
 function setupPropeller() {
   // your code here
   propeller = Bodies.rectangle(150, 480, 200, 15, { isStatic: true, angle: 0 });
   World.add(engine.world, [propeller]);
 }
+
 ////////////////////////////////////////////////////////////////
 //updates and draws the propeller
 function drawPropeller() {
@@ -27,12 +29,11 @@ function drawPropeller() {
   Body.setAngularVelocity(propeller, angleSpeed);
   push();
   fill(255);
-  //translate(propeller.position.x, propeller.position.y);
-  //rotate(propeller.angle);
   drawVertices(propeller.vertices);
   pop();
   angle += angleSpeed;
 }
+
 ////////////////////////////////////////////////////////////////
 function setupBird() {
   var bird = Bodies.circle(mouseX, mouseY, 20, {
@@ -45,6 +46,31 @@ function setupBird() {
   pinkFrame.push(Math.trunc(random(1, 5)) - 1);
   birds.push(bird);
 }
+
+////////////////////////////////////////////////////////////////
+function setupGreenBird() {
+  if(greenCount == 0)
+    return;
+  var greenBird = Bodies.circle(200, 250, 60, {
+    friction: 0,
+    restitution: 0.95
+  });
+
+  slingshotConstraint = Constraint.create({
+    bodyB: greenBird,
+    pointA: { x: 200, y: 200 },
+    pointB: { x: 0, y: 0 },
+    stiffness: 0.01,
+    damping: 0.0001,
+  });
+
+  Matter.Body.setMass(greenBird, greenBird.mass * 10);
+  World.add(engine.world, [greenBird, slingshotConstraint]);
+
+  greenFrame.push(Math.trunc(random(1, 5)) - 1);
+  greenBirds.push(greenBird);
+  greenCount--;
+}
 ////////////////////////////////////////////////////////////////
 function drawBirds() {
   fill("orange");
@@ -68,9 +94,32 @@ function drawBirds() {
       i--;
     }
   }
-  //console.log("# Birds: ", birds.length);
-  //console.log("# World Bodies: ", engine.world.bodies.length);
 }
+
+////////////////////////////////////////////////////////////////
+function drawGreenBirds() {
+  fill("green");
+  for (let i = 0; i < greenBirds.length; i++) {
+    push();
+    imageMode(CENTER);
+    translate(greenBirds[i].position.x, greenBirds[i].position.y);
+    rotate(greenBirds[i].angle);
+    image(greenSprite[greenFrame[i]], 0, 0, 120, 120);
+    pop();
+    if (frameCount % 5 == 0)
+      greenFrame[i] < 3 ? greenFrame[i]++ : (greenFrame[i] = 0);
+
+    if (isOffScreen(greenBirds[i])) {
+      World.remove(engine.world, greenBirds[i]);
+      greenBirds.splice(i, 1);
+      greenFrame.splice(i, 1);
+      i--;
+    }
+  }
+}
+
+
+
 ////////////////////////////////////////////////////////////////
 //creates a tower of boxes
 function setupTower() {

CM2030 Graphics Programming/Topic 4/4.5.1/sketch.js

@@ -19,6 +19,7 @@ let birds = [];
 let colors = [];
 let ground;
 let slingshotBirds = [];
+let greenBirds = [];
 let slingshotConstraint;
 let angle=0;
 let angleSpeed=0.01;
@@ -30,6 +31,12 @@ let greenSprite = [];
 let greenFrame = [];
 let redSprite = [];
 let redFrame = [];
+
+let timeLeft = 20;
+let started = false;
+let gameOver = false;
+let gameWon = false;
+let greenCount = 2;
 ////////////////////////////////////////////////////////////
 function preload()
 {
@@ -81,10 +88,106 @@ function draw() {
   drawBirds();
 
   drawSlingshot();
+
+  drawGreenBirds();
+
+  drawGUI();
+
+  checkWin();
 }
+
+function checkWin()
+{
+  if(boxes.bodies.length == 0 && !gameOver)
+  {
+    gameWon = true;
+  }
+}
+
+function drawGUI()
+{
+  // Press key to start
+  if(!started)
+  {
+    textAlign(CENTER);
+    textSize(40);
+    stroke(0)
+    strokeWeight(1);
+    fill('yellow');
+    text("Click or Press any key to start", width/2, height/2);
+  }
+
+  // draw birds
+  textAlign(CENTER);
+  textSize(30);
+  stroke(0)
+  strokeWeight(1);
+  fill('white');
+  image(pinkSprite[0], 20, 20, 30, 30);
+  image(redSprite[0], 20, 50, 30, 30);
+  image(greenSprite[0], 20, 80, 30, 30);
+  text("∞", 80, 50);
+  text("∞", 80, 80);
+  
+  text(greenCount.toString(), 80, 110);
+  // draw instructions
+  textSize(20);
+  textAlign(LEFT);
+  stroke(0)
+  strokeWeight(1);
+  fill(255);
+  text("B: pink bird", width - 150, 50);
+  text("R: red bird", width - 150, 70);
+  text("G: green bird", width - 150, 90);
+  text("←: faster spin", width - 150, 110);
+  text("→: slower spin", width - 150, 130);
+
+  // draw time left
+  stroke(0)
+  strokeWeight(1);
+  fill('white');
+  let textSizeCounter = 20;
+  textSize(textSizeCounter);
+  textAlign(CENTER);
+  text("TIME LEFT", width /2, 20);
+  if(started && !gameOver && !gameWon && frameCount % 60 == 0)
+  {
+    timeLeft -= 1;
+  }
+
+  // draw game over
+  text(timeLeft.toString(), width /2, textSizeCounter * 2);
+  if(timeLeft == 0 && !gameWon)
+  {
+    gameOver = true;
+    textAlign(CENTER);
+    textSize(40);
+    stroke(0)
+    strokeWeight(1);
+    fill('red');
+    text("GAME OVER", width/2, height/2);
+    textSize(textSizeCounter);
+    text("Refresh to start again", width/2, height/2 + textSizeCounter * 2 );
+  }
+
+  // game won
+  if(gameWon)
+  {
+    textAlign(CENTER);
+    textSize(40);
+    stroke(0)
+    strokeWeight(1);
+    fill('orange');
+    text("You have WON", width/2, height/2);
+    textSize(textSizeCounter);
+    text("Refresh to start again", width/2, height/2 + textSizeCounter * 2 );
+  }
+}
+
 ////////////////////////////////////////////////////////////
 //use arrow keys to control propeller
 function keyPressed(){
+  started = true;
   if (keyCode == LEFT_ARROW){
     angleSpeed += 0.01;
   }
@@ -94,6 +197,8 @@ function keyPressed(){
 }
 ////////////////////////////////////////////////////////////
 function keyTyped(){
+  if(gameOver || gameWon)
+    return;
   //if 'b' create a new bird to use with propeller
   if (key==='b'){
     setupBird();
@@ -103,7 +208,12 @@ function keyTyped(){
   if (key==='r'){
     //removeFromWorld(slingshotBird);
     removeFromWorld(slingshotConstraint);
-    setupSlingshot();
+    setupSlingshot(key);
+  }
+
+  if(key=='g'){
+    removeFromWorld(slingshotConstraint);
+    setupGreenBird();
   }
 }
 
@@ -114,6 +224,7 @@ function keyTyped(){
 //if mouse is released destroy slingshot constraint so that
 //slingshot bird can fly off
 function mouseReleased(){
+  started = true;
   setTimeout(() => {
     slingshotConstraint.bodyB = null;
     slingshotConstraint.pointA = { x: 0, y: 0 };