pxt-arcade 1.13.11 → 1.13.13

package/docs/recipes/shark-splash/04-background.md

@@ -138,7 +138,7 @@ scene.setBackgroundImage(img`
 
 ## {Decorative sprites}
 
-Next, let's add some sprites to decorate your game. From ``||loops:Loops||``, drag the ``||loops:for index from||`` block into ``||loops:on start|`` and set the ``||variables:index||`` range to `10`.
+Next, let's add some sprites to decorate your game. From ``||loops:Loops||``, drag the ``||loops:for index from||`` block into ``||loops:on start|`` and set the ``||variables(noclick):index||`` range to `10`.
 
 ```blocks
 scene.setBackgroundImage(img`
@@ -269,7 +269,7 @@ for (let index = 0; index <= 10; index++) {
 
 ## {Add background sprite}
 
- From ``||sprites:Sprites||``, drag the ``||variables:set mySprite to||`` block into ``||loops:for index from 0 to 10|``. Click on the grey box and in the image editor gallery, select a background object like a rock or some seaweed.
+ From ``||sprites:Sprites||``, drag the ``||variables(sprites):set mySprite to||`` block into ``||loops:for index from 0 to 10|``. Click on the grey box and in the image editor gallery, select a background object like a rock or some seaweed.
 
 ```blocks
 scene.setBackgroundImage(img`
@@ -634,7 +634,7 @@ for (let index = 0; index <= 10; index++) {
 
 ## {Update sprite x-position}
 
-From ``||math:Math||``, drag the ``||math:0 x 0||`` block in as the ``||sprites:x||`` value of ``||sprites:set mySprite position||``. Change the first number to `16`, and drag the ``||variables:index||`` block for the second number. Continue adding decorations until you are satisifed with your scene!
+From ``||math:Math||``, drag the ``||math:0 x 0||`` block in as the ``||sprites:x||`` value of ``||sprites:set mySprite position||``. Change the first number to `16`, and drag the ``||variables(noclick):index||`` block for the second number. Continue adding decorations until you are satisifed with your scene!
 
 ```blocks
 scene.setBackgroundImage(img`

package/docs/recipes/side-scroller/02-create-car.md

@@ -8,7 +8,7 @@ Create motion sprite to move a race car along a race track tilemap.
 
 ## {Step 1 - Create a player sprite}
 
-From the ``||sprites:Sprites||`` Toolbox drawer, drag a ``||variables:set mySprite||`` block into the ``||loops:on start||`` block after the ``||scene:set tilemap||`` block.
+From the ``||sprites:Sprites||`` Toolbox drawer, drag a ``||variables(sprites):set mySprite||`` block into the ``||loops:on start||`` block after the ``||scene:set tilemap||`` block.
 
 ```blocks
 scene.setBackgroundColor(6)
@@ -64,7 +64,7 @@ let mySprite = sprites.create(img`
 
 Let’s add code to simulate gravity pulling our car down. We can do this by adding an acceleration force to our car.
 
-From the ``||sprites:Sprites||`` Toolbox drawer, drag a ``||sprites:set mySprite x to 0||`` block and drop after the ``||variables:set mySprite||`` block.
+From the ``||sprites:Sprites||`` Toolbox drawer, drag a ``||sprites:set mySprite x to 0||`` block and drop after the ``||variables(sprites):set mySprite||`` block.
 
 ## {Step 4 - Set acceleration}
 

package/docs/skillmaps.md

@@ -21,6 +21,8 @@
   "description": "Code a text-based adventure game using your own images, storyline, and music score!",
   "imageUrl": "/static/skillmap/backgrounds/adventure-map.png",
   "url": "https://arcade.makecode.com/--skillmap#adventure",
+  "label": "Limited time only",
+  "labelClass": "purple ribbon",
   "directOpen": true
 },
 {

package/docs/test/skillmap/dino/dino3.md

@@ -37,6 +37,7 @@ forever(function () {
 ```
 and drop it into an empty area of the workspace.
 
+
 - :paint brush:  Click the empty box in the <br/>
 ``||sprites:projectile [ ] from side||`` <br/>
 block for ``||variables(noclick):tourist||``

package/docs/test/skillmap/racer/racer1.md

@@ -11,36 +11,68 @@ In this tutorial, you'll add a truck to your game and make it move through a cav
 
 
 
-## {4. Add the Truck}
+## {2. Add the Truck}
 
-First, let's set up your monster truck. To do this, we'll need to create a [__*sprite*__](#sprote "a 2-D image that moves on the screen").
+Before we can add a truck, we need to create a [__*sprite*__](#sprote "a 2-D image that moves on the screen").
+
+~hint What's a sprite? 💡
 
 ---
 
-- :paper plane:  From the ``||sprites:Sprites||`` category, drag <br/>
+In Arcade, each character or image that does something is called a **SPRITE**.
+
+Sprites have properties that you can use and change -- things like scale, position, and lifespan are all properties of sprites.
+
+Our truck will be a sprite, too.
+
+hint~
+
+- :paper plane:  From the ``||sprites:Sprites||`` category, drag<br/>
+``||variables(sprites):set [truck] to sprite [ ] of kind [Player]||``<br/>
+to **the end** of the empty<br/>
+``||loops(noclick):on start||`` <br/>
+container in the workspace.
+
 
+~hint What does that mean? 🤷🏽
+
+---
+
+In this tutorial, we'll use formatted text to help you know which blocks you need. For example, when we ask you to look for: <br/>
+``||variables(sprites):set [truck] to sprite [ ] of kind [Player]||``<br/>
+we're talking about this block:<br/>
 ```block
 let truck = sprites.create(img`.`, SpriteKind.Player)
 ```
-to **the end** of the <br/>
-``||loops:on start||`` <br/>
-container.
+Need help finding the category? Click on the highlighted text and we'll open the drawer for you.
 
-- :paint brush:  To choose a truck, click the empty grey box to display the image editor, then select **My Assets**.
+hint~
 
-![Choose a truck sprite](/static/skillmap/racer/truck2.png "Choose a truck image from the gallery")
 
-_💡 This image shows the **truck2** sprite, but you can use whichever one you want._
+#### ~ tutorialhint
 
----
+```blocks
+// @highlight
+let truck = sprites.create(img`.`, SpriteKind.Player)
+```
 
-~hint Click here to see how 🕵🏽
 
-![Set your sprite](/static/skillmap/racer/pick-truck.gif "Choose your image from the gallery")
 
-hint~
 
-- :mouse pointer: When you're ready to continue, click **Next**.
+## {3. Add the Truck}
+
+**Choose your truck**
+
+- :paint brush:  To choose a truck, click the empty box inside<br/>
+``||variables(noclick):set [truck] to sprite [ ] of kind [Player]||``<br/>
+then switch to **My Assets**
+![Switch to My Assets](/static/skillmap/assets/my-assets-three.png " ")
+and choose a truck.<br/><br/>
+_💡 This image shows the **truck2** sprite, but you can use whichever truck you want._
+![Choose a truck sprite](/static/skillmap/racer/truck2.png "Choose a truck image from the gallery")
+
+
+
 
 #### ~ tutorialhint
 
@@ -51,38 +83,39 @@ let truck = sprites.create(assets.image`truck2`, SpriteKind.Player)
 
 
 
+
+## {Step 4}
+
+- :binoculars: Take a look at the game window.
+
+Do you see the truck hovering in the cave?
+
+
+![Look at your game in the game window](/static/skillmap/star/game-window.png )
+
+
+
+
 ## {5. Add Gravity}
 
-To make the game feel more realistic, it needs gravity.
+To get your game going, it needs gravity.
 
 ~hint How do I add gravity? 📥
 
+---
+
 For gravity, we'll add [__*acceleration*__](#accel "increased speed in a direction")
-to "pull down" on the sprite. This is done by setting the sprite's vertical
-acceleration, **ay**, value.
+to "pull down" on the sprite. This is done by setting the sprite's **ay** (acceleration in the direction of 'y').
 
 hint~
 
----
 
 - :paper plane:  From the ``||sprites:Sprites||`` category, drag <br/>
-
-```block
-let truck: Sprite = null
-truck.ay = 500
-```
+``||sprites:set [truck] [ay (acceleration y) to [500]||``<br/>
 to **the end** of the <br/>
-``||loops:on start||`` container.
-
----
+``||loops(noclick):on start||`` container.
 
-~hint Click here to see how 🕵🏽
 
-![Set the gravity](/static/skillmap/racer/acceleration.gif "Choose ay(acceleration y)")
-
-hint~
-
-- :mouse pointer: When you're ready to continue, click **Next**.
 
 ```blockconfig.local
 let truck: Sprite = null
@@ -92,8 +125,6 @@ truck.ay = 500
 #### ~ tutorialhint
 
 ```blocks
-tiles.setTilemap(tilemap`level1`)
-scene.setBackgroundImage(assets.image`background`)
 let truck = sprites.create(assets.image`truck1`, SpriteKind.Player)
 // @highlight
 truck.ay = 500
@@ -101,17 +132,13 @@ truck.ay = 500
 
 
 
-## {6. Take a Look!}
 
-Click back to the game window to see how everything is coming together.
+## {Step 6}
 
----
+- :binoculars: Look at the game window again.
 
-The truck should drop to the ground inside the cave.
+Did the truck fall to the ground?
 
----
-
-- :mouse pointer: When you're ready to continue, click **Next**.
 
 
 
@@ -119,32 +146,21 @@ The truck should drop to the ground inside the cave.
 
 In this game, your truck needs to start rolling as soon as the game starts.
 
-~hint How do I make the truck move? 🚚
-
-To make the truck move, you need to set its **vx** or _horizontal velocity_ (speed from side to side).
-
-hint~
+~hint How do I make it move? 🛻
 
 ---
 
-- :paper plane:  Drag a new <br/>
+To make the truck move to the right, you need to set its **vx** (velocity in the direction of 'x') to a positive number.
 
-```block
-let truck: Sprite = null
-truck.vx = 100
-```
-to **the end** of the <br/>
-``||loops:on start||`` container.
-
----
+hint~
 
-- :mouse pointer: When you're ready to continue, click **Next**.
 
-~hint Click here to see how 🕵🏽
+- :paper plane:  From ``||sprites:Sprites||``, drag<br/>
+``||sprites:set [truck] [vx (velocity x)] to [100]||``<br/>
+to **the end** of the <br/>
+``||loops(onclick):on start||`` container.
 
-![Set the speed](/static/skillmap/racer/velocity.gif "Choose vx(velocity x)")
 
-hint~
 
 ```blockconfig.local
 let truck: Sprite = null
@@ -160,37 +176,28 @@ truck.ay = 500
 truck.vx = 100
 ```
 
-## {8. Try It!}
 
-Open the game window again and check out the game you have so far.
 
-Notice that the **arrow** keys and **(A)** button don't work yet.
-The game only does what you've coded it to do.
+## {Step 8}
+
+- :binoculars: Look at the game window again and watch your truck mosey.
 
----
 
-- :mouse pointer: When you're ready to continue, click **Next**.
 
 
 ## {9. Follow that Sprite}
 
-Did you notice that your truck quickly drives off-screen?
+**Did you notice that your truck drives off-screen?**
 
-Let's make the "camera" follow the sprite so you can always see it.
+Let's make the game "camera" follow the sprite so you can always see it.
 
 ---
 
 - :tree:  To keep the truck in sight, go to ``||scene:Scene||`` and drag <br/>
-
-```block
-scene.cameraFollowSprite(truck)
-```
+``||scene:camera follow sprite [truck]||``<br/>
 to **the end** of the <br/>
-``||loops:on start||`` container.
-
----
+``||loops(noclick):on start||`` container.
 
-- :mouse pointer: When you're ready to continue, click **Next**.
 
 
 #### ~ tutorialhint
@@ -207,11 +214,13 @@ scene.cameraFollowSprite(truck)
 
 ## {Finale}
 
-Well done!
+**✨Woohoo!✨**
+
+Take a look at what you've done so far.
 
-Take a look at the experience that you've created so far. Your truck should start rolling as soon as the game loads and keep going until it gets to the end of the first pit!
+Your truck should start rolling as soon as the game loads and keep going until it gets to the end of the first pit!
 
-When you're ready, click **Done** to head back out to the skillmap where you can play the next level to find out how to control your truck with arrows and buttons!
+When you're ready, click **Done** to head back out to the skillmap and keep going to find out how to control your truck with arrows and buttons!
 
 
 ```blockconfig.global

package/docs/test/skillmap/racer/racer2.md

@@ -12,7 +12,7 @@ Now that you have a truck that moves, let's add the ability to jump and navigate
 
 ## {2. Remember}
 
-Take a look at the code that's already in your workspace.
+**Take a look at the code that's already in your workspace.**
 
 You should see the blocks that add gravity, make your truck start moving, and set the camera to follow you through the cave.
 
@@ -21,30 +21,20 @@ You should see the blocks that add gravity, make your truck start moving, and se
 
 ## {3. Make the Jump}
 
-You'll notice some pits of acid in the road. Help your truck avoid them when you press the (A) button.
+**See the pits of acid in the road?**
+
+Make your truck avoid them when you press the (A) button (or space bar).
 
 ---
 
 
-- :game: From ``||controller:Controller||``, drag the <br/>
+- :game: From ``||controller:Controller||``, drag the<br/>
+``||controller:on [A] button [pressed]||``<br/>
+bundle into an **empty area** of the workspace.
 
-```block
-let truck: Sprite = null
 
-controller.A.onEvent(ControllerButtonEvent.Pressed, function () {
-    truck.vy = 0
-})
-```
-container into an empty area of the workspace.
+Now, each time you press the (A) button, the truck will jump until gravity pulls it back down.
 
-- :mouse pointer: Change **0** to **-200** to send the truck upward with each press of the (A) button.
-
-```blockconfig.local
-let truck: Sprite = null
-controller.A.onEvent(ControllerButtonEvent.Pressed, function () {
-    truck.vy = 0
-})
-```
 
 #### ~ tutorialhint
 
@@ -57,41 +47,27 @@ controller.A.onEvent(ControllerButtonEvent.Pressed, function () {
 ```
 
 
+## {Step 4}
 
-## {4. Play it Again}
-
-Remember to play your game again each time you make a change.
-
-Can you see the effects of the code you just wrote?
-
+- :binoculars: Remember to keep looking back at the game window to see how your game changes with each bit of code you add.
 
 
 
 ## {5. The Pits}
 
 
-Now that you can jump the pits, let's make them dangerous.
+**Now that you can jump the pits, let's make them dangerous.**
 
 ---
 
 - :tree: From ``||scene:Scene||``, drag the <br/>
+``||scene:on [sprite] of kind [Player] overlaps [ ] at [location]||``<br/>
+bundle into an **empty area** of the workspace.
 
-```block
-scene.onOverlapTile(SpriteKind.Player, assets.tile`acid`, function (sprite, location) {
-    game.over(false)
-})
-```
-container into an empty area of the workspace.
-
-- :paint brush: Click the checkerboard image and change it to the **acid** tile.<br/>
+- :paint brush: Click the empty tile image and change it to the **acid** tile.<br/>
 ![Make your truck jump dangerous pits of acid](/static/skillmap/racer/acid.png "Avoid the acid tiles")
 
 
-```blockconfig.local
-scene.onOverlapTile(SpriteKind.Player, img`.`, function (sprite, location) {
-    game.over(false)
-})
-```
 
 #### ~ tutorialhint
 
@@ -105,21 +81,21 @@ scene.onOverlapTile(SpriteKind.Player, assets.tile`acid`, function (sprite, loca
 
 ## {6. The Spikes}
 
-Pressing the **(A)** button more than once might send you into a spike. Let's make the spikes dangerous, too.
+**Don't fly into a spike!**
+
+Let's make the spikes dangerous, too.
 
 
 ---
 
-- :mouse pointer:  Follow the same steps to end the game when your sprite overlaps the **spikes** as you did for the **acid** tile. <br/>
+- :mouse pointer:  Follow the same steps to end the game when your sprite overlaps the **spikes**
 ![Avoid the spikes!](/static/skillmap/racer/spikes.png "Avoid the spike tiles")
+as you did for the **acid** tile.
+
 
 _💡 Need a little help figuring out what this step should look like? Click the lightbulb button below for a peek at the blocks we recommend._
 
-```blockconfig.local
-scene.onOverlapTile(SpriteKind.Player, img`.`, function (sprite, location) {
-    game.over(false)
-})
-```
+
 
 #### ~ tutorialhint
 
@@ -131,19 +107,17 @@ scene.onOverlapTile(SpriteKind.Player, assets.tile`spikes`, function (sprite, lo
 
 
 
-## {7. Take a Look!}
+## {Step 7}
 
-Click back to the game window to see how everything is coming together.
+- :binoculars: Take a look at the game window.
 
----
-
-You should be able to jump the acid pits by pressing the (A) button and the game should end when you hit the acid or a spike.
+You should be able to jump the acid pits by pressing the (A) button (or space bar) and the game should end when you hit the acid or a spike.
 
 
 
 ## {8. End of the Tunnel}
 
-We have a way to lose, now we need a way to win.
+**We have a way to lose, now we need a way to win.**
 
 At the end of the cave, there is a set of pure black **empty cave** tiles.
 
@@ -155,6 +129,13 @@ an **empty cave** tile as you did for the **acid** tile.
 ![Get to the cave](/static/skillmap/racer/cave.png "Choose the cave tile")
 
 
+- :mouse pointer:  This time, make sure the switch inside of the<br/>
+``||game:game over < >||`` block is set to **`<WIN>`**.
+
+
+_💡 Need a little help figuring out what this step should look like? Click the lightbulb button below for a peek at the blocks we recommend._
+
+
 ```blockconfig.local
 scene.onOverlapTile(SpriteKind.Player, img`.`, function (sprite, location) {
     game.over(true)
@@ -169,22 +150,36 @@ scene.onOverlapTile(SpriteKind.Player, assets.tile`empty cave`, function (sprite
 })
 ```
 
+## {Step 7}
+
+- :binoculars: Play your game!
+
+Can you make it all the way to the end and win?
+
+
 
 ## {Finale}
 
 Congratulations!
 
-You've created your own Monster Racer game!
+You've created a Monster Racer game!
+
+Once you're finished playing,
+click **Done** to head back out to the skillmap, then keep going to add
+fun customizations to your game.
 
-Race to the end of the cave and once you're finished playing,
-click **Done** to head back out to the skillmap where you can
-play the next level and add customizations to your game.
 
 
 ```blockconfig.global
 let truck = sprites.create(img`.`, SpriteKind.Player)
 truck.x = 0
 scene.cameraFollowSprite(truck)
+controller.A.onEvent(ControllerButtonEvent.Pressed, function () {
+    truck.vy = -200
+})
+scene.onOverlapTile(SpriteKind.Player, assets.tile`acid`, function (sprite, location) {
+    game.over(false)
+})
 ```
 
 ```template