Migrate docs from the other repo

docs/reference/js/lessons/rotation-animation/challenges.md

@@ -0,0 +1,75 @@
+# rotation animation challenges
+
+Coding challenges for the rotation animation tutorial. #docs
+
+## Before we get started
+
+Complete the following guided tutorial:
+
+* [tutorial](/microbit/lessons/rotation-animation/tutorial)
+
+At the end of the tutorial, click `keep editing`. Your code should look like this:
+
+```
+rotating = true
+while (rotating) {
+    basic.showAnimation(`
+# . . . . . . # . . . . . . # . . . . .
+. # . . . . . # . . . . . # . . . . . .
+. . # . . . . # . . . . # . . # # # # #
+. . . # . . . # . . . # . . . . . . . .
+. . . . # . . # . . # . . . . . . . . .
+`, 400)
+    basic.pause(25)
+}
+```
+
+### Challenge 1
+
+Now let's add to this by creating a condition for on button pressed `A` before the while loop.
+
+```
+rotating = true
+input.onButtonPressed("A", () => {
+}) // ***
+while (rotating) {
+    basic.showAnimation(`
+# . . . . . . # . . . . . . # . . . . .
+. # . . . . . # . . . . . # . . . . . .
+. . # . . . . # . . . . # . . # # # # #
+. . . # . . . # . . . # . . . . . . . .
+. . . . # . . # . . # . . . . . . . . .
+`, 400)
+    basic.pause(25)
+}
+```
+
+### Challenge 2
+
+### @video td/videos/rotation-animation-1-and-2
+
+Now that we have the on button pressed condition, let's make the animation stop rotating by setting the rotating global variable to false when button `A` is pressed.
+
+```
+rotating = true
+input.onButtonPressed("A", () => {
+    rotating = false // ***
+}) // ***
+while (rotating) {
+    basic.showAnimation(`
+# . . . . . . # . . . . . . # . . . . .
+. # . . . . . # . . . . . # . . . . . .
+. . # . . . . # . . . . # . . # # # # #
+. . . # . . . # . . . # . . . . . . . .
+. . . . # . . # . . # . . . . . . . . .
+`, 400)
+    basic.pause(25)
+}
+```
+
+* Run the code to see the awesome rotation.
+
+### Challenge 3
+
+Let's also make the image rotate the opposite way when button A is pressed! We can do this with another while loop that is only executed while `not rotating`.
+

docs/reference/js/lessons/rotation-animation/lesson-plan.md

@@ -0,0 +1,99 @@
+# rotation animation lesson plan
+
+Learn how to create images with a global variable and while loop. #LED #screen  #plot #docs
+
+### @video vimeo/134323475
+
+## Topic
+
+While Loop - Rotating Animations
+
+## Class
+
+Year 7
+
+## Prior learning/place of lesson in scheme of work
+
+Learn how to create images that look like a rotating animation by using a while loop. We will be learning how to create a rotating animation using a global variable, while loop as well as simple commands, such as on button pressed and show animation.
+
+## What the teacher needs to know
+
+**Program:** A stored set of instructions encoded in a language understood by the computer that does some form of computation, processing input and/or stored data to generate output.**
+
+**Algorithm:** An unambiguous set of rules or a precise step-by-step guide to solve a problem or achieve a particular objective. The guided tutorial follows a algorithm and is a precise step-by-step guide to solve a problem**
+
+**Loop:** A block of code repeated automatically under the program’s control. ** The blink program introduces Forever. Forever will repeats code in the background forever.
+
+**Command:** An instruction for the computer to execute, written in a particular programming language.**
+
+**QuickStart Computing Glossary
+
+## Documentation
+
+* **global variables**: [read more...](/microbit/js/data)
+* **pause**: [read more...](/microbit/reference/basic/pause)
+* **forever**: [read more...](/microbit/reference/basic/forever)
+
+## Resources
+
+* Activity: [tutorial](/microbit/lessons/rotation-animation/tutorial)
+* Activity: [quiz](/microbit/lessons/rotation-animation/quiz)
+* Extended Activity: [challenges](/microbit/lessons/rotation-animation/challenges)
+
+## Objectives
+
+* learn how to create a global variable
+* learn how a rotating animation
+* learn how to repeat the animation
+
+## Links to the National Curriculum Programmes of Study for Computing
+
+## Assessment
+
+### Progression Pathways
+
+### Computational Thinking Framework
+
+#### Algorithms
+
+* Understands that iteration is the repetition of a process such as a loop. (AL)
+* Represents solutions using a structured notation. (AL) (AB)
+
+#### Programming & Development
+
+* Creates programs that implement algorithms to achieve given goals. (AL)
+* Declares and assigns variables.(AB)
+
+#### Data & Data Representation
+
+* Understands the difference between data and information. (AB)
+* Defines data types: real numbers and Boolean. (AB)
+
+#### Information Technology
+
+*  Collects, organises and presents data and information in digital content. (AB)
+* Makes appropriate improvements to solutions based on feedback received, and can comment on the success of the solution. (EV)
+
+Computational Thinking Concept: AB = Abstraction; DE = Decomposition; AL = Algorithmic Thinking; EV = Evaluation; GE = Generalisation
+
+## Activity
+
+* time: 20 min.
+* [tutorial](/microbit/lessons/rotation-animation/tutorial)
+* [quiz](/microbit/lessons/rotation-animation/quiz)
+* assessment opportunities: forever, plot, pause, clear screen
+
+## Extended Activity
+
+* time: 20 min.
+* [challenges](/microbit/lessons/rotation-animation/challenges)
+* assessment opportunities: loops, plot, pause, clear screen
+
+## Homework
+
+* Extended Activity: [challenges](/microbit/lessons/rotation-animation/challenges)
+
+## Intended follow on
+
+Publish script to the classroom.
+

docs/reference/js/lessons/rotation-animation/quiz-answers.md

@@ -0,0 +1,55 @@
+# rotation animation quiz answers
+
+Learn how to create a rotating image with a while loop. #image #loop  #while #docs
+
+This is the answer key for the [rotation animation quiz](/microbit/lessons/rotation-animation/quiz).
+
+## 1. What is a "global variable"?
+
+Answers may vary. A global variable is a place where you can store data so that you can use it later in your code.
+
+## 2. Consider the following directions
+
+Write the code to create a **global variable** called `foo` that stores a boolean and initialize it to **false**.
+
+```
+rotating = true
+```
+
+## 3. Consider the following code
+
+```
+while (rotating) {
+}
+```
+
+Explain what this line of code does.
+
+<br/>
+
+It is a **while** loop that will be executed only if the **global variable** called `rotating` is **true**.
+
+## 4. Consider the following code
+
+```
+basic.showAnimation(`
+# . . . . . . # . . . . . . # . . . . .
+. # . . . . . # . . . . . # . . . . . .
+. . # . . . . # . . . . # . . # # # # #
+. . . # . . . # . . . # . . . . . . . .
+. . . . # . . # . . # . . . . . . . . .
+`, 400)
+```
+
+If the rectangle below represents the BBC micro:bit, shade the areas that will be displayed. Explain why that particular area is shaded.
+
+![](/static/mb/lessons/rotation-animation-0.png)
+
+![](/static/mb/lessons/rotation-animation-1.png)
+
+![](/static/mb/lessons/rotation-animation-2.png)
+
+![](/static/mb/lessons/rotation-animation-3.png)
+
+Show animation will show a series of image frames on the LED screen, pausing the specified time (400 milliseconds) after each frame
+

docs/reference/js/lessons/rotation-animation/quiz.md

@@ -0,0 +1,45 @@
+# rotation animation quiz
+
+Learn how to create a rotating image with a while loop. #image #loop  #while #docs
+
+## Name
+
+## Directions
+
+Use this activity document to guide your work in the [rotation animation tutorial](/microbit/lessons/rotation-animation/tutorial).
+
+Answer the questions while completing the tutorial. Pay attention to the dialogues!
+
+## 1. What is a "global variable"?
+
+<br />
+
+## 2. Write the code to create a global variable called foo that stores a boolean and initialize it to false.
+
+<br/>
+
+## 3. Explain why you use a while loop with a global variable
+
+```
+while (rotating) {
+}
+```
+
+<br/>
+
+## 4. Draw the areas on the micro:bits to illustrate the code below. Explain why you chose to draw in those areas.
+
+```
+basic.showAnimation(`
+# . . . . . . # . . . . . . # . . . . .
+. # . . . . . # . . . . . # . . . . . .
+. . # . . . . # . . . . # . . # # # # #
+. . . # . . . # . . . # . . . . . . . .
+. . . . # . . # . . # . . . . . . . . .
+`, 400)
+```
+
+![](/static/mb/lessons/looper-2.png)
+
+<br/>
+