Rock Paper Scissors

Introduction @unplugged

Use the accelerometer and the screen to build a Rock Paper Scissors game that you can play with your friends!

Step 1 @fullscreen

Add a ||input:on shake|| block to run code when when you shake the @boardname@.

input.onGesture(Gesture.Shake, () => {
    
})

Step 2 @fullscreen

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 and store it in the variable named tool.

let tool = 0;
input.onGesture(Gesture.Shake, () => {
    tool = Math.randomRange(0, 2)
})

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

Place an ||logic:if|| block under the ||math:pick random|| and check whether tool is equal to 0.

Add a ||basic:show leds|| block that shows a picture of a piece of paper. The number 0 will mean paper.

let tool = 0;
input.onGesture(Gesture.Shake, () => {
    tool = Math.randomRange(0, 2)
    if (tool == 0) {
        basic.showLeds(`
            # # # # #
            # . . . #
            # . . . #
            # . . . #
            # # # # #
            `)
    }
})

Step 4 @fullscreen

Click on the SHAKE button in the simulator. If you try enough times, you should see a picture of paper on the screen.

Step 5 @fullscreen

Click the + button to add an ||logic:else|| section.

Step 6 @fullscreen

Add a ||basic:show leds|| block inside the ||logic:else||. Make a picture of a scissors in the LEDs.

let tool = 0;
input.onGesture(Gesture.Shake, () => {
    tool = Math.randomRange(0, 2)
    if (tool == 0) {
        basic.showLeds(`
            # # # # #
            # . . . #
            # . . . #
            # . . . #
            # # # # #
            `)
    } else {
        basic.showLeds(`
            # # . . #
            # # . # .
            . . # . .
            # # . # .
            # # . . #
            `)
    }
})

Step 7 @fullscreen

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!

Step 8 @fullscreen

Get one more ||basic:show leds|| block and put it in the ||logic:else if||. Make a picture of a rock in the LEDs.

let tool = 0;
input.onGesture(Gesture.Shake, () => {
    tool = Math.randomRange(0, 2)
    if (tool == 0) {
        basic.showLeds(`
            # # # # #
            # . . . #
            # . . . #
            # . . . #
            # # # # #
            `)
    } else if (tool == 1) {
        basic.showLeds(`
            . . . . .
            . # # # .
            . # # # .
            . # # # .
            . . . . .
            `)
    } else {
        basic.showLeds(`
            # # . . #
            # # . # .
            . . # . .
            # # . # .
            # # . . #
            `)
    }
})

Step 9 @fullscreen

Click on the SHAKE button in the simulator and check to see that each image is showing up.

Step 10 @fullscreen

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!

4.0 KiB Raw Blame History