pxt-arcade 1.7.3 → 1.7.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (149) hide show
  1. package/built/target.js +69 -68
  2. package/built/target.json +69 -68
  3. package/built/targetlight.json +4 -4
  4. package/built/theme.json +2 -1
  5. package/docs/hour-of-code/educators-2021.html +366 -0
  6. package/docs/hour-of-code-2021.html +239 -140
  7. package/docs/hour-of-code.html +11 -11
  8. package/docs/index-ref.json +1 -1
  9. package/docs/multipart-tutorials.md +0 -8
  10. package/docs/projects/SUMMARY.md +3 -2
  11. package/docs/recipes.md +0 -7
  12. package/docs/skillmap/clicker/clicker1.md +7 -7
  13. package/docs/skillmap/clicker/clicker2.md +9 -9
  14. package/docs/skillmap/clicker/clicker3.md +8 -8
  15. package/docs/skillmap/clicker/clicker4.md +8 -8
  16. package/docs/skillmap/clicker/clicker4a.md +7 -7
  17. package/docs/skillmap/clicker/clicker5.md +3 -3
  18. package/docs/skillmap/clicker-themed/clickert1.md +8 -8
  19. package/docs/skillmap/clicker-themed/clickert2.md +10 -10
  20. package/docs/skillmap/clicker-themed/clickert3.md +8 -8
  21. package/docs/skillmap/clicker-themed/clickert4.md +8 -8
  22. package/docs/skillmap/collector/collector1.md +11 -11
  23. package/docs/skillmap/collector/collector1a.md +8 -8
  24. package/docs/skillmap/collector/collector2.md +8 -8
  25. package/docs/skillmap/collector/collector3.md +8 -8
  26. package/docs/skillmap/collector/collector3a.md +7 -7
  27. package/docs/skillmap/collector/collector4.md +8 -8
  28. package/docs/skillmap/collector/collector5.md +2 -2
  29. package/docs/skillmap/collector-themed/collectort1.md +14 -14
  30. package/docs/skillmap/collector-themed/collectort2.md +9 -9
  31. package/docs/skillmap/collector-themed/collectort3.md +11 -11
  32. package/docs/skillmap/collector-themed/collectort4.md +11 -11
  33. package/docs/skillmap/collector-themed/collectort4old.md +8 -8
  34. package/docs/skillmap/collector-themed/collectort5.md +2 -2
  35. package/docs/skillmap/educator-info/forest-map-info.md +8 -8
  36. package/docs/skillmap/educator-info/racer-map-info.md +105 -0
  37. package/docs/skillmap/educator-info/simple-shark-map-info.md +101 -0
  38. package/docs/skillmap/forest/forest1.md +1 -69
  39. package/docs/skillmap/forest/forest2.md +3 -67
  40. package/docs/skillmap/forest/forest3.md +1 -174
  41. package/docs/skillmap/forest/forest4.md +2 -336
  42. package/docs/skillmap/forest/forest5.md +1 -396
  43. package/docs/skillmap/forest/forest6.md +6 -372
  44. package/docs/skillmap/forest.md +2 -2
  45. package/docs/skillmap/interface/activity1.md +14 -14
  46. package/docs/skillmap/jungle/jungle1.md +48 -28
  47. package/docs/skillmap/jungle/jungle2.md +50 -26
  48. package/docs/skillmap/jungle/jungle3.md +48 -27
  49. package/docs/skillmap/jungle/jungle4.md +76 -58
  50. package/docs/skillmap/jungle/jungle5.md +31 -25
  51. package/docs/skillmap/jungle/jungle6.md +34 -28
  52. package/docs/skillmap/jungle/jungle7.md +36 -24
  53. package/docs/skillmap/jungle/jungle8.md +27 -25
  54. package/docs/skillmap/jungle.md +7 -3
  55. package/docs/skillmap/long-shark.md +119 -0
  56. package/docs/skillmap/racer.md +7 -7
  57. package/docs/skillmap/rockstar/rockstar1.md +32 -13
  58. package/docs/skillmap/rockstar/rockstar2.md +43 -25
  59. package/docs/skillmap/rockstar/rockstar3.md +43 -25
  60. package/docs/skillmap/rockstar.md +3 -1
  61. package/docs/skillmap/shark/shark1-simple.md +151 -0
  62. package/docs/skillmap/shark/shark2-simple.md +203 -0
  63. package/docs/skillmap/shark/shark3-simple.md +204 -0
  64. package/docs/skillmap/shark/shark4-simple.md +246 -0
  65. package/docs/skillmap/shark/shark4a-simple.md +244 -0
  66. package/docs/skillmap/shark.md +25 -58
  67. package/docs/skillmap/space/space1.md +62 -28
  68. package/docs/skillmap/space/space2.md +33 -24
  69. package/docs/skillmap/space/space3.md +85 -68
  70. package/docs/skillmap/space/space4.md +95 -64
  71. package/docs/skillmap/space/space4a.md +32 -24
  72. package/docs/skillmap/space/space5.md +77 -41
  73. package/docs/skillmap/space/space6.md +56 -78
  74. package/docs/skillmap/space.md +8 -5
  75. package/docs/skillmap/story/card.md +6 -6
  76. package/docs/skillmap/story/card2.md +6 -6
  77. package/docs/skillmap/story/story1.md +7 -7
  78. package/docs/skillmap/story/story2.md +11 -11
  79. package/docs/skillmap/story/story3.md +10 -10
  80. package/docs/skillmap/story/story4.md +10 -10
  81. package/docs/skillmap/zoo/zoo1.md +31 -16
  82. package/docs/skillmap/zoo/zoo2.md +45 -30
  83. package/docs/skillmap/zoo/zoo2a.md +51 -36
  84. package/docs/skillmap/zoo/zoo3.md +8 -7
  85. package/docs/skillmap/zoo/zoo4.md +61 -32
  86. package/docs/skillmap/zoo/zoo5.md +41 -31
  87. package/docs/skillmap/zoo.md +2 -2
  88. package/docs/skillmaps.md +20 -4
  89. package/docs/static/experiments/accessibleblocks.png +0 -0
  90. package/docs/static/experiments/blockserrorlist.png +0 -0
  91. package/docs/static/hour-of-code/2021/beginner-skillmap.png +0 -0
  92. package/docs/static/hour-of-code/2021/favicon.png +0 -0
  93. package/docs/static/hour-of-code/2021/forest-skillmap-game.gif +0 -0
  94. package/docs/static/hour-of-code/2021/global-game-jam.png +0 -0
  95. package/docs/static/hour-of-code/2021/header.gif +0 -0
  96. package/docs/static/hour-of-code/2021/hoc-2020.png +0 -0
  97. package/docs/static/hour-of-code/2021/hoc-card.png +0 -0
  98. package/docs/static/hour-of-code/2021/microbit.png +0 -0
  99. package/docs/static/hour-of-code/2021/styles.css +269 -21
  100. package/docs/static/skillmap/assets/my-assets-three.png +0 -0
  101. package/docs/static/skillmap/backgrounds/jungle-bg.png +0 -0
  102. package/docs/static/skillmap/backgrounds/jungle-map.png +0 -0
  103. package/docs/static/skillmap/backgrounds/rock-map.png +0 -0
  104. package/docs/static/skillmap/backgrounds/rockstar-card.gif +0 -0
  105. package/docs/static/skillmap/backgrounds/space-comp.png +0 -0
  106. package/docs/static/skillmap/backgrounds/space.png +0 -0
  107. package/docs/static/skillmap/certificates/forest-cert.pdf +0 -0
  108. package/docs/static/skillmap/certificates/forest-cert.png +0 -0
  109. package/docs/static/skillmap/certificates/jungle-cert.pdf +0 -0
  110. package/docs/static/skillmap/certificates/jungle-cert.png +0 -0
  111. package/docs/static/skillmap/certificates/rockstar-cert.pdf +0 -0
  112. package/docs/static/skillmap/certificates/rockstar-cert.png +0 -0
  113. package/docs/static/skillmap/certificates/shark-cert.pdf +0 -0
  114. package/docs/static/skillmap/certificates/shark-cert.png +0 -0
  115. package/docs/static/skillmap/certificates/space-cert.pdf +0 -0
  116. package/docs/static/skillmap/certificates/space-cert.png +0 -0
  117. package/docs/static/skillmap/racer/racer1.gif +0 -0
  118. package/docs/static/skillmap/racer/racer2.gif +0 -0
  119. package/docs/static/skillmap/racer/racer3.gif +0 -0
  120. package/docs/static/skillmap/rockstar/rockstar1.gif +0 -0
  121. package/docs/static/skillmap/rockstar/rockstar2.gif +0 -0
  122. package/docs/static/skillmap/rockstar/rockstar3.gif +0 -0
  123. package/docs/static/skillmap/shark/shark1-simple.gif +0 -0
  124. package/docs/static/skillmap/shark/shark4a-simple.gif +0 -0
  125. package/docs/static/skillmap/zoo/overlaps-food-sprite.gif +0 -0
  126. package/docs/tutorials/hundred.md +400 -0
  127. package/package.json +1 -1
  128. package/pxtarget.json +2 -1
  129. package/targetconfig.json +4 -1
  130. package/docs/recipes/wonder-woman-1984/01-maze.md +0 -291
  131. package/docs/recipes/wonder-woman-1984/02-artifact.md +0 -70
  132. package/docs/recipes/wonder-woman-1984/03-enemies.md +0 -65
  133. package/docs/skillmap/forest/forest9.md +0 -714
  134. package/docs/static/hour-of-code/ww-maze.png +0 -0
  135. package/docs/static/recipes/wonder-woman-1984/artifact-preview.png +0 -0
  136. package/docs/static/recipes/wonder-woman-1984/artifacts-location.gif +0 -0
  137. package/docs/static/recipes/wonder-woman-1984/draw-maze-backup.png +0 -0
  138. package/docs/static/recipes/wonder-woman-1984/draw-walls-backup.png +0 -0
  139. package/docs/static/recipes/wonder-woman-1984/end-position.png +0 -0
  140. package/docs/static/recipes/wonder-woman-1984/enemies-location.gif +0 -0
  141. package/docs/static/recipes/wonder-woman-1984/enemies-preview.png +0 -0
  142. package/docs/static/recipes/wonder-woman-1984/fill-maze.gif +0 -0
  143. package/docs/static/recipes/wonder-woman-1984/fill-walls.gif +0 -0
  144. package/docs/static/recipes/wonder-woman-1984/wonder-woman3.png +0 -0
  145. package/docs/static/recipes/wonder-woman-1984/ww-splash3.gif +0 -0
  146. package/docs/static/recipes/wonder-woman-1984/ww-splash3.mp4 +0 -0
  147. package/docs/static/ww84-background.png +0 -0
  148. package/docs/static/ww84-header.png +0 -0
  149. package/docs/ww84.html +0 -276
@@ -7,7 +7,7 @@
7
7
  >
8
8
  <head>
9
9
  <meta charset="UTF-8" />
10
- <title>Microsoft MakeCode Arcade Hour of Code 2021</title>
10
+ <title>Microsoft MakeCode Arcade Hour of Code 2021</title>
11
11
  <meta name="Description" content="" />
12
12
  <!-- TODO: Description Copy -->
13
13
  <meta
@@ -21,7 +21,7 @@
21
21
  <meta name="apple-mobile-web-app-capable" content="yes" />
22
22
  <meta
23
23
  name="apple-mobile-web-app-title"
24
- content="Microsoft MakeCode Arcade Hour of Code 2021"
24
+ content="Microsoft MakeCode Arcade Hour of Code 2021"
25
25
  />
26
26
  <meta
27
27
  name="apple-mobile-web-app-status-bar-style"
@@ -30,54 +30,71 @@
30
30
  <meta name="format-detection" content="telephone=no" />
31
31
  <meta
32
32
  name="application-name"
33
- content="Microsoft MakeCode Arcade Hour of Code 2021"
33
+ content="Microsoft MakeCode Arcade Hour of Code 2021"
34
34
  />
35
35
 
36
- <meta name="msapplication-TileColor" content="#ff7b22" />
37
- <meta name="msapplication-TileImage" content="" />
38
- <!-- TODO: Card Image -->
36
+ <meta name="msapplication-TileColor" content="#3DC1AA" />
37
+ <meta
38
+ name="msapplication-TileImage"
39
+ content="/static/hour-of-code/2021/hoc-card.png"
40
+ />
39
41
  <meta name="msapplication-config" content="none" />
40
- <meta name="theme-color" content="#ff7b22" />
42
+ <meta name="theme-color" content="#3DC1AA" />
41
43
 
42
44
  <meta name="twitter:card" content="summary" />
43
45
  <meta name="twitter:site" content="MSMakeCode" />
44
46
  <meta
45
47
  name="twitter:title"
46
- content="Microsoft MakeCode Arcade Hour of Code 2021"
48
+ content="Microsoft MakeCode Arcade Hour of Code 2021"
47
49
  />
48
50
  <meta name="twitter:description" content="" />
49
51
  <!-- TODO: Description Copy -->
50
- <meta name="twitter:image" content="/static/hour-of-code/card.png" />
51
- <!-- TODO: Card Image -->
52
+ <meta
53
+ name="twitter:image"
54
+ content="/static/hour-of-code/2021/hoc-card.png"
55
+ />
52
56
 
53
57
  <meta
54
58
  property="og:title"
55
- content="Microsoft MakeCode Arcade Hour of Code 2021"
59
+ content="Microsoft MakeCode Arcade Hour of Code 2021"
56
60
  />
57
61
  <meta
58
62
  property="og:site_name"
59
- content="Microsoft MakeCode Arcade Hour of Code 2021"
63
+ content="Microsoft MakeCode Arcade Hour of Code 2021"
60
64
  />
61
65
  <meta property="og:description" content="" />
62
66
  <!-- TODO: Description Copy -->
63
- <meta property="og:image" content="" />
64
- <!-- TODO: Card Image -->
67
+ <meta
68
+ property="og:image"
69
+ content="/static/hour-of-code/2021/hoc-card.png"
70
+ />
65
71
 
66
- <link rel="apple-touch-icon" href="" />
67
- <!-- TODO: Card Image -->
68
- <link rel="icon" type="image/png" href="" />
69
- <!-- TODO: Card Image -->
70
- <link rel="shortcut icon" href="" />
71
- <!-- TODO: Card Image -->
72
+ <link
73
+ rel="apple-touch-icon"
74
+ href="/static/hour-of-code/2021/favicon.png"
75
+ />
76
+ <link
77
+ rel="icon"
78
+ type="image/png"
79
+ href="/static/hour-of-code/2021/favicon.png"
80
+ />
81
+ <link
82
+ rel="shortcut icon"
83
+ href="/static/hour-of-code/2021/favicon.png"
84
+ />
72
85
 
73
86
  <!-- @include scripthead.html -->
74
87
  <!-- TODO: Font compliance for "Rowdies" Google Font (400 weight) -->
75
88
  <link rel="preconnect" href="https://fonts.googleapis.com" />
76
89
  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
90
+
91
+ <!-- TODO: Add Rowdies back in once the font is legally approved
92
+
77
93
  <link
78
94
  href="https://fonts.googleapis.com/css2?family=Rowdies&display=swap"
79
95
  rel="stylesheet"
80
- />
96
+ /> -->
97
+
81
98
  <link rel="stylesheet" href="/static/hour-of-code/2021/styles.css" />
82
99
 
83
100
  <style></style>
@@ -126,182 +143,264 @@
126
143
 
127
144
  <body id="root" class="root background-eggplant" onload="handleOnLoad()">
128
145
  <div id="main" role="presentation">
129
- <nav class="background-eggplant" style="height: 6.4rem">
130
- <!-- TODO: Bring in standardized Arcade navbar and remove style prop -->
146
+ <nav id="header-bar" class="background-eggplant" style="height: 60px">
147
+ <div class="header-bar-left">
148
+ <div class="header-org-logo" role="menuitem">
149
+ <img src="/static/logo/Microsoft_logo_rgb_W-white_D.png" alt="Microsoft">
150
+ </div>
151
+ <div class="header-org-logo-sm" role="menuitem">
152
+ <img src="/static/logo/Microsoft_logo_rgb_W-white_D-square.png" alt="Microsoft">
153
+ </div>
154
+ <div class="header-title" role="menuitem"><span>@orgtitle@</span></div>
155
+ </div>
156
+ <div class="header-bar-right">
157
+ <a class="header-icon" role="menuitem" aria-label="Return home" tabindex="0"
158
+ href="https://arcade.makecode.com/">
159
+ <i class="icon home" aria-hidden="true" role="presentation"></i>
160
+ </a>
161
+ </div>
131
162
  </nav>
132
163
 
133
- <header class="hoc-header background-marina background-placeholder">
134
- <a class="educator-btn"
135
- >Educator Page <i class="fas fa-external-link-alt"></i
136
- ></a>
164
+ <header class="hoc-header background-marina">
137
165
  <div class="header-text">
138
166
  <h4 class="body-font">Microsoft MakeCode Arcade</h4>
139
167
  <div class="title">
140
168
  <h1 class="display-font">Hour</h1>
141
169
  <h2 class="display-font">of</h2>
142
- <h1 class="display-font">Code</h1>
170
+ <h1 class="display-font">Code™</h1>
143
171
  </div>
144
172
  <h3 class="display-font">2021</h3>
145
173
  </div>
146
174
  </header>
147
175
 
148
176
  <section class="hoc-section-01">
149
- <a class="activity-btn">
177
+ <a
178
+ class="activity-btn"
179
+ href="https://arcade.makecode.com/--skillmap#docs:/skillmap/forest"
180
+ >
181
+ <!--TODO: Make sure link above is correct-->
150
182
  <div class="title background-papaya">
151
- <h5 class="display-font">Activity Title</h5>
183
+ <h5 class="display-font">Code a Game</h5>
152
184
  </div>
153
- <div
154
- class="body background-marina background-placeholder"
155
- ></div>
185
+ <div class="body background-marina"></div>
156
186
  <div class="action background-sunflower">
157
187
  <h5 class="display-font">Launch</h5>
158
188
  </div>
159
189
  </a>
160
190
  <div class="section-text">
161
- <h3 class="title display-font sunflower">Section Title</h3>
191
+ <h3 class="title display-font sunflower">
192
+ Save the Forest!
193
+ </h3>
194
+
162
195
  <p>
163
- Lorem ipsum dolor sit amet,
164
- <a href="https://google.com">consectetuer</a> adipiscing
165
- elit. Aenean commodo ligula eget dolor. Aenean massa.
166
- Cum sociis natoque penatibus et magnis dis parturient
167
- montes, nascetur ridiculus mus. Donec quam felis,
168
- ultricies nec, pellentesque eu, pretium quis, sem.
196
+ Technology and Computer Science is everywhere in the
197
+ world around us. And it’s helping to solve some of the
198
+ toughest problems we’re facing in the world – like
199
+ combating infectious diseases, reducing the effects of
200
+ climate change, and distributing resources to those in
201
+ need.
169
202
  </p>
170
203
  <p>
171
- Nulla consequat massa quis enim. Donec pede justo,
172
- fringilla vel, aliquet nec, vulputate eget, arcu. In
173
- enim justo, rhoncus ut, imperdiet a, venenatis vitae,
174
- justo.
204
+ For this year’s Hour of Code™, let’s look at how
205
+ computers and technology can help combat forest fires.
206
+ 2021 was a year of record-breaking wildfires that raged
207
+ across the globe – from the western United States, to
208
+ Siberia and the Mediterranean, creating plumes of smoke
209
+ covering the earth that could been seen from satellites
210
+ in space!
175
211
  </p>
212
+ <p>
213
+ Code a game with Microsoft MakeCode Arcade that
214
+ recreates the conditions for a forest fire, and then
215
+ code your fire-fighting airtanker plane to spray water
216
+ and put out the flames!
217
+ </p>
218
+ <a
219
+ class="btn"
220
+ href="https://arcade.makecode.com/--skillmap#docs:/skillmap/forest"
221
+ >
222
+ <!--TODO: Make sure link above is correct-->
223
+ <h5 class="display-font">Launch Activity</h5></a
224
+ >
225
+ <a
226
+ class="btn secondary"
227
+ href="hour-of-code/educators-2021.html"
228
+ target="_blank"
229
+ rel="noreferrer"
230
+ ><h5 class="display-font">
231
+ Educator Guide
232
+ <i class="fas fa-external-link-alt"></i></h5
233
+ ></a>
176
234
  </div>
177
235
  </section>
178
236
 
179
237
  <section class="hoc-aside-01 background-marina">
180
238
  <div class="aside-text">
181
- <h3 class="title display-font">Aside Title</h3>
182
- <h5 class="subtitle body-font">Aside Subtitle</h5>
239
+ <h3 class="title display-font">Join the Game Jam!</h3>
183
240
  <p>
184
- Lorem ipsum dolor sit amet,
185
- <a href="https://google.com">consectetuer</a> adipiscing
186
- elit. Aenean commodo ligula eget dolor. Aenean massa.
187
- Cum sociis natoque penatibus et magnis dis parturient
188
- montes, nascetur ridiculus mus. Donec quam felis,
189
- ultricies nec, pellentesque eu, pretium quis, sem.
241
+ Once you’ve completed your “Save the Forest!” Hour of
242
+ Code™ game, take some time to personalize, mod it and
243
+ make it your own. Then submit it into the Climate Change
244
+ Game Jam in partnership with the US State Department.
245
+ You’ll be competing to win…
190
246
  </p>
191
- <a class="btn"><h5 class="display-font">Button</h5></a>
247
+ <a class="btn"
248
+ ><h5 class="display-font">Enter the Game Jam</h5></a
249
+ >
192
250
  </div>
193
- <div
194
- class="hero background-sunflower background-placeholder"
195
- ></div>
251
+ <div class="hero background-sunflower"></div>
196
252
  </section>
197
253
 
198
254
  <section class="hoc-section-02">
199
255
  <div class="section-text">
200
- <h3 class="title display-font sunflower">Section Title</h3>
256
+ <h3 class="title display-font sunflower">
257
+ Go beyond Hour of Code™!
258
+ </h3>
201
259
  <p>
202
- Nulla consequat massa quis enim. Donec pede justo,
203
- fringilla vel, aliquet nec, vulputate eget, arcu.
260
+ Can’t get enough? Explore the activities below for more
261
+ MakeCode fun!
204
262
  </p>
205
263
  </div>
206
- <!-- TODO: Script to animate this carousel -->
207
264
  <div class="carousel">
208
265
  <div class="list">
209
- <a class="list-item display-font" data-ind="0"
210
- >List Item</a
266
+ <a
267
+ class="list-item display-font active"
268
+ onClick="onListItemClicked(0)"
269
+ data-ind="0"
270
+ >Hour of Code™ 2020</a
211
271
  >
212
- <a class="list-item display-font active" data-ind="1"
213
- >List Item</a
272
+ <a
273
+ class="list-item display-font"
274
+ onClick="onListItemClicked(1)"
275
+ data-ind="1"
276
+ >Beginner's Guide to Arcade Games</a
214
277
  >
215
- <a class="list-item display-font" data-ind="2"
216
- >List Item</a
278
+ <a
279
+ class="list-item display-font"
280
+ onClick="onListItemClicked(2)"
281
+ data-ind="2"
282
+ >Rockstar Maze</a
217
283
  >
218
- <a class="list-item display-font" data-ind="3"
219
- >List Item</a
284
+ <a
285
+ class="list-item display-font"
286
+ onClick="onListItemClicked(3)"
287
+ data-ind="3"
288
+ >Explore the Jungle</a
220
289
  >
221
- <a class="list-item display-font" data-ind="4"
222
- >List Item</a
290
+ <a
291
+ class="list-item display-font"
292
+ onClick="onListItemClicked(4)"
293
+ data-ind="4"
294
+ >Minecraft Hour of Code</a
223
295
  >
224
- <a class="list-item display-font" data-ind="5"
225
- >List Item</a
296
+ <a
297
+ class="list-item display-font"
298
+ onClick="onListItemClicked(5)"
299
+ data-ind="5"
300
+ >Micro:bit Tutorials</a
226
301
  >
227
302
  </div>
228
- <div class="body background-marina background-placeholder">
229
- <a class="btn"><h5 class="display-font">Button</h5></a>
230
- </div>
231
- </div>
232
- </section>
233
-
234
- <section class="hoc-aside-02 background-sunflower">
235
- <div class="wrapper">
236
- <div class="aside-text">
237
- <h3 class="title display-font">Aside Title</h3>
238
- <p>
239
- Lorem ipsum dolor sit amet,
240
- <a href="https://google.com">consectetuer</a>
241
- adipiscing elit. Aenean commodo ligula eget dolor.
242
- Aenean massa. Cum sociis natoque penatibus et magnis
243
- dis parturient montes, nascetur ridiculus mus.
244
- </p>
245
- </div>
246
- <div class="tiles">
247
- <a
248
- class="
249
- tile
250
- background-marina background-placeholder
251
- "
252
- ></a>
253
- <a
254
- class="
255
- tile
256
- background-sunflower background-placeholder
257
- "
258
- ></a>
259
- <a
260
- class="
261
- tile
262
- background-papaya background-placeholder
263
- "
264
- ></a>
303
+ <div id="carousel-body" class="body background-marina">
304
+ <div class="body-overlay"></div>
265
305
  <a
266
- class="
267
- tile
268
- background-sunflower background-placeholder
269
- "
270
- ></a>
271
- <a
272
- class="
273
- tile
274
- background-papaya background-placeholder
275
- "
276
- ></a>
277
- <a
278
- class="
279
- tile
280
- background-marina background-placeholder
281
- "
306
+ id="carousel-link"
307
+ target="_blank"
308
+ rel="noreferrer"
309
+ class="btn"
310
+ href=""
311
+ ><h5 id="carousel-text" class="display-font"></h5
282
312
  ></a>
283
313
  </div>
284
314
  </div>
315
+ <script type="application/javascript">
316
+ let slides = [
317
+ {
318
+ img: '/static/hour-of-code/2021/hoc-2020.png',
319
+ link: 'https://arcade.makecode.com/hour-of-code',
320
+ text: 'Hour of Code™ 2020'
321
+ },
322
+ {
323
+ img: '/static/hour-of-code/2021/beginner-skillmap.png',
324
+ link: 'https://arcade.makecode.com/--skillmap#beginner',
325
+ text: 'Launch Skillmap'
326
+ },
327
+ { img: '', link: '', text: 'Launch Skillmap' },
328
+ { img: '', link: '', text: 'Launch Skillmap' },
329
+ { img: '', link: '', text: 'Hour of Code™ 2021' },
330
+ {
331
+ img: '/static/hour-of-code/2021/microbit.png',
332
+ link: 'https://makecode.microbit.org',
333
+ text: 'Go to micro:bit'
334
+ }
335
+ ];
336
+
337
+ let globalInd = 0;
338
+ let intervalSpeed = 4000;
339
+
340
+ changeCarousel(0);
341
+
342
+ function intervalFunction() {
343
+ globalInd = (globalInd + 1) % 6;
344
+ changeCarousel(globalInd);
345
+ }
346
+
347
+ let transition = setInterval(
348
+ intervalFunction,
349
+ intervalSpeed
350
+ );
351
+
352
+ function onListItemClicked(ind) {
353
+ clearInterval(transition);
354
+ globalInd = ind;
355
+ changeCarousel(globalInd);
356
+ transition = setInterval(
357
+ intervalFunction,
358
+ intervalSpeed
359
+ );
360
+ }
361
+
362
+ function changeCarousel(ind) {
363
+ let linkElems =
364
+ document.getElementsByClassName('list-item');
365
+ let carouselBody =
366
+ document.getElementById('carousel-body');
367
+ let carouselLink =
368
+ document.getElementById('carousel-link');
369
+ let carouselText =
370
+ document.getElementById('carousel-text');
371
+
372
+ [].forEach.call(linkElems, function (el) {
373
+ el.classList.remove('active');
374
+ });
375
+
376
+ linkElems[ind].classList.add('active');
377
+ carouselBody.style.backgroundImage =
378
+ 'url(' + slides[ind].img + ')';
379
+ carouselText.innerHTML = slides[ind].text;
380
+ carouselLink.href = slides[ind].link;
381
+ }
382
+ </script>
285
383
  </section>
286
384
 
287
- <section class="hoc-section-01 hoc-section-03">
288
- <div class="section-text">
289
- <h3 class="title display-font sunflower">Section Title</h3>
385
+ <section class="hoc-aside-01 background-sunflower">
386
+ <div class="aside-text">
387
+ <h3 class="title display-font">MakeCode Insiders Club</h3>
290
388
  <p>
291
- Lorem ipsum dolor sit amet, consectetuer adipiscing
292
- elit. Aenean commodo ligula eget dolor. Aenean massa.
293
- Cum sociis natoque penatibus et magnis dis parturient
294
- montes, nascetur ridiculus mus.
389
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit,
390
+ sed do eiusmod tempor incididunt ut labore et dolore
391
+ magna aliqua. Ut enim ad minim veniam, quis nostrud
392
+ exercitation ullamco laboris nisi ut aliquip ex ea
393
+ commodo consequat. Duis aute irure dolor in
394
+ reprehenderit in voluptate velit esse cillum dolore eu
395
+ fugiat nulla pariatur. Excepteur sint occaecat cupidatat
396
+ non proident, sunt in culpa qui officia deserunt mollit
397
+ anim id est laborum.
295
398
  </p>
399
+ <a class="btn"><h5 class="display-font">Button</h5></a>
296
400
  </div>
297
- <a class="certificate">
298
- <div
299
- class="body background-marina background-placeholder"
300
- ></div>
301
- <div class="action background-sunflower">
302
- <h5 class="display-font">Button</h5>
303
- </div>
304
- </a>
401
+ <div
402
+ class="hero background-papaya background-placeholder"
403
+ ></div>
305
404
  </section>
306
405
 
307
406
  <!-- TODO: Customize footer to include insiders club message -->
@@ -18,30 +18,30 @@
18
18
  />
19
19
 
20
20
  <link rel="manifest" href="/blb/sim.webmanifest">
21
-
21
+
22
22
  <meta name="mobile-web-app-capable" content="yes">
23
23
  <meta name="apple-mobile-web-app-capable" content="yes">
24
24
  <meta name="apple-mobile-web-app-title" content="Microsoft MakeCode Arcade Hour of Code 2020">
25
25
  <meta name="apple-mobile-web-app-status-bar-style" content="translucent-black">
26
26
  <meta name="format-detection" content="telephone=no">
27
27
  <meta name="application-name" content="Microsoft MakeCode Arcade Hour of Code 2020">
28
-
28
+
29
29
  <meta name="msapplication-TileColor" content="#ff7b22">
30
30
  <meta name="msapplication-TileImage" content="/static/hour-of-code/card.png">
31
31
  <meta name="msapplication-config" content="none"/>
32
32
  <meta name="theme-color" content="#ff7b22">
33
-
33
+
34
34
  <meta name="twitter:card" content="summary" />
35
35
  <meta name="twitter:site" content="MSMakeCode" />
36
36
  <meta name="twitter:title" content="Microsoft MakeCode Arcade Hour of Code 2020" />
37
37
  <meta name="twitter:description" content="Join us in celebrating this year's Computer Science Education Week by playing, designing and coding your very own retro arcade games!" />
38
38
  <meta name="twitter:image" content="/static/hour-of-code/card.png" />
39
-
39
+
40
40
  <meta property="og:title" content="Microsoft MakeCode Arcade Hour of Code 2020" />
41
41
  <meta property="og:site_name" content="Microsoft MakeCode Arcade Hour of Code 2020" />
42
42
  <meta property="og:description" content="Join us in celebrating this year's Computer Science Education Week by playing, designing and coding your very own retro arcade games!" />
43
43
  <meta property="og:image" content="/static/hour-of-code/card.png" />
44
-
44
+
45
45
  <link rel="apple-touch-icon" href="/static/hour-of-code/card.png">
46
46
  <link rel="icon" type="image/png" href="/static/hour-of-code/card.png">
47
47
  <link rel="shortcut icon" href="/static/hour-of-code/card.png">
@@ -137,10 +137,10 @@
137
137
  </div>
138
138
  </header>
139
139
 
140
-
140
+
141
141
  <section class='activities container'>
142
142
  <div class="content-row">
143
-
143
+
144
144
 
145
145
  <a href="https://arcade.makecode.com/#tutorial:/recipes/shark-splash/01-character" target="_blank" class="content-column one-third panel-secondary">
146
146
  <h2 class="display-font panel-primary">Code</h2>
@@ -231,7 +231,7 @@
231
231
  </div>
232
232
  </section>
233
233
 
234
-
234
+
235
235
 
236
236
  <section class='container additional'>
237
237
  <div class="content-block">
@@ -250,9 +250,9 @@
250
250
  </a>
251
251
  </div>
252
252
  <div class="content-column one-third">
253
- <a href="https://arcade.makecode.com/ww84" target="_blank">
254
- <img src="/static/hour-of-code/ww-maze.png" alt="Wonder Woman Maze" />
255
- <div class='action-button'>Wonder Woman Maze</div>
253
+ <a href="https://arcade.makecode.com/--skillmap#beginner" target="_blank">
254
+ <img src="/static/skillmap/backgrounds/beginner.png" alt="Beginner Skill Map" />
255
+ <div class='action-button'>Beginner Skill Map</div>
256
256
  </a>
257
257
  </div>
258
258
  <div class="content-column one-third">
@@ -1,3 +1,3 @@
1
1
  {
2
- "appref": "v1.6.23"
2
+ "appref": "v1.6.24"
3
3
  }
@@ -12,14 +12,6 @@
12
12
  "imageUrl": "/static/recipes/shark-splash/shark-splash.png",
13
13
  "largeImageUrl": "/static/recipes/shark-splash/02-C-enemies.gif",
14
14
  "videoUrl": "/static/recipes/shark-splash/02-C-enemies.mp4"
15
- }, {
16
- "name": "Wonder Woman 1984",
17
- "description": "Wonder Woman must find the way out of a tricky maze! In that maze, she can collect artifacts to gain points, but also needs to avoid her enemies that will steal points.",
18
- "url": "/recipes/wonder-woman-1984/01-maze",
19
- "cardType": "tutorial",
20
- "imageUrl": "/static/recipes/wonder-woman-1984/artifact-preview.png",
21
- "largeImageUrl": "/static/recipes/wonder-woman-1984/ww-splash3.gif",
22
- "videoUrl": "/static/recipes/wonder-woman-1984/ww-splash3.mp4"
23
15
  }, {
24
16
  "name": "Side Scroller",
25
17
  "description": "Make a side-scrolling car racing game to jump over obstacles and win the race.",
@@ -2,7 +2,9 @@
2
2
 
3
3
  * [Skillmaps](/skillmaps)
4
4
  * [Beginner Skillmap](https://arcade.makecode.com/--skillmap#beginner)
5
- * [Shang-Chi and the Legend of the Ten Rings](https://arcade.makecode.com/--skillmap#sc)
5
+ * [Create a Space Adventure](https://arcade.makecode.com/--skillmap#space)
6
+ * [Jungle Monkey Jump Platformer](https://arcade.makecode.com/--skillmap#jungle)
7
+ * [80s Rockstar Maze](https://arcade.makecode.com/--skillmap#rockstar)
6
8
  * [A Zookeeper's Adventure](https://arcade.makecode.com/--skillmap#zoo)
7
9
  * [Game Maker Guide](https://arcade.makecode.com/skillmap)
8
10
  * [Tutorials](/tutorials)
@@ -20,7 +22,6 @@
20
22
  * [Maze](/tutorials/maze)
21
23
  * [Multipart Tutorials](/multipart-tutorials)
22
24
  * [Shark Attack](/recipes/shark-splash/01-character)
23
- * [Wonder Woman 1984](/recipes/wonder-woman-1984/01-maze)
24
25
  * [Side Scroller](/recipes/side-scroller/01-background)
25
26
  * [Live Coding](/live-coding)
26
27
  * [Space Arcade Game](https://youtu.be/7pBGS_tKfmU)
package/docs/recipes.md CHANGED
@@ -24,13 +24,6 @@
24
24
  "cardType": "tutorial",
25
25
  "imageUrl": "/static/recipes/shark-splash/01-character.gif"
26
26
  },
27
- {
28
- "name": "Wonder Woman 1984",
29
- "description": "Wonder Woman must find the way out of a tricky maze! In that maze, she can collect artifacts to gain points, but also needs to avoid her enemies that will steal points.",
30
- "url": "/recipes/wonder-woman-1984/01-maze",
31
- "cardType": "tutorial",
32
- "imageUrl": "/static/recipes/wonder-woman-1984/ww-splash3.gif"
33
- },
34
27
  {
35
28
  "name": "Walking Hero",
36
29
  "description": "Learn about how characters are represented in games by making your own. New Concepts: Sprites, The image editor, Moving a sprite",