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

Micro-chat (#1425)

Browse Source 
* added microchat tutorial

* animations
This commit is contained in:
Peli de Halleux 2018-10-15 09:19:34 -07:00 committed by GitHub
parent 670a19a9b4
commit 6f281e66df
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 91 additions and 74 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
docs/projects/games.md
View File

@ -13,15 +13,21 @@ Fun games to build with your @boardname@.
"description": "Make the Rock-Paper-Scissors game on your micro:bit and challenge your friends.",
"imageUrl":"/static/mb/projects/a4-motion.png"
}, {
"name": "Magic Button Trick",
"url":"/projects/magic-button-trick",
"description": "Build a magic trick that uses the compass to detect a nearby magnet!",
"imageUrl":"/static/mb/projects/magic-button-trick.png"
"name": "Coin Flipper",
"url":"/projects/coin-flipper",
"description": "Guess the coin toss and see if you're lucky.",
"imageUrl": "/static/mb/projects/coin-flipper.png",
"cardType": "tutorial"
}, {
"name": "Reaction Time",
"url":"/projects/reaction-time",
"description": "Make a reaction time experiment that responds to your body's conductivity!",
"imageUrl":"/static/mb/projects/reaction.jpg"
}, {
"name": "Magic Button Trick",
"url":"/projects/magic-button-trick",
"description": "Build a magic trick that uses the compass to detect a nearby magnet!",
"imageUrl":"/static/mb/projects/magic-button-trick.png"
}, {
"name": "Snap the dot",
"url": "/projects/snap-the-dot",

66
docs/projects/messenger.md
View File

@ -1,66 +0,0 @@
# Messenger
![](/static/mb/projects/a9-radio.png)
Use the radio in an app that sends "YO" messages.
## Step 1
Use ``||input:on button pressed||`` to send the number `0` over radio.
```blocks
input.onButtonPressed(Button.A, () => {
radio.sendNumber(0);
});
```
## Step 2
Use ``||radio:on data packet received||`` display "YO" when the number ``0`` is received
by radio.
```blocks
let message = 0;
radio.onDataPacketReceived(({ receivedNumber }) => {
message = receivedNumber;
if (message == 0) {
basic.showString("YO")
}
})
```
Download the program to one @boardname@ and then to another. Press button **A** on one and see if the other gets a message.
## Step 3
Use ``||input:on button pressed||`` to send the number `1` over radio.
```blocks
input.onButtonPressed(Button.B, () => {
radio.sendNumber(1);
});
```
## Step 4
Add blocks in ``||radio:on data packet received||`` to display "BYE" when the number ``1`` is received
by radio.
```blocks
let message = 0;
radio.onDataPacketReceived(({ receivedNumber }) => {
message = receivedNumber;
if (message == 0) {
basic.showString("YO")
}
if (message == 1) {
basic.showString("BYE")
}
})
```
Download the program to the @boardname@s again and try your messenger!
```package
radio
```

77
docs/projects/micro-chat.md Normal file
View File

@ -0,0 +1,77 @@
# Micro Chat
## Introduction @unplugged
![Two @boardname@ connected via radio](/static/mb/projects/a9-radio.png)
Use the **radio** to send and receive messages with other @boardname@.
## Sending a message @fullscreen
Use ``||input:on button pressed||`` to send a number over radio with ``||radio:send string||``.
All @boardname@ nearby will receive this message.
You can also add ``||basic:show icon||`` and ``||basic:clear screen||`` blocks to show a little animation when the message is sent.
```blocks
input.onButtonPressed(Button.A, () => {
radio.sendString("Yo");
basic.showIcon(IconNames.Chessboard)
basic.clearScreen();
});
```
## Receiving a message @fullscreen
Add a ``||radio:on received number||`` block to run when a message is received.
```blocks
radio.onReceivedString(function (receivedString) {
})
```
## Displaying text @fullscreen
Add a ``||basic:show string||`` to display the string on the screen. You will find the ``receivedString`` variable
under the **Variables** toolbox.
```blocks
radio.onReceivedString(function (receivedString) {
basic.showString(receivedString);
})
```
## Testing in the simulator @fullscreen
Press button **A** on the simulator, you will notice that a second @boardname@ appears (if your screen is too small, this might not happen). Try pressing **A** again and notice that the "Yo" message gets displayed on the other @boardname@
```blocks
input.onButtonPressed(Button.A, () => {
radio.sendString("Yo");
basic.showIcon(IconNames.Chessboard)
basic.clearScreen();
});
radio.onReceivedString(function (receivedString) {
basic.showString(receivedString);
})
```
## Try it for real @fullscreen
If you have @boardname@s, download the program to two @boardname@. Press button **A** on one and see if the other gets a message.
## Groups @fullscreen
Use the ``||radio:set group||`` block to assign a **group** number to your program. You will only receive messages from @boardname@ within the same group. Use this to avoid receiving messages from all the other @boardname@.
```blocks
/**
* Pick a unique group in your classroom!
*/
radio.setGroup(123)
```
```package
radio
```

8
docs/tutorials.md
View File

@ -38,10 +38,10 @@ Here are some cool tutorials to get you started with your @boardname@!
"imageUrl":"/static/mb/projects/a3-pins.png",
"cardType": "tutorial"
}, {
"name": "Coin Flipper",
"url":"/projects/coin-flipper",
"description": "Guess the coin toss and see if you're lucky.",
"imageUrl": "/static/mb/projects/coin-flipper.png",
"name": "Micro Chat",
"url":"/projects/micro-chat",
"description": "Build your own social network made of @boardnames.",
"imageUrl": "/static/mb/projects/a9-radio.png",
"cardType": "tutorial"
}]
```