Your finished game should include the following features:
- Allows keyboard arrow keys, touchscreen, and computer mouse to navigate in normal directions.
- A Droid character that captures at least three or more other characters.
- Plays sound when capturing other characters.
- Accumulates points and removes points when capturing specific characters.
- Notifies the user they have lost when reaching 0 points.
- Notifies the user they have won based on a specific number of points.
- Plays applause when they have won.
The instructor's game looks like this:
C-3PO wins 300.
Your game will look different.
Remember these JavaScript writing conventions:
- JavaScript is case-sensitive.
- camelCase Most function names are typed in camel-case, which starts with lowercase letters for the first word, then uppercase for the second word.
- ; Semicolons belong at the end of each line command.
- Commands are nested inside parenthesis () and/or curly braces {}. They must close ({}).
- Use the //comments, so you know what section of code is doing what.
- To avoid confusion, ctlc copy and ctrlv paste the green code (below) in order...and follow all instructions.
6.6.3 Code winning and losing by total points.
Start a new game by clicking the Start Over button,
so that your previous game code does not interfere with your new code.
In the Show Text mode of the Workspace (not Blocks),
delete the extisting code, then add and modify the following code to make your game more complex.
Ignore warning flags until you get all the code added to your workspace.
- Start by adding comments to the first two lines of the code.
(Two slashes // in front of any line of code in JavaScript will allow you to make notes without breaking the code.)
Type // in front of your name and the year.
On the second line add // and the name of your game. Revise the game's name once you finish it; you might change your mind!
The first two lines of code will look like this (replace the text between [ and ]):
// First Last Name 2022
// [Droid Name] Helps [Another Character] do [something] on [this planet or ship] to win [this many] points.
-
Define what the world will look like...which background and map do you want to use?
Start by adding a comment about this section of the code, then define the two options.
Set the Background to one of these choices: Endor, Hoth, Starship, or a random set of those three.
Set the Map to one of these choices: blank, circle, horizontal, grid, blobs, or blank,
like this:
// Design the world
setBackground("__");
setMap("__");
Replace the __ between quote marks with the names of the Background and Map.
-
Define which Droid will be your player character; either R2-D2 (the short one) or C-3PO (the tall one).
Add a comment about this section of the code, then
set the Droid, its starting speed, and its sound.
The Speed can be: slow, normal, random, or fast.
The Sound choices are many...use the code editor popup to make a choice:
// Define my character
setDroid("__");
setDroidSpeed("__");
playSound("__");
Replace the __ between quote marks with the names of your choices.
- Initialize a variable. So that the game will allow you to win or lose based on points
(rather than by capturing specific characters),
define a Variable that will set/initialize the total score to 0,
like this:
// Set initial score to zero.
var totalScore=0;
Variables are always defined above Functions that use them.
- Define which way your arrow keys, mouse, and screen touches will go,
like this:
// Define normal directional movements.
function whenUp() {
goUp();
}
function whenDown() {
goDown();
}
function whenLeft() {
goLeft();
}
function whenRight() {
goRight();
}
Only normal movements will earn full points...don't switch up the directions to create confusion.
-
Define a For loop that captures and avoids characters.
Start by adding a comment about this section of code,
then define a Variable to set each character index to 0.
Set the number of starting characters to 3 or more. Any less, and the Droid may not enough characters to capture before reaching the goal.
Finish the For initializations by adding 1 to the index.
Then, inside the For loop, add characters to capture and avoid.
The characters can be: MouseDroid, Mynock, Probot, PufferPig, RebelPilot, Stormtrooper, or Tauntaun.
// Define a loop to set the number of starting characters.
for (
var i=0; // Set each character index to zero.
i < __; // Set the quantity of each starting character.
i++ // Add to the index.
) { // Close the loop and add some characters.
addCharacter("__"); // Character to avoid.
addCharacter("__"); // Character to capture.
}
Replace the __ for i with a number of 3 or more.
Replace the __ between quote marks with the names of your character choices.
- Define a Function that determines what happens when the wrong character is captured
and/or the game player loses all of the points.
Start by adding a comment about this section of code,
then choose which character determines the removal of points and total score reduction.
Add more characters to encourage more game play.
And, finally, add an If statement that checks to see if the total score is 0.
If so, then the game ends with a message and sound, like this:
// When accidentally capturing [this character], add [this character] and [this character],
// remove [number] points.
// Lose game if you reach zero points.
function whenGetRebelPilot() {
removePoints(__);
totalScore-=__; // Use the same value as removePoints.
addCharacter ("__");
addCharacter ("__");
if(totalScore<=-0){ // Total losing score.
endGame("lose");
playSound("__");
}
}
Replace the __ between quote marks with the
number of points,
names of your character choices,
and name of the sound to play when losing.
Also update the comments to reflect the decisions you made in the code.
- Define 3 or more functions that determine what happens when the
the right characters are captured.
How many points to they earn?
What sounds do they play?
Do they add more characters?
- Start by adding a comment about this section of code.
// Make THREE or more functions with different values.
// Add number of points, add those points to the total, play sound, and add a character.
// If the winning score is reached, display winning message and play applause.
// Define the winning score in the first function and repeat it in the next two or more functions.
- Choose which character the first function is about and
add points,
total the score,
play a sound, and
add a new character,
like this:
function whenGet__() {
addPoints(__);
totalScore+=__; // Use the same value as addPoints.
playSound("__");
addCharacter ("__");
- Before closing the Function with }, add an If statement about winning.
Specify the number of points needed to win, provide the game ending message, and play a new sound,
like this:
if(totalScore>=__){
endGame("win");
playSound("__"); // Add 'applause' sound.
}
}
A good choice for the winning sound is "applause".
Replace the __ between quote marks with the
names of your character choices,
number of points,
and sounds.
Also update the comments to reflect the decisions you made in the code.
- Copy that entire first GetCharacter function (ten lines of code plus comments), paste it below,
and modify it to represent different characters, sounds, and points/totals.
- Copy the GetCharacter function again, paste it below,
and modify it to represent different characters, sounds, and points/totals.
- Repeat that process to include more characters, if you like.
- Two other events and commands you may add to previous functions include touching and speed:
function whenTouchObstacle() {
moveFast(); // or moveSlow(), or moveNormal();
}
- Test your game and troubleshoot problems:
- Run the code to test each var, for, function, and if statement.
- Do you have yellow or red warning messages beside the code?
If so, then troubleshoot by looking for typos and comparing your work to the example code above.
- Did you forget to replace text placeholders __ with a number or name?