Top Chef Bob - Part 07 - Scoring!
Part 07 of the Top Chef Bob food simulator game is to:
1) Create two global counters for number of customers Satisfied and UnSatisfied.
2) Display current count of satisified and unsatisified customers on screen.
3) Accumulate our counters.
4) Add a Flag to the Customer object to indicate if they are Satisified.
5) When Bob grabs wrong ingrident, set Customer Satisfied flag to False.
6) Tell user when they have WON or Game Over.
Create global counters
In the "playlevel1.js" file, Add this function below right after the CREATE function. Then add a call to it from the CREATE function.
createScore: function() {
// to win the game, you have to have 3 satisfied customers
this.CustomersSatisfied = 0;
this.CustomersNotSatisfied = 0;
// display number of satisfied and unsatisfied customers
this.txtCustomerSatisfied = game.add.text(1, 400, '', { font: "15pt Courier", fill: "#f4e242", stroke: "#f4e242", strokeThickness: 2 });
this.txtCustomerSatisfied.text = '# Satisfied Customers: ' + this.CustomersSatisfied;
this.txtCustomerNotSatisfied = game.add.text(1, 450, '', { font: "15pt Courier", fill: "#f4e242", stroke: "#f4e242", strokeThickness: 2 });
this.txtCustomerNotSatisfied.text = '# UnSatisfied Customers: ' + this.CustomersNotSatisfied;
},
// the create function is where we create all our game objects
create: function() {
// change the background color of our game
game.stage.backgroundColor = '#5c94fc';
this.createKeyboard();
this.createBob();
this.createKitchen();
this.createIngredients();
this.createMenu();
this.createScore();
},
Create global counters
In the "playlevel1.js" file, Replace the ORDERMANGEMENT function with the new one below.
Each time a new order is created, we display the number of satisified and unsatisified customers with just two lines of code.
orderManagement: function() {
// has customer ordered anything?
if (this.Customer.MenuItemOrdered === null) {
// customer wants to order something
// -- customer randomly pics an order
// generate a random number between 0 and number of menu items
CustomerWantsMenuItemNumber = game.rnd.integerInRange(0, 1);
// figure out what customer ordered
this.Customer.MenuItemOrdered = this.MenuItems[CustomerWantsMenuItemNumber];
// set customer defaults
this.Customer.OrderStep = -1;
this.Customer.isOrderComplete = false;
this.Customer.isCustomerSatisfied = true;
this.Customer.Mood = 'happy';
// customer says something
this.txtCustomer.text = 'I want a ' + this.Customer.MenuItemOrdered.name + '!';
this.picCustomer.loadTexture(game.bmpCustomerHappy);
// display number of satisfied and unsatisfied customers
this.txtCustomerSatisfied.text = '# Satisfied Customers: ' + this.CustomersSatisfied;
this.txtCustomerNotSatisfied.text = '# UnSatisfied Customers: ' + this.CustomersNotSatisfied;
} else {
// display picture of order in-progress
this.plate.loadTexture(this.Customer.MenuItemOrdered.assemblyPictures[this.Customer.OrderStep]);
// is the order complete yet?
if (this.Customer.isOrderComplete) {
// Order is Complete, so next customer will show up in 3 seconds
if (this.game.time.now > this.TimeNextCustomerArrives) {
// time for new customer, so reset customer object
this.Customer.MenuItemOrdered = null;
// clear out customer message
this.txtCustomer.text = '';
}
}
// display customer
if (this.Customer.Mood == 'happy') {
this.picCustomer.loadTexture(game.bmpCustomerHappy);
}
if (this.Customer.Mood == 'bored') {
this.picCustomer.loadTexture(game.bmpCustomerBored);
}
if (this.Customer.Mood == 'mad') {
this.picCustomer.loadTexture(game.bmpCustomerMad);
}
}
},
Add Customer Satisified Flag
In the "playlevel1.js" file, find the CREATEMENU function. Replace the customer object with one below which includes an isCustomerSatisfied flag.
// define customer
this.Customer = {
MenuItemOrdered: null,
OrderStep: -1,
isOrderComplete: false,
isCustomerSatisfied: true,
Mood: 'happy',
Message: ''
};
Identify when customer is not satisfied
In the "playlevel1.js" file, Add the following line of code to each CAUGHT* function whenever Bob gets order wrong.
this.Customer.isCustomerSatisfied = false;
This is how the "caughCheese" function would look like when flag is added.
caughtCheese: function(bob,cheese) {
// is this order pizza?
if (this.Customer.MenuItemOrdered.name == 'pizza') {
if (this.Customer.OrderStep == 1) return;
// does bob have dough?
if (this.Customer.OrderStep > -1) {
this.Customer.OrderStep = 1;
this.Customer.Mood = 'happy';
this.txtCustomer.text = 'That Pizza is looking good!';
} else {
this.Customer.Mood = 'bored';
this.txtCustomer.text = 'Where is my Pizza!';
this.Customer.isCustomerSatisfied = false;
}
} else {
// why did bob catch this? customer not happy
this.Customer.Mood = 'bored';
this.txtCustomer.text = 'OMG, its just a ' + this.Customer.MenuItemOrdered.name;
this.Customer.isCustomerSatisfied = false;
}
},
When order is complete, update score
In the "playlevel1.js" file, find the CAUGHTLETTUCE function. Add the code below right after the line that says "this.Customer.isOrderComplete = true;".
This code will check if the customer was satisfied or not and update the approriate counter by 1.
you will also need to add this line of code to the CAUGHTOLIVE function, which is the last step in our Pizza Order.
// if customer was satisfied, then add one to satisfied count
if (this.Customer.isCustomerSatisfied) {
// note ++ is a short way to write this.CustomersSatisfied = this.CustomersSatisfied + 1
this.CustomersSatisfied++;
} else {
this.CustomersNotSatisfied++;
}
Check if game is over
In the "playlevel1.js" file, replace the UPDATE function with the one below which checks if game is over yet.
// the update function runs continously during each frame of our game
update: function() {
// check to see if this level is over
if (this.ThisLevelIsOverDude) {
// when user press spacebar, show the menu
if (game.input.keyboard.isDown(Phaser.Keyboard.SPACEBAR)) {
game.state.start('menu');
}
// game is over so we don't want anything else to happen after this line
// execute return command to exit out of the update function
return;
}
// call function to check if bob is a winner yet
this.isBobAWinner();
// check if bob collides with the floor
game.physics.arcade.collide(this.bob, this.floorTiles);
game.physics.arcade.overlap(this.bob, this.foodDough.group, this.caughtDough, null, this);
game.physics.arcade.overlap(this.bob, this.foodCheese.group, this.caughtCheese, null, this);
game.physics.arcade.overlap(this.bob, this.foodPepperoni.group, this.caughtPepperoni, null, this);
game.physics.arcade.overlap(this.bob, this.foodOlive.group, this.caughtOlive, null, this);
game.physics.arcade.overlap(this.bob, this.foodTacoShell.group, this.caughtTacoShell, null, this);
game.physics.arcade.overlap(this.bob, this.foodMeat.group, this.caughtMeat, null, this);
game.physics.arcade.overlap(this.bob, this.foodLettuce.group, this.caughtLettuce, null, this);
// call function to capture user input to make bob move
this.makeBobMove();
// make food fall from top of screen
this.displayIngredient(this.foodDough);
this.displayIngredient(this.foodCheese);
this.displayIngredient(this.foodPepperoni);
this.displayIngredient(this.foodOlive);
this.displayIngredient(this.foodLettuce);
this.displayIngredient(this.foodTacoShell);
this.displayIngredient(this.foodMeat);
// call function to create new orders and check progress of existing orders
this.orderManagement();
},
Win or Loose
In the "playlevel1.js" file, Add the isBobWinner function and replace the gameOver and gameWinner functions with code below.
isBobAWinner: function() {
// this function checks if bob has won or lost game yet
// Winner if Bob gets two satisfied customers
if (this.CustomersSatisfied === 2) {
// display winner on screen
this.gameWinner();
}
// Looser if Bob gets two unsatisfied customers
if (this.CustomersNotSatisfied === 4) {
// display game over on screen
this.gameOver();
}
},
gameOver: function() {
// if game is already over, just return out of this function
if (this.ThisLevelIsOverDude) return;
// show GAME OVER on screen
txt = game.add.text(game.world.centerX, game.world.centerY / 3, '', { font: "50pt Courier", fill: "#119f4e", stroke: "#fffff", strokeThickness: 5 });
txt.anchor.set(0.5);
txt.text = 'Game Over';
// this level is over
this.ThisLevelIsOverDude = true;
},
gameWinner: function() {
// if game is already over, just return out of this function
if (this.ThisLevelIsOverDude) return;
// show GAME OVER on screen
txt = game.add.text(game.world.centerX, game.world.centerY / 3, '', { font: "50pt Courier", fill: "#19cb65", stroke: "#fffff", strokeThickness: 10 });
txt.anchor.set(0.5);
txt.text = 'You WON!';
// this level is over
this.ThisLevelIsOverDude = true;
}
Run Game and Check for Errors
Press F12 to check console for any problems.
The isBobAWinner function contains the number of Satisifed customers required to win (2). 4 unsatisifed customers looses game.
code on plnkr