converting popular projects into tutorials (#534)

This commit is contained in:
Peli de Halleux
2017-09-11 10:49:40 -07:00
committed by GitHub
parent 036b191f29
commit 7d91f979e6
6 changed files with 179 additions and 311 deletions

View File

@ -1,29 +1,18 @@
# smiley buttons
## ~avatar
Use buttons to show a smiley face!
## ~
# Smiley Buttons
## Step 1
Use [show leds](/reference/basic/show-leds) to make a smiley face:
Place a ``||input:on button pressed||`` block to run code when button **A** is pressed.
```blocks
basic.showLeds(`
# # . # #
# # . # #
. . . . .
# . . . #
. # # # .`
);
input.onButtonPressed(Button.A, () => {
});
```
## Step 2
Add an input block for when [button A is pressed](/reference/input/button-is-pressed),
and **move** the smiley face inside it:
Place a ``||basic:show leds||`` block inside ``||input:on button pressed||``
to display a smiley on the screen.
```blocks
input.onButtonPressed(Button.A, () => {
@ -37,23 +26,16 @@ input.onButtonPressed(Button.A, () => {
});
```
Try pressing button A!
## Step 3
Add blocks so that when [button B is pressed](/reference/input/on-button-pressed),
a frowney appears:
Click ``|Download|`` to transfer your code in your @boardname@ and try pressing button **A**.
## Step 4
Add ``||input:on button pressed||`` and ``||basic:show leds||`` blocks to
display a frowney when button **B** is pressed.
```blocks
input.onButtonPressed(Button.A, () => {
basic.showLeds(`
# # . # #
# # . # #
. . . . .
# . . . #
. # # # .`
);
});
input.onButtonPressed(Button.B, () => {
basic.showLeds(`
# # . # #
@ -65,43 +47,17 @@ input.onButtonPressed(Button.B, () => {
});
```
Try pressing ``A`` or ``B``!
## Step 5
## Step 4
Click ``|Download|`` to transfer your code in your @boardname@ and try pressing button A or B.
You can also have a secret mode where ``A`` and ``B`` are pressed together.
## Step 6
Add a secret mode where ``A`` and ``B`` are pressed together.
In that case, add multiple ``||basic:show leds||`` blocks to create an animation...
```blocks
input.onButtonPressed(Button.AB, () => {
basic.showLeds(`
. . . . .
. # . # .
. . . . .
# . . . #
. # # # .
`)
basic.showLeds(`
. . . . .
. # . # .
. . . . .
# # # # #
. . . . .
`)
basic.showLeds(`
. . . . .
. # . # .
. . . . .
. # # # .
# . . . #
`)
basic.showLeds(`
. . . . .
. # . # .
. . . . .
# # # # #
. . . # #
`)
basic.showLeds(`
. . . . .
# . # . .
@ -119,48 +75,8 @@ input.onButtonPressed(Button.AB, () => {
})
```
## Send your smileys over radio
## Step 7
Do you have a second @boardname@ at hand? You could use radio and send your smileys or frownies to other
@boardname@.
Click ``|Download|`` to transfer your code in your @boardname@
and show it off to your friends!
Since radio can send numbers, we decide that ``0`` is the code for displaying a smiley
and ``1`` is the code for a frowney.
Change your code as follows:
* [radio send number](/reference/radio/send-number) sends a number
to any other @boardname@ in range
* [radio on data packet received](/reference/radio/on-data-packet-received) runs code
when data is received over radio
```blocks
input.onButtonPressed(Button.A, () => {
radio.sendNumber(0)
})
input.onButtonPressed(Button.B, () => {
radio.sendNumber(1)
})
radio.onDataPacketReceived(({receivedNumber}) => {
if (receivedNumber == 0) {
basic.showLeds(`
# # . # #
# # . # #
. . . . .
# . . . #
. # # # .
`)
} else {
basic.showLeds(`
# # . # #
# # . # #
. . . . .
. # # # .
# . . . #
`)
}
})
```
```package
radio
```