c_meyer/pxt-calliope
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Edits and fixes for 'Rock Paper Scissors' (#1445)

Browse Source
This commit is contained in:
Galen Nickel 2018-10-16 17:57:26 -07:00 committed by Peli de Halleux
parent 5a03f09a5f
commit 62f30624b9
1 changed files with 16 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

37
docs/projects/rock-paper-scissors.md
View File

@ -4,7 +4,7 @@
![Cartoon of the Rock Paper Scissors game](/static/mb/projects/a4-motion.png) ![Cartoon of the Rock Paper Scissors game](/static/mb/projects/a4-motion.png)
Use the accelerometer and the screen to build a **Play Rock Paper Scissors** Use the accelerometer and the screen to build a **Rock Paper Scissors** game
that you can play with your friends! that you can play with your friends!
## Step 1 @fullscreen ## Step 1 @fullscreen
@ -22,7 +22,7 @@ input.onGesture(Gesture.Shake, () => {
Add a ``tool`` variable to store a random number computed with ``||math:pick random||``. Add a ``tool`` variable to store a random number computed with ``||math:pick random||``.
When you shake the @boardname@, it should pick a random number from `0` to `2` When you shake the @boardname@, it should pick a random number from `0` to `2`
and store it in the variable `tool`. and store it in the variable named ``tool``.
```blocks ```blocks
let tool = 0; let tool = 0;
@ -32,20 +32,18 @@ input.onGesture(Gesture.Shake, () => {
``` ```
In a later step, each of the possible numbers (`0`, `1`, or `2`) is matched to its own picture. The picture is shown on the LEDs when its number is picked. In a later step, each of the possible numbers (`0`, `1`, or `2`) is matched to its own picture. The picture is shown on the LEDs when its matching number is picked.
## Step 3 @fullscreen ## Step 3 @fullscreen
Place an ``if`` block under the ``||math:pick random||`` and Place an ``||logic:if||`` block under the ``||math:pick random||`` and check whether ``tool`` is equal to ``0``.
check whether ``tool`` is equal to ``0``.
Add a ``||basic:show leds||`` block that shows a Add a ``||basic:show leds||`` block that shows a picture of a piece of paper. The number `0` will mean paper.
picture of a piece of paper.
```blocks ```blocks
let tool = 0; let tool = 0;
input.onGesture(Gesture.Shake, () => { input.onGesture(Gesture.Shake, () => {
tool = Math.randomRange(0, 3) tool = Math.randomRange(0, 2)
if (tool == 0) { if (tool == 0) {
basic.showLeds(` basic.showLeds(`
# # # # # # # # # #
@ -60,25 +58,24 @@ input.onGesture(Gesture.Shake, () => {
## Step 4 @fullscreen ## Step 4 @fullscreen
Click on the **SHAKE** button in the simulator. If you try enough times, you should see Click on the **SHAKE** button in the simulator. If you try enough times, you should see a picture of paper on the screen.
the paper drawing.
![Shaking a @boardname@ simulator](/static/mb/projects/rock-paper-scissors/rpsshake.gif) ![Shaking a @boardname@ simulator](/static/mb/projects/rock-paper-scissors/rpsshake.gif)
## Step 5 @fullscreen ## Step 5 @fullscreen
Click the ``+`` button to add an ``else`` section. Click the ``+`` button to add an ``||logic:else||`` section.
![Adding an else clause](/static/mb/projects/rock-paper-scissors/ifelse.gif) ![Adding an else clause](/static/mb/projects/rock-paper-scissors/ifelse.gif)
## Step 6 @fullscreen ## Step 6 @fullscreen
Add a ``||basic:show leds||`` block that shows a scissor. Add a ``||basic:show leds||`` block inside the ``||logic:else||``. Make a picture of a scissors in the LEDs.
```blocks ```blocks
let tool = 0; let tool = 0;
input.onGesture(Gesture.Shake, () => { input.onGesture(Gesture.Shake, () => {
tool = Math.randomRange(0, 3) tool = Math.randomRange(0, 2)
if (tool == 0) { if (tool == 0) {
basic.showLeds(` basic.showLeds(`
# # # # # # # # # #
@ -101,19 +98,18 @@ input.onGesture(Gesture.Shake, () => {
## Step 7 @fullscreen ## Step 7 @fullscreen
Click the ``+`` button to add an ``else if`` section. Click the ``+`` button again to add an ``||logic:else if||`` section. Now, add a conditional block for ``||logic:tool = 1||`` to the condition in ``||logic:else if||``. Since ``tool`` can only be `0`, `1`, or `2`, your code is covering all possible cases!
Since ``tool`` can only be ``0``, ``1`` or ``2``, your code is covering all possible cases!
![Adding an else if clause](/static/mb/projects/rock-paper-scissors/ifelseif.gif) ![Adding an else if clause](/static/mb/projects/rock-paper-scissors/ifelseif.gif)
## Step 8 @fullscreen ## Step 8 @fullscreen
Add a ``||basic:show leds||`` block with a picture of scissors to the ``else`` part. Get one more ``||basic:show leds||`` block and put it in the ``||logic:else if||``. Make a picture of a rock in the LEDs.
```blocks ```blocks
let tool = 0; let tool = 0;
input.onGesture(Gesture.Shake, () => { input.onGesture(Gesture.Shake, () => {
tool = Math.randomRange(0, 3) tool = Math.randomRange(0, 2)
if (tool == 0) { if (tool == 0) {
basic.showLeds(` basic.showLeds(`
# # # # # # # # # #
@ -140,18 +136,17 @@ input.onGesture(Gesture.Shake, () => {
`) `)
} }
}) })
``` ```
## Step 9 @fullscreen ## Step 9 @fullscreen
Click on the **SHAKE** button in the simulator and check each image is showing up. Click on the **SHAKE** button in the simulator and check to see that each image is showing up.
![Shaking a @boardname@ simulator](/static/mb/projects/rock-paper-scissors/rpssim3.gif) ![Shaking a @boardname@ simulator](/static/mb/projects/rock-paper-scissors/rpssim3.gif)
## Step 10 @fullscreen ## Step 10 @fullscreen
If you have a @boardname@, click on ``|Download|`` and follow the instruction to get the code If you have a @boardname@, click on ``|Download|`` and follow the instructions to get the code
onto your @boardname@. Your game is ready! Gather your friends and play Rock Paper Scissors! onto your @boardname@. Your game is ready! Gather your friends and play Rock Paper Scissors!
![A @boardname@ in a hand](/static/mb/projects/rock-paper-scissors/hand.jpg) ![A @boardname@ in a hand](/static/mb/projects/rock-paper-scissors/hand.jpg)