0.0.76

* using datalog from common packages

* upgrading common package link

* updated block signatures

* more docs

README.md

@@ -4,7 +4,8 @@
 
 This repo contains the editor target hosted at https://d541eec2-1e96-4b7b-a223-da9d01d0337a.pxt.io/
 
-Issue tracker: https://src.education.lego.com/groups/ev3-makecode
+LEGO Auth: https://src.education.lego.com/groups/ev3-makecode (use Google Authenticator)
+LEGO Chat: https://chat.internal.education.lego.com/make-code/channels/town-square
 
 ## Local Dev setup
 

cmds/cmds.ts

@@ -2,14 +2,10 @@
 
 import * as fs from 'fs';
 
-require("./editor")
+const deploy = require("./editor/deploy")
-
-declare namespace pxt.editor {
-    function deployCoreAsync(resp: pxtc.CompileResult, disconnect?: boolean): Promise<void>;
-}
 
 export function deployCoreAsync(resp: pxtc.CompileResult) {
-    return pxt.editor.deployCoreAsync(resp, process.env["PXT_SERIAL"] ? false : true)
+    return deploy.deployCoreAsync(resp, process.env["PXT_SERIAL"] ? false : true)
         .then(() => {
             fs.writeFileSync("built/full-" + pxtc.BINARY_UF2, resp.outfiles[pxtc.BINARY_UF2], {
                 encoding: "base64"

docs/SUMMARY.md

@@ -1,5 +1,43 @@
 # @extends
 
+## Projects #projects
+
+* [Maker](/maker)
+    * [Sound Machine](/maker/sound-machine)
+    * [Sound of Color](/maker/sound-of-color)
+    * [Security Gadget](/maker/security-gadget)
+    * [Intruder detector](/maker/intruder-detector)
+    * [Puppet](/maker/puppet)
+
+* [Coding](/coding)
+    * [Three Point Turn 1](/coding/three-point-turn-1)
+    * [Three Point Turn 2](/coding/three-point-turn-2)
+    * [Three Point Turn 3](/coding/three-point-turn-3)
+    * [Reversing the robot 1](/coding/reversing-the-robot-1)
+    * [Reversing the robot 2](/coding/reversing-the-robot-2)
+    * [Reversing the robot 3](/coding/reversing-the-robot-3)
+    * [Light the way 1](/coding/light-the-way-1)
+    * [Light the way 2](/coding/light-the-way-2)
+    * [Light the way 3](/coding/light-the-way-3)
+    * [Traffic Lights 1](/coding/traffic-lights-1)
+    * [Traffic Lights 2](/coding/traffic-lights-2)
+    * [Traffic Lights 3](/coding/traffic-lights-3)
+    * [Reverse Beeper 1](/coding/reverse-beeper-1)
+    * [Reverse Beeper 2](/coding/reverse-beeper-2)
+    * [Reverse Beeper 3](/coding/reverse-beeper-3)
+    * [Ignition 1](/coding/ignition-1)
+    * [Ignition 2](/coding/ignition-2)
+    * [Ignition 3](/coding/ignition-3)
+    * [Cruise Control 1](/coding/cruise-control-1)
+    * [Cruise Control 2](/coding/cruise-control-2)
+    * [Cruise Control 3](/coding/cruise-control-3)
+    * [Roaming 1](/coding/roaming-1)
+    * [Roaming 2](/coding/roaming-2)
+
+* [Lessons](/lessons)
+    * [Make it move](/lessons/make-it-move)
+    * [Line detection](/lessons/line-detection)
+
 ## Reference #reference
 
 * [Reference](/reference)

docs/about.md

@@ -6,14 +6,14 @@ Welcome to the **Microsoft MakeCode** editor for the **@boardname@**!
 
 You can program the @boardname@ using [Blocks](/blocks) or [JavaScript](/javascript) in your web browser:
 
-```block
+```blocks
-input.buttonA.onEvent(ButtonEvent.Click, () => {
+brick.buttonEnter.onEvent(ButtonEvent.Click, () => {
-    light.showRing(`blue blue blue blue blue blue blue blue blue blue`)
+    motors.largeA.setSpeed(50)
 })
 ```
 ```typescript
-input.buttonA.onEvent(ButtonEvent.Click, () => {
+brick.buttonEnter.onEvent(ButtonEvent.Click, () => {
-    light.showRing(`blue blue blue blue blue blue blue blue blue blue`)
+    motors.largeA.setSpeed(50)
 })
 ```
 
@@ -22,10 +22,10 @@ The editor work in [most modern browsers](/browsers), work [offline](/offline) o
 ## [Compile and Flash: Your Program!](/device/usb)
 
 When you have your code ready, you connect your @boardname@ to a computer via a USB cable 
-**then press the reset button** so it appears as a mounted drive (named **CPLAYBOOT**). 
+so it appears as a mounted drive (named **EV3**). 
 
 Compilation to machine code from [Blocks](/blocks) or [JavaScript](/javascript) happens in the browser. You save the binary 
-program to a **.uf2** file, which you then copy to the **CPLAYBOOT** drive, which flashes the device with the new program.
+program to a **.uf2** file, which you then copy to the **EV3** drive, which flashes the device with the new program.
 
 ## Simulator: Test Your Code
 
@@ -33,11 +33,7 @@ You can run your code using the micro:bit simulator, all within the confines of
 The simulator has support for the LED screen, buttons, as well as compass, accelerometer, and digital I/O pins.
 
 ```sim
-loops.forever(() => {
+brick.buttonEnter.onEvent(ButtonEvent.Click, () => {
-    light.pixels.showAnimation(light.animation(LightAnimation.Rainbow), 1000)
+    motors.largeA.setSpeed(50)
 })
 ```
-
-```package
-light
-```

docs/coding.md

@@ -0,0 +1,171 @@
+# Coding Activites
+
+12 computer science activities, with cross-curricular opportunities in design and technology, science, and math.
+
+* [Download Curriculum Materials](https://education.lego.com/en-us/downloads/mindstorms-ev3)
+
+## Three Point Turn
+
+```codecard
+[
+{
+  "name": "Three Point Turn 1",
+  "description": "Activity 1",
+  "url":"/coding/three-point-turn-1",
+  "cardType": "example"
+}, {
+  "name": "Three Point Turn 2",
+  "description": "Activity 2",
+  "url":"/coding/three-point-turn-2",
+  "cardType": "example"
+}, {
+  "name": "Three Point Turn 3",
+  "description": "Activity 3",
+  "url":"/coding/three-point-turn-3",
+  "cardType": "example"
+}]
+```
+
+## Reversing the robot
+
+```codecard
+[{
+  "name": "Reversing the robot 1",
+  "description": "Activity 1",
+  "url":"/coding/reversing-the-robot-1",
+  "cardType": "example"
+}, {
+  "name": "Reversing the robot 2",
+  "description": "Activity 2",
+  "url":"/coding/reversing-the-robot-2",
+  "cardType": "example"
+}, {
+  "name": "Reversing the robot 3",
+  "description": "Activity 3",
+  "url":"/coding/reversing-the-robot-3",
+  "cardType": "example"
+}]
+```
+
+## Light the way
+
+```codecard
+[{
+  "name": "Light the way 1",
+  "description": "Activity 1",
+  "url":"/coding/light-the-way-1",
+  "cardType": "example"
+}, {
+  "name": "Light the way 2",
+  "description": "Activity 2",
+  "url":"/coding/light-the-way-2",
+  "cardType": "example"
+}, {
+  "name": "Light the way 3",
+  "description": "Activity 3",
+  "url":"/coding/light-the-way-3",
+  "cardType": "example"
+}    
+]
+```
+
+## Traffic Lights
+
+```codecard
+[{
+  "name": "Traffic Lights 1",
+  "description": "Activity 1",
+  "url":"/coding/traffic-lights-1",
+  "cardType": "example"
+}, {
+  "name": "Traffic Lights 2",
+  "description": "Activity 2",
+  "url":"/coding/traffic-lights-2",
+  "cardType": "example"
+}, {
+  "name": "Traffic Lights 3",
+  "description": "Activity 3",
+  "url":"/coding/traffic-lights-3",
+  "cardType": "example"
+}
+]
+```
+
+## Reverse Bepper
+
+```codecard
+[{
+  "name": "Reverse Beeper 1",
+  "description": "Activity 1",
+  "url":"/coding/reverse-beeper-1",
+  "cardType": "example"
+}, {
+  "name": "Reverse Beeper 2",
+  "description": "Activity 2",
+  "url":"/coding/reverse-beeper-2",
+  "cardType": "example"
+}, {
+  "name": "Reverse Beeper 3",
+  "description": "Activity 3",
+  "url":"/coding/reverse-beeper-3",
+  "cardType": "example"
+}]
+```
+
+## Ignition
+
+```codecard
+[{
+  "name": "Ignition 1",
+  "description": "Activity 1",
+  "url":"/coding/ingition-1",
+  "cardType": "example"
+}, {
+  "name": "Ignition 2",
+  "description": "Activity 2",
+  "url":"/coding/ignition-2",
+  "cardType": "example"
+}, {
+  "name": "Ignition 3",
+  "description": "Activity 3",
+  "url":"/coding/ignition-3",
+  "cardType": "example"
+}]
+```
+
+## Cruise Control
+
+```codecard
+[{
+  "name": "Cruise Control 1",
+  "description": "Activity 1",
+  "url":"/coding/cruise-control-1",
+  "cardType": "example"
+}, {
+  "name": "Cruise Control 2",
+  "description": "Activity 2",
+  "url":"/coding/cruise-control-2",
+  "cardType": "example"
+}, {
+  "name": "Cruise Control 3",
+  "description": "Activity 3",
+  "url":"/coding/cruise-control-3",
+  "cardType": "example"
+}]
+```
+
+## Roaming
+
+```codecard
+[{
+  "name": "Roaming 1",
+  "description": "Activity 1",
+  "url":"/coding/roaming-1",
+  "cardType": "example"
+}, {
+  "name": "Roaming 2",
+  "description": "Activity 2",
+  "url":"/coding/roaming-2",
+  "cardType": "example"
+}]
+```

docs/coding/cruise-control-1.md

@@ -0,0 +1,10 @@
+# Cruise Control Activity 1
+
+```blocks
+let speed = 0;
+sensors.touch1.onEvent(TouchSensorEvent.Pressed, function () {
+    if (speed < 100)
+        speed = speed + 10;
+    motors.largeBC.setSpeed(speed);
+}) 
+```

docs/coding/cruise-control-2.md

@@ -0,0 +1,15 @@
+# Cruise Control Activity 2
+
+```blocks
+let speed = 0;
+sensors.touch1.onEvent(TouchSensorEvent.Pressed, function () {
+    if (speed < 100)
+        speed = speed + 10;
+    motors.largeBC.setSpeed(speed);
+}) 
+sensors.touch2.onEvent(TouchSensorEvent.Pressed, function () {
+    if (speed > -100)
+        speed = speed - 10;
+    motors.largeBC.setSpeed(speed);
+}) 
+```

docs/coding/cruise-control-3.md

@@ -0,0 +1,28 @@
+# Cruise Control Activity 3
+
+```blocks
+let speed = 0
+function decelerate() {
+    if (speed > -100) {
+        speed = speed - 10
+    }
+}
+function accelerate() {
+    if (speed < 100) {
+        speed = speed + 10
+    }
+}
+function update() {
+    brick.clearScreen()
+    brick.showString("speed: " + speed, 1)
+    motors.largeBC.setSpeed(speed)
+}
+sensors.touch2.onEvent(TouchSensorEvent.Pressed, function () {
+    accelerate()
+    update()
+})
+sensors.touch1.onEvent(TouchSensorEvent.Pressed, function () {
+    decelerate()
+    update()
+})
+```

docs/coding/ignition-1.md

@@ -0,0 +1,11 @@
+# Ignition Activity 1
+
+```blocks
+sensors.touch1.onEvent(TouchSensorEvent.Pressed, function () {
+    brick.showImage(images.eyesDizzy)
+})
+sensors.ultrasonic4.onEvent(UltrasonicSensorEvent.ObjectDetected, function () {
+    brick.showImage(images.eyesTiredMiddle)
+})
+brick.showImage(images.eyesSleeping)
+```

docs/coding/ignition-2.md

@@ -0,0 +1,12 @@
+# Ignition Activity 2
+
+```blocks
+while (true) {
+    if (sensors.touch1.wasPressed() &&
+        sensors.ultrasonic4.distance() < 10) {
+        music.playSoundEffectUntilDone(sounds.mechanicalMotorStart)
+        music.playSoundEffectUntilDone(sounds.mechanicalMotorIdle);
+    }
+    loops.pause(1);
+}
+```

docs/coding/ignition-3.md

@@ -0,0 +1,13 @@
+# Ignition Activity 3
+
+```blocks
+while (true) {
+    if (sensors.ultrasonic4.distance() < 10 &&
+        sensors.touch1.wasPressed() &&
+        brick.buttonEnter.wasPressed()) {
+        music.playSoundEffectUntilDone(sounds.mechanicalMotorStart)
+        music.playSoundEffectUntilDone(sounds.mechanicalMotorIdle);
+    }
+    loops.pause(1);
+}
+```

docs/coding/light-the-way-1.md

@@ -0,0 +1,9 @@
+# Light the way Activity 1
+
+```blocks
+sensors.color3.onLightChanged(LightIntensityMode.Ambient, LightCondition.Dark, function () {
+    brick.showImage(images.objectsLightOn)
+    loops.pause(5000)
+    brick.clearScreen()
+})
+```

docs/coding/light-the-way-2.md

@@ -0,0 +1,10 @@
+# Light the way Activity 2
+
+```blocks
+sensors.color3.onLightChanged(LightIntensityMode.Ambient, LightCondition.Bright, function () {
+    brick.clearScreen()
+})
+sensors.color3.onLightChanged(LightIntensityMode.Ambient, LightCondition.Dark, function () {
+    brick.showImage(images.objectsLightOn)
+})
+```

docs/coding/light-the-way-3.md

@@ -0,0 +1,13 @@
+# Light the way Activity 3
+
+```blocks
+sensors.color3.onLightChanged(LightIntensityMode.Ambient, LightCondition.Bright, function () {
+    brick.clearScreen()
+})
+sensors.color3.onLightChanged(LightIntensityMode.Ambient, LightCondition.Dark, function () {
+    brick.showImage(images.objectsLightOn)
+})
+sensors.touch1.onEvent(TouchSensorEvent.Pressed, function () {
+    brick.showImage(images.objectsLightOn);
+})
+```

docs/coding/reverse-beeper-1.md

@@ -0,0 +1,11 @@
+# Reverse Beeper Activity 1
+
+```blocks
+loops.forever(function () {
+    music.playTone(440, sensors.ultrasonic4.distance());
+    loops.pause(50)
+})
+motors.largeBC.setSpeed(-20);
+sensors.ultrasonic4.pauseUntil(UltrasonicSensorEvent.ObjectNear);
+motors.largeBC.stop();
+```

docs/coding/reverse-beeper-2.md

@@ -0,0 +1,13 @@
+# Reverse Beeper Activity 2
+
+```blocks
+loops.forever(function () {
+    if (motors.largeB.speed() != 0 && sensors.ultrasonic4.distance() < 20) {
+        music.playTone(440, sensors.ultrasonic4.distance());
+        loops.pause(50)
+    }
+})
+motors.largeBC.setSpeed(-20);
+sensors.ultrasonic4.pauseUntil(UltrasonicSensorEvent.ObjectNear);
+motors.largeBC.stop();
+```

docs/coding/reverse-beeper-3.md

@@ -0,0 +1,20 @@
+# Reverse Beeper Activity 2
+
+```blocks
+let beep = false
+beep = true
+control.runInParallel(function () {
+    motors.largeBC.setSpeed(-20)
+    sensors.ultrasonic4.pauseUntil(UltrasonicSensorEvent.ObjectNear)
+    motors.largeBC.stop()
+    beep = false
+})
+control.runInParallel(function () {
+    while (beep) {
+        if (sensors.ultrasonic4.distance() < 20) {
+            music.playTone(440, sensors.ultrasonic4.distance())
+            loops.pause(50)
+        }
+    }
+})
+```

docs/coding/reversing-the-robot-1.md

@@ -0,0 +1,14 @@
+# Reversing the robot Activity 1
+
+```blocks
+brick.buttonEnter.onEvent(ButtonEvent.Click, function () {
+    motors.largeBC.setSpeed(50)
+    sensors.touch1.pauseUntil(TouchSensorEvent.Pressed)
+    motors.largeBC.setSpeed(0)
+    loops.pause(1000)
+    brick.setLight(BrickLight.OrangeFlash)
+    motors.largeBC.setSpeed(-50)
+    loops.pause(2000)
+    motors.largeBC.setSpeed(0)
+})
+```

docs/coding/reversing-the-robot-2.md

@@ -0,0 +1,15 @@
+# Reversing the robot Activity 2
+
+```blocks
+brick.buttonEnter.onEvent(ButtonEvent.Click, function () {
+    sensors.touch1.pauseUntil(TouchSensorEvent.Pressed)
+    motors.largeBC.setSpeed(50)
+    sensors.touch2.pauseUntil(TouchSensorEvent.Pressed)
+    motors.largeBC.setSpeed(0)
+    loops.pause(1000)
+    brick.setLight(BrickLight.OrangeFlash)
+    motors.largeBC.setSpeed(-50)
+    loops.pause(2000)
+    motors.largeBC.setSpeed(0)
+})
+```

docs/coding/reversing-the-robot-3.md

@@ -0,0 +1,19 @@
+# Reversing the robot Activity 3
+
+```blocks
+brick.buttonEnter.onEvent(ButtonEvent.Click, function () {
+    brick.showImage(images.eyesSleeping)
+    sensors.touch1.pauseUntil(TouchSensorEvent.Pressed)
+    brick.showImage(images.eyesNeutral)
+    motors.largeBC.setSpeed(50)
+    sensors.touch2.pauseUntil(TouchSensorEvent.Pressed)
+    brick.showImage(images.eyesTiredMiddle)
+    motors.largeBC.setSpeed(0)
+    loops.pause(1000)
+    brick.setLight(BrickLight.OrangeFlash)
+    brick.showImage(images.eyesDizzy)
+    motors.largeBC.setSpeed(-50)
+    loops.pause(2000)
+    motors.largeBC.setSpeed(0)
+})
+```

docs/coding/roaming-1.md

@@ -0,0 +1,32 @@
+# Roaming Activity 1
+
+```blocks
+let drive: number[] = []
+brick.buttonLeft.onEvent(ButtonEvent.Click, function () {
+    drive.push(1)
+})
+brick.buttonRight.onEvent(ButtonEvent.Click, function () {
+    drive.push(3)
+})
+brick.buttonUp.onEvent(ButtonEvent.Click, function () {
+    drive.push(4)
+})
+brick.buttonDown.onEvent(ButtonEvent.Click, function () {
+    drive.push(5)
+})
+pauseUntil(() => drive.length >= 5)
+loops.pause(1000)
+music.playSoundEffectUntilDone(sounds.communicationGo)
+for (let d of drive) {
+    if (d == 1) {
+        motors.largeC.setSpeed(50, 360, MoveUnit.Degrees)
+    } else if (d == 3) {
+        motors.largeB.setSpeed(50, 360, MoveUnit.Degrees)
+    } else if (d == 4) {
+        motors.largeBC.setSpeed(50, 360, MoveUnit.Degrees)
+    } else {
+        motors.largeBC.setSpeed(-50, 360, MoveUnit.Degrees)
+    }
+}
+music.playSoundEffectUntilDone(sounds.communicationGameOver)
+```

docs/coding/roaming-2.md

@@ -0,0 +1,36 @@
+# Roaming Activity 2
+
+```blocks
+let drive: number[] = []
+brick.buttonLeft.onEvent(ButtonEvent.Click, function () {
+    drive.push(1)
+    music.playSoundEffectUntilDone(sounds.systemClick)
+})
+brick.buttonRight.onEvent(ButtonEvent.Click, function () {
+    drive.push(3)
+    music.playSoundEffectUntilDone(sounds.systemClick)
+})
+brick.buttonUp.onEvent(ButtonEvent.Click, function () {
+    drive.push(4)
+    music.playSoundEffectUntilDone(sounds.systemClick)
+})
+brick.buttonDown.onEvent(ButtonEvent.Click, function () {
+    drive.push(5)
+    music.playSoundEffectUntilDone(sounds.systemClick)
+})
+brick.buttonEnter.pauseUntil(ButtonEvent.Click);
+loops.pause(1000)
+music.playSoundEffectUntilDone(sounds.communicationGo)
+for (let d of drive) {
+    if (d == 1) {
+        motors.largeC.setSpeed(50, 360, MoveUnit.Degrees)
+    } else if (d == 3) {
+        motors.largeB.setSpeed(50, 360, MoveUnit.Degrees)
+    } else if (d == 4) {
+        motors.largeBC.setSpeed(50, 360, MoveUnit.Degrees)
+    } else {
+        motors.largeBC.setSpeed(-50, 360, MoveUnit.Degrees)
+    }
+}
+music.playSoundEffectUntilDone(sounds.communicationGameOver)
+```

docs/coding/three-point-turn-1.md

@@ -0,0 +1,12 @@
+# Three Point Turn Activity 1
+
+```blocks
+brick.buttonEnter.onEvent(ButtonEvent.Click, function () {
+    motors.largeBC.tank(75, 30)
+    loops.pause(1500)
+    motors.largeBC.tank(-30, -75)
+    loops.pause(1000)
+    motors.largeBC.tank(50, 50)
+    loops.pause(3000)
+})
+```

docs/coding/three-point-turn-2.md

@@ -0,0 +1,14 @@
+# Three Point Turn Activity 2
+
+```blocks
+brick.buttonEnter.onEvent(ButtonEvent.Click, function () {
+    motors.largeBC.tank(75, 30)
+    loops.pause(1500)
+    motors.largeBC.tank(-30, -75)
+    sensors.ultrasonic4.pauseUntil(UltrasonicSensorEvent.ObjectNear);
+    motors.largeBC.tank(0, 0)
+    loops.pause(1000)
+    motors.largeBC.tank(50, 50)
+    loops.pause(3000)
+})
+```

docs/coding/three-point-turn-3.md

@@ -0,0 +1,15 @@
+# Three Point Turn Activity 3
+
+```blocks
+brick.buttonEnter.onEvent(ButtonEvent.Click, function () {
+    motors.largeBC.tank(75, 30)
+    loops.pause(1500)
+    motors.largeBC.tank(-30, -75)
+    sensors.ultrasonic4.pauseUntil(UltrasonicSensorEvent.ObjectNear);
+    motors.largeBC.tank(0, 0)
+    music.playSoundEffect(sounds.animalsDogBark1)
+    loops.pause(1000)
+    motors.largeBC.tank(50, 50)
+    loops.pause(3000)
+})
+```

docs/coding/traffic-lights-1.md

@@ -0,0 +1,9 @@
+# Traffic Lights Activity 1
+
+```blocks
+brick.buttonEnter.onEvent(ButtonEvent.Click, function () {
+    motors.largeBC.tank(20, 20)
+    sensors.color3.pauseForColor(ColorSensorColor.Red)
+    motors.largeBC.tank(0, 0)
+})
+```

docs/coding/traffic-lights-2.md

@@ -0,0 +1,10 @@
+# Traffic Lights Activity 2
+
+```blocks
+sensors.color3.onColorDetected(ColorSensorColor.Red, function () {
+    motors.largeBC.tank(0, 0)  
+})
+sensors.color3.onColorDetected(ColorSensorColor.Green, function () {
+    motors.largeBC.tank(20, 20)
+})
+```

docs/coding/traffic-lights-3.md

@@ -0,0 +1,11 @@
+# Traffic Lights Activity 3
+
+```blocks
+loops.forever(function () {
+    if (sensors.color3.light(LightIntensityMode.Reflected) < 15) {
+        motors.largeBC.tank(30, 12)
+    } else {
+        motors.largeBC.tank(12, 30)
+    }
+})
+```

docs/examples/core-set/gyroboy-blocks.md

@@ -0,0 +1,178 @@
+# Gyroboy
+
+Work in progress
+
+```blocks
+let motorSpeed1 = 0
+let motorSpeed2 = 0
+let motorSpeed3 = 0
+let motorSpeed = 0
+let fallen = false
+let motorSpeed0 = 0
+let oldControlDrive = 0
+let controlDrive = 0
+let power = 0
+let motorAngle = 0
+let gyroAngle = 0
+let controlSteering = 0
+let state = 0
+let motorPosition = 0
+let temp = 0
+let gyroRate = 0
+let timestep = 0
+sensors.color1.onColorDetected(ColorSensorColor.Red, function () {
+    music.playTone(2000, 100)
+    controlDrive = 0
+    controlSteering = 0
+})
+// reads the motor angle and computes the motor speed,
+// position
+function computeMotors() {
+    temp = motorAngle
+    // read angle on both motors
+    motorAngle = motors.largeD.angle() + motors.largeA.angle()
+    // and estimate speed as angle difference
+    motorSpeed0 = motorAngle - temp
+    // average last 4 speed readings
+    motorSpeed = (motorSpeed0 + motorSpeed1 + motorSpeed2 + motorSpeed3) / 4 / timestep
+    // shift all previous recorded speeds by one
+    motorSpeed3 = motorSpeed2
+    motorSpeed2 = motorSpeed1
+    motorSpeed1 = motorSpeed0
+    // compute position from speed
+    motorPosition = motorPosition + timestep * motorSpeed
+}
+// read the gyro rate and computes the angle
+function computeGyro() {
+    gyroRate = sensors.gyro2.rate()
+    gyroAngle = gyroAngle + timestep * gyroRate
+}
+function reset() {
+    state = 0
+    // sleeping
+    moods.sleeping.show();
+    // reset counters
+    motors.largeA.reset()
+    motors.largeD.reset()
+    // motors are unregulated
+    motors.largeA.setRegulated(false)
+    motors.largeD.setRegulated(false)
+    // clear the gyro sensor to remove drift
+    sensors.gyro2.reset()
+    // fall detection timer
+    control.timer2.reset()
+    // timestep computation timer
+    control.timer3.reset()
+    motorAngle = 0
+    motorPosition = 0
+    motorSpeed = 0
+    motorSpeed0 = 0
+    motorSpeed1 = 0
+    motorSpeed2 = 0
+    motorSpeed3 = 0
+    gyroRate = 0
+    gyroAngle = 0
+    fallen = false
+    power = 0
+    controlSteering = 0
+    controlDrive = 0
+    // awake
+    moods.awake.show();
+    gyroAngle = -0.25
+    state = 1;
+}
+// compute set point for motor position and required
+// motor power
+function computePower() {
+    // apply control and compute desired motor position
+    motorPosition -= timestep * controlDrive;
+    // estimate power based on sensor readings and control
+    // values
+    power = 0.8 * gyroRate + 15 * gyroAngle + (0.08 * motorSpeed + 0.12 * motorPosition) - 0.01 * controlDrive
+    // ensure that power stays within -100, 100
+    if (power > 100) {
+        power = 100
+    } else if (power < -100) {
+        power = -100
+    }
+}
+// test if the robot has fallen off
+function checkFallen() {
+    if (Math.abs(power) < 100) {
+        control.timer2.reset()
+    }
+    if (control.timer2.seconds() > 2) {
+        fallen = true
+    }
+}
+// stop all motors and wait for touch button to be
+// pressed
+function stop() {
+    motors.stopAllMotors()
+    state = 0
+    moods.knockedOut.show();
+    sensors.touch3.pauseUntil(TouchSensorEvent.Pressed)
+    moods.neutral.show();
+}
+sensors.ultrasonic4.onEvent(UltrasonicSensorEvent.ObjectNear, function () {
+    moods.dizzy.show()
+    controlSteering = 0
+    oldControlDrive = controlDrive
+    controlDrive = -10
+    motors.mediumC.setSpeed(30, 30, MoveUnit.Degrees);
+    motors.mediumC.setSpeed(-30, 60, MoveUnit.Degrees);
+    motors.mediumC.setSpeed(30, 30, MoveUnit.Degrees);
+    if (Math.randomRange(-1, 1) >= 1) {
+        controlSteering = 70
+    } else {
+        controlSteering = -70
+    }
+    loops.pause(4000)
+    music.playTone(2000, 100)
+    controlSteering = 0
+    controlDrive = oldControlDrive
+    moods.neutral.show()
+})
+// compute the elapsed time since the last iteration
+function computeTimestep() {
+    timestep = control.timer3.seconds()
+    control.timer3.reset()
+}
+sensors.color1.onColorDetected(ColorSensorColor.Green, function () {
+    moods.winking.show()
+    controlDrive = 150
+    controlSteering = 0
+})
+sensors.color1.onColorDetected(ColorSensorColor.Blue, function () {
+    moods.middleRight.show()
+    controlSteering = 70
+})
+// apply power to motors
+function controlMotors() {
+    motors.largeA.setSpeed(power + controlSteering * 0.1)
+    motors.largeD.setSpeed(power - controlSteering * 0.1)
+}
+sensors.color1.onColorDetected(ColorSensorColor.Yellow, function () {
+    moods.middleLeft.show()
+    controlSteering = -70
+})
+sensors.color1.onColorDetected(ColorSensorColor.White, function () {
+    moods.sad.show();
+    controlDrive = -75
+})
+timestep = 0.014
+// main loop
+loops.forever(function () {
+    reset()
+    while (!fallen) {
+        control.timer3.pauseUntil(5)
+        computeTimestep()
+        computeGyro()
+        computeMotors()
+        computePower()
+        controlMotors()
+        checkFallen()
+    }
+    stop()
+})
+```

docs/examples/core-set/gyroboy-labview.md

@@ -0,0 +1,215 @@
+# Gyroboy LabView
+
+```typescript
+let mSum = 0;
+let mPos = 0;
+let mSpd = 0;
+let mD = 0;
+let mDP1 = 0;
+let mDP2 = 0;
+let mDP3 = 0;
+let Crdv = 0;
+let cLo = 0;
+let gAng = 0;
+let ok = false;
+let pwr = 0;
+let Cstr = 0;
+let Cdrv = 0;
+let gMn = 0;
+let gMx = 0;
+let gSum = 0;
+let gyro = 0;
+let gOS = 0;
+let gSpd = 0;
+let tInt = 0.014;
+let lpwr = 0
+let rpwr = 0
+let tStart = 0
+let st = 0
+let oldDr = 0
+
+function RST() {
+    motors.largeA.reset()
+    motors.largeD.reset()
+    motors.largeA.setRegulated(false)
+    motors.largeD.setRegulated(false)
+    sensors.gyro2.reset()
+    sensors.gyro2.rate()
+    control.timer2.reset()
+    loops.pause(5000)
+    mSum = 0;
+    mPos = 0;
+    mD = 0;
+    mDP1 = 0;
+    mDP2 = 0;
+    mDP3 = 0;
+    Crdv = 0;
+    cLo = 0;
+    gAng = 0;
+    ok = false;
+    pwr = 0;
+    st = 0;
+    Cstr = 0;
+    Cdrv = 0;
+}
+
+function OS() {
+    // OSL
+    do {
+        gMn = 1000;
+        gMx = -100;
+        gSum = 0;
+        // gChk
+        for (let i = 0; i < 200; i++) {
+            gyro = sensors.gyro2.rate()
+            gSum = gyro;
+            gMx = Math.max(gMx, gyro)
+            gMn = Math.min(gMn, gyro)
+            loops.pause(4);
+        }
+    } while (gMx - gMn > 2);
+    gOS = gSum / 200;
+}
+
+function GT() {
+    if (cLo == 0) {
+        tInt = 0.014;
+        control.timer1.reset();
+    } else {
+        tInt = control.timer1.seconds() / cLo;
+    }
+    cLo++;
+}
+
+function GG() {
+    gyro = sensors.gyro2.rate();
+    gOS = 0.0005 * gyro + (1 - 0.0005) * gOS
+    gSpd = gyro - gOS;
+    gAng = gAng + tInt * gSpd;
+}
+
+function GM() {
+    let temp = mSum
+    mSum = motors.largeD.angle() + motors.largeA.angle();
+    mD = mSum - temp;
+    mPos = mPos + mD;
+    mSpd = ((mDP1 + mDP2 + mDP3 + mD) / 4) / tInt;
+    mDP3 = mDP2;
+    mDP2 = mDP1;
+    mDP1 = mD;
+}
+
+function EQ() {
+    mPos = mPos - Cdrv * tInt;
+    pwr = (0.8 * gSpd + 15 * gAng) + (0.08 * mSpd + 0.12 * mPos) - 0.01 * Cdrv
+    if (pwr > 100) pwr = 100
+    else if (pwr < -100) pwr = -100
+}
+
+function cntrl() {
+    mPos = mPos - tInt * Cdrv
+    lpwr = (pwr + Cstr * 0.1)
+    rpwr = (pwr - Cstr * 0.1)
+}
+
+function CHK() {
+    if (Math.abs(pwr) < 100)
+        control.timer2.reset();
+    if (control.timer2.seconds() > 2) {
+        ok = true;
+    }
+}
+
+// M
+loops.forever(function () {
+    RST();
+    brick.showImage(images.eyesSleeping)
+    OS()
+    gAng = -0.25;
+    music.playSoundEffect(sounds.movementsSpeedUp)
+    brick.showImage(images.eyesAwake)
+    st = 1;
+    // BALANCE
+    while (!ok) {
+        GT();
+        let t1 = control.timer1.millis()
+        GG();
+        GM();
+        EQ();
+        cntrl();
+        motors.largeA.setSpeed(lpwr)
+        motors.largeD.setSpeed(rpwr)
+        CHK()
+        let t2 = control.timer1.millis();
+        let p = 5 - (t2 - t1);
+        loops.pause(Math.max(1, p))
+    }
+    motors.stopAllMotors()
+    st = 0;
+    brick.setLight(BrickLight.RedPulse);
+    brick.showImage(images.eyesKnockedOut)
+    music.playSoundEffect(sounds.movementsSpeedDown)
+    sensors.touch3.pauseUntil(TouchSensorEvent.Pressed)
+    brick.setLight(BrickLight.Off);
+})
+
+// BHV
+loops.forever(function () {
+    switch (st) {
+        case 0:
+            Cdrv = 0;
+            Cstr = 0;
+            break;
+        case 1:
+            Cdrv = 40;
+            loops.pause(4000);
+            Cdrv = 0;
+            music.playTone(1000, 100);
+            st = 2;
+            break;
+        case 2:
+            switch (sensors.color1.color()) {
+                case ColorSensorColor.Red:
+                    music.playTone(2000, 100);
+                    Cdrv = 0;
+                    Cstr = 0;
+                    break;
+                case ColorSensorColor.Green:
+                    music.playTone(2000, 100);
+                    Cdrv = 150;
+                    Cstr = 0;
+                    break;
+                case ColorSensorColor.Blue:
+                    music.playTone(2000, 100);
+                    Cstr = 70;
+                    break;
+                case ColorSensorColor.Yellow:
+                    music.playTone(2000, 100);
+                    Cstr = -70;
+                    break;
+                case ColorSensorColor.White:
+                    music.playTone(2000, 100);
+                    Cdrv = -75;
+                    break;
+            }
+            if (sensors.ultrasonic4.distance() < 25) {
+                Cstr = 0;
+                oldDr = Cdrv;
+                Cdrv = -10;
+                motors.mediumC.setSpeed(30, 30, MoveUnit.Degrees);
+                motors.mediumC.setSpeed(-30, 60, MoveUnit.Degrees);
+                motors.mediumC.setSpeed(30, 30, MoveUnit.Degrees);
+                if (Math.randomRange(-1, 1) >= 1)
+                    Cstr = 70;
+                else
+                    Cstr = -70;
+                loops.pause(4000);
+                music.playTone(2000, 100)
+                Cstr = 0;
+                Cdrv = oldDr;
+            }
+            break;
+    }
+    loops.pause(80);
+})
+```

docs/examples/core-set/puppy-labview.md

@@ -0,0 +1,390 @@
+# Puppy
+
+```typescript
+let P_T = 0;
+let ISS = 0;
+let F_T = 0;
+let P_C = 0;
+let F_C = 0;
+let DB_S = 0;
+let NS = false;
+let IBP = 0;
+let IAP = 0;
+let C = false;
+let TC = false;
+let OTC = false;
+let COL = 0;
+let OCOL = 0;
+let _C = false;
+let GTO = 0;
+
+function DN() {
+    motors.largeAD.setBrake(true);
+    motors.largeAD.tank(50, 50, 1, MoveUnit.Seconds);
+    loops.pause(100);
+    motors.largeA.clearCounts()
+    motors.largeD.clearCounts()
+}
+
+function MNRH() {
+    motors.mediumC.setBrake(true)
+    brick.showImage(images.legoEv3icon)
+    brick.setLight(BrickLight.OrangePulse)
+    while (!brick.buttonEnter.wasPressed()) {
+        if (brick.buttonUp.wasPressed()) {
+            motors.mediumC.setSpeed(-100);
+        } else if (brick.buttonDown.wasPressed()) {
+            motors.mediumC.setSpeed(100);
+        } else {
+            motors.mediumC.stop();
+        }
+    }
+    motors.mediumC.stop();
+    motors.mediumC.clearCounts();
+    brick.setLight(BrickLight.Green);
+}
+
+function IS(t: number) {
+    ISS = t;
+    switch (t) {
+        case 0:
+            brick.showImage(images.eyesNeutral);
+            break;
+        case 1:
+            brick.showImage(images.eyesSleeping);
+            break;
+        case 2:
+            brick.showImage(images.eyesTear);
+            // draw rect...
+            break;
+        case 3:
+            brick.showImage(images.eyesHurt);
+            break;
+        case 4:
+            brick.showImage(images.eyesAngry);
+            break;
+        case 5:
+            brick.showImage(images.eyesTiredMiddle);
+            break;
+        case 6:
+            brick.showImage(images.eyesTiredRight);
+            break;
+        case 7:
+            brick.showImage(images.eyesTiredLeft);
+            break;
+        case 8:
+            brick.showImage(images.eyesLove);
+            break;
+    }
+
+}
+
+function UP() {
+    if (motors.largeA.angle() > -50) {
+        control.runInParallel(function () {
+            motors.largeD.clearCounts()
+            motors.largeD.setSpeed(-35);
+            pauseUntil(() => motors.largeD.angle() < -25);
+            motors.largeD.stop();
+            motors.largeD.setRegulated(false)
+            motors.largeD.setSpeed(-15)
+            pauseUntil(() => motors.largeD.angle() < -65);
+            motors.largeD.stop();
+        })
+        motors.largeA.clearCounts()
+        motors.largeA.setSpeed(-35);
+        pauseUntil(() => motors.largeA.angle() < -25);
+        motors.largeA.stop();
+        motors.largeA.setRegulated(false)
+        motors.largeA.setSpeed(-15)
+        pauseUntil(() => motors.largeA.angle() < -65);
+        motors.largeA.stop();
+
+        loops.pause(500);
+    }
+}
+
+function RST() {
+    P_T = Math.randomRange(3, 6);
+    F_T = Math.randomRange(2, 4);
+    P_C = 1;
+    F_C = 1;
+    control.timer1.reset();
+    control.timer2.reset();
+    control.timer3.reset();
+    CS(0);
+}
+
+function CS(db: number) {
+    if (DB_S != db) {
+        DB_S = db;
+        NS = true;
+    }
+}
+
+function MON() {
+    if (control.timer2.seconds() > 10) {
+        control.timer2.reset();
+        P_C--;
+        if (P_C < 0) {
+            P_C = 0;
+        }
+    }
+    if (control.timer1.seconds() > 20) {
+        control.timer1.reset()
+        F_C--;
+        if (F_C < 0) {
+            F_C = 0;
+        }
+    }
+    if (control.timer3.seconds() > 30) {
+        control.timer3.reset();
+        CS(1);
+    }
+}
+
+function UIS() {
+    if (control.timer5.seconds() > IBP) {
+        control.timer5.reset();
+        if (ISS == 1) {
+            ISS = 6;
+            IBP = Math.randomRange(1, 5);
+        } else {
+            ISS = 1;
+            IBP = 0.25;
+        }
+        IS(ISS);
+    }
+    if (control.timer6.seconds() > IAP) {
+        if (ISS != 1) {
+            control.timer6.reset();
+            IAP = Math.randomRange(1, 10)
+            if (ISS != 7) {
+                ISS = 7
+            } else {
+                ISS = 6;
+            }
+            IS(ISS);
+        }
+    }
+}
+
+function UPDB() {
+    if ((P_T == P_C) && (F_T == F_C)) {
+        CS(6);
+    }
+    if ((P_T > P_C) && (F_T < F_C)) {
+        CS(3);
+    }
+    if ((P_T < P_C) && (F_T > F_C)) {
+        CS(5);
+    }
+    if ((P_C == 0) && (F_C > 0)) {
+        CS(2)
+    }
+    if (F_C == 0) {
+        CS(4)
+    }
+}
+
+function PTC() {
+    C = false;
+    OTC = TC;
+    TC = sensors.touch1.isPressed()
+    if (TC != OTC && TC) {
+        P_C++;
+        control.timer3.reset();
+        if (DB_S != 4) {
+            IS(2);
+            music.playSoundEffect(sounds.animalsDogSniff);
+            C = true;
+        }
+    }
+    return C;
+}
+
+function FDC() {
+    OCOL = COL;
+    COL = sensors.color4.color();
+    _C = false;
+    if ((COL != 0) && (OCOL != COL)) {
+        F_C++;
+        _C = true;
+        control.timer3.reset();
+        IS(2);
+        music.playSoundEffect(sounds.expressionsCrunching)
+    }
+    return _C;
+}
+
+function IDL() {
+    if (NS) {
+        NS = false;
+        UP();
+    }
+    UIS();
+    UPDB();
+    PTC();
+    FDC();
+}
+
+function MHT(Pos: number) {
+    let _R = Pos - motors.mediumC.angle();
+    if (_R >= 0) {
+        motors.mediumC.setSpeed(100, _R, MoveUnit.Degrees);
+    } else {
+        motors.mediumC.setSpeed(-100, Math.abs(_R), MoveUnit.Degrees);
+    }
+}
+
+function SLP() {
+    if (NS) {
+        NS = false;
+        IS(5)
+        DN()
+        MHT(3000)
+        IS(1)
+        music.playSoundEffect(sounds.expressionsSnoring)
+    }
+    if (sensors.touch1.isPressed() || brick.buttonEnter.isPressed()) {
+        music.stopAllSounds();
+        control.timer3.reset();
+        CS(7);
+    }
+}
+
+function PLF() {
+    if (NS) {
+        NS = false
+        IS(0)
+        UP()
+        music.playSoundEffect(sounds.animalsDogBark2)
+        control.timer4.reset()
+        GTO = Math.randomRange(4, 8);
+    }
+    if(PTC()) {
+        CS(0);
+    }
+    if (control.timer4.seconds() > GTO) {
+        music.playSoundEffect(sounds.animalsDogBark2)
+        control.timer4.reset();
+        GTO = Math.randomRange(4, 8);
+    }
+}
+
+function NGR() {
+    NS = false
+    IS(4)
+    music.playSoundEffect(sounds.animalsDogGrowl);
+    UP();
+    loops.pause(1500);
+    music.stopAllSounds()
+    music.playSoundEffect(sounds.animalsDogBark1)
+    P_C--;
+    CS(0);
+}
+
+function HNG() {
+    if (NS) {
+        NS = false;
+        IS(3)
+        DN();
+        music.playSoundEffect(sounds.animalsDogWhine);        
+    }
+    if(FDC()) {
+        CS(0)
+    }
+    if (PTC()) {
+        CS(3);
+    }
+}
+
+function PPP() {
+    NS = false;
+    IS(2);
+    UP();
+    loops.pause(100)
+    motors.largeA.setSpeed(-30, 70, MoveUnit.Degrees);
+    loops.pause(800);
+    music.playSoundEffect(sounds.mechanicalHorn1);
+    loops.pause(1000);
+    for(let i = 0; i < 3; ++i) {
+        motors.largeA.setSpeed(-30, 20, MoveUnit.Degrees);
+        motors.largeA.setSpeed(30, 20, MoveUnit.Degrees);
+    }
+    motors.largeA.setSpeed(30, 70, MoveUnit.Degrees);
+    F_C = 1;
+    CS(0);
+}
+
+function HPY() {
+    IS(8)
+    MHT(0);
+    motors.largeAD.setSpeed(10, 0.8, MoveUnit.Seconds);
+    for(let i = 0; i < 3; ++i) {
+        music.playSoundEffect(sounds.animalsDogBark1);
+        motors.largeAD.setSpeed(-100, 0.2, MoveUnit.Seconds);
+        loops.pause(300)
+        motors.largeAD.setSpeed(10, 0.3, MoveUnit.Seconds)
+    }
+    loops.pause(500);
+    music.stopAllSounds();
+    DN();
+    RST();
+}
+
+function STL() {
+    UP();
+    motors.largeAD.setSpeed(-20, 60, MoveUnit.Degrees);
+    music.playSoundEffect(sounds.animalsDogWhine);
+    motors.largeAD.setSpeed(20, 60, MoveUnit.Degrees);
+}
+
+function WKU() {
+    let stateC = false;
+    IS(5);
+    music.playSoundEffect(sounds.animalsDogWhine)
+    MHT(0)
+    DN()
+    STL()
+    loops.pause(1000);
+    UP()
+    CS(0;)
+}
+
+DN();
+MNRH();
+// compare button state???
+IS(1);
+UP();
+RST();
+loops.forever(function () {
+    MON();
+    switch (DB_S) {
+        case 0:
+            IDL();
+            break;
+        case 1:
+            SLP();
+            break;
+        case 2:
+            PLF();
+            break;
+        case 3:
+            NGR();
+            break;
+        case 4:
+            HNG();
+            break;
+        case 5:
+            PPP();
+            break;
+        case 6:
+            HPY();
+            break;
+        case 7:
+            WKU();
+            break;
+    }
+})
+```

docs/examples/core-set/robotarm-labview.md

@@ -0,0 +1,51 @@
+# Robot Arm
+
+```typescript
+function INI() {
+    motors.largeB.setBrake(true)
+    motors.largeC.setBrake(true)
+    motors.mediumA.setBrake(true)
+    motors.largeB.setSpeed(-50)
+    pauseUntil(() => sensors.color3.light(LightIntensityMode.Reflected) > 25);
+    motors.largeB.stop();
+    motors.mediumA.setSpeed(30, 1, MoveUnit.Seconds);
+    motors.mediumA.setSpeed(-50, 90, MoveUnit.Degrees);
+    motors.largeC.setSpeed(50)
+    sensors.touch1.pauseUntil(TouchSensorEvent.Pressed);
+    motors.largeC.setSpeed(-50, 0.86, MoveUnit.Rotations);
+}
+
+INI()
+
+let down = false;
+loops.forever(function () {
+    brick.showImage(images.informationQuestionMark)
+    brick.setLight(BrickLight.OrangePulse);
+    pauseUntil(() => (down = brick.buttonDown.wasPressed()) || brick.buttonUp.wasPressed())
+    brick.setLight(BrickLight.Off)
+    music.playSoundEffect(sounds.mechanicalAirRelease)
+    brick.showImage(images.informationAccept)
+    if (down) {
+        brick.showImage(images.informationForward)
+        motors.largeC.setSpeed(65, 0.85, MoveUnit.Rotations);
+    } else {
+        brick.showImage(images.informationBackward)
+        motors.largeC.setSpeed(-65, 0.85, MoveUnit.Rotations);
+    }
+    motors.largeB.setSpeed(20, 275, MoveUnit.Degrees)
+    motors.mediumA.setSpeed(30, 1, MoveUnit.Seconds)
+    motors.largeB.setSpeed(-55)
+    pauseUntil(() => sensors.color3.light(LightIntensityMode.Reflected) > 25);
+    motors.largeB.stop();
+    if (down) {
+        motors.largeC.setSpeed(-65, 0.86, MoveUnit.Rotations);
+    } else {
+        motors.largeC.setSpeed(65, 0.85, MoveUnit.Rotations);
+    }
+    motors.largeB.setSpeed(20, 275, MoveUnit.Degrees);
+    motors.mediumA.setSpeed(-30, 90, MoveUnit.Degrees);
+    motors.largeB.setSpeed(-55)
+    pauseUntil(() => sensors.color3.light(LightIntensityMode.Reflected) > 25);
+    motors.largeB.stop()
+})
+```

docs/examples/crane-labview.md

@@ -0,0 +1,51 @@
+# Crane LabView
+
+```blocks
+function INI() {
+    motors.largeB.setBrake(true)
+    motors.largeC.setBrake(true)
+    motors.mediumA.setBrake(true)
+    motors.largeB.setSpeed(-50)
+    pauseUntil(() => sensors.color3.light(LightIntensityMode.Reflected) > 25);
+    motors.largeB.stop();
+    motors.mediumA.setSpeed(30, 1, MoveUnit.Seconds);
+    motors.mediumA.setSpeed(-50, 90, MoveUnit.Degrees);
+    motors.largeC.setSpeed(50)
+    sensors.touch1.pauseUntil(TouchSensorEvent.Pressed);
+    motors.largeC.setSpeed(-50, 0.86, MoveUnit.Rotations);
+}
+
+INI()
+
+let down = false;
+loops.forever(function () {
+    brick.showImage(images.informationQuestionMark)
+    brick.setLight(BrickLight.OrangePulse);
+    pauseUntil(() => (down = brick.buttonDown.wasPressed()) || brick.buttonUp.wasPressed())
+    brick.setLight(BrickLight.Off)
+    music.playSoundEffect(sounds.mechanicalAirRelease)
+    brick.showImage(images.informationAccept)
+    if (down) {
+        brick.showImage(images.informationForward)
+        motors.largeC.setSpeed(65, 0.85, MoveUnit.Rotations);
+    } else {
+        brick.showImage(images.informationBackward)
+        motors.largeC.setSpeed(-65, 0.85, MoveUnit.Rotations);
+    }
+    motors.largeB.setSpeed(20, 275, MoveUnit.Degrees)
+    motors.mediumA.setSpeed(30, 1, MoveUnit.Seconds)
+    motors.largeB.setSpeed(-55)
+    pauseUntil(() => sensors.color3.light(LightIntensityMode.Reflected) > 25);
+    motors.largeB.stop();
+    if (down) {
+        motors.largeC.setSpeed(-65, 0.86, MoveUnit.Rotations);
+    } else {
+        motors.largeC.setSpeed(65, 0.85, MoveUnit.Rotations);
+    }
+    motors.largeB.setSpeed(20, 275, MoveUnit.Degrees);
+    motors.mediumA.setSpeed(-30, 90, MoveUnit.Degrees);
+    motors.largeB.setSpeed(-55)
+    pauseUntil(() => sensors.color3.light(LightIntensityMode.Reflected) > 25);
+    motors.largeB.stop()
+})
+```

docs/examples/gyro-boy-labview.md

@@ -0,0 +1,215 @@
+# Gyro Boy LabView
+
+```blocks
+let mSum = 0;
+let mPos = 0;
+let mSpd = 0;
+let mD = 0;
+let mDP1 = 0;
+let mDP2 = 0;
+let mDP3 = 0;
+let Crdv = 0;
+let cLo = 0;
+let gAng = 0;
+let ok = false;
+let pwr = 0;
+let Cstr = 0;
+let Cdrv = 0;
+let gMn = 0;
+let gMx = 0;
+let gSum = 0;
+let gyro = 0;
+let gOS = 0;
+let gSpd = 0;
+let tInt = 0.014;
+let lpwr = 0
+let rpwr = 0
+let tStart = 0
+let st = 0
+let oldDr = 0
+
+function RST() {
+    motors.largeA.reset()
+    motors.largeD.reset()
+    motors.largeA.setRegulated(false)
+    motors.largeD.setRegulated(false)
+    sensors.gyro2.reset()
+    sensors.gyro2.rate()
+    control.timer2.reset()
+    loops.pause(5000)
+    mSum = 0;
+    mPos = 0;
+    mD = 0;
+    mDP1 = 0;
+    mDP2 = 0;
+    mDP3 = 0;
+    Crdv = 0;
+    cLo = 0;
+    gAng = 0;
+    ok = false;
+    pwr = 0;
+    st = 0;
+    Cstr = 0;
+    Cdrv = 0;
+}
+
+function OS() {
+    // OSL
+    do {
+        gMn = 1000;
+        gMx = -100;
+        gSum = 0;
+        // gChk
+        for (let i = 0; i < 200; i++) {
+            gyro = sensors.gyro2.rate()
+            gSum = gyro;
+            gMx = Math.max(gMx, gyro)
+            gMn = Math.min(gMn, gyro)
+            loops.pause(4);
+        }
+    } while (gMx - gMn > 2);
+    gOS = gSum / 200;
+}
+
+function GT() {
+    if (cLo == 0) {
+        tInt = 0.014;
+        control.timer1.reset();
+    } else {
+        tInt = control.timer1.seconds() / cLo;
+    }
+    cLo++;
+}
+
+function GG() {
+    gyro = sensors.gyro2.rate();
+    gOS = 0.0005 * gyro + (1 - 0.0005) * gOS
+    gSpd = gyro - gOS;
+    gAng = gAng + tInt * gSpd;
+}
+
+function GM() {
+    let temp = mSum
+    mSum = motors.largeD.angle() + motors.largeA.angle();
+    mD = mSum - temp;
+    mPos = mPos + mD;
+    mSpd = ((mDP1 + mDP2 + mDP3 + mD) / 4) / tInt;
+    mDP3 = mDP2;
+    mDP2 = mDP1;
+    mDP1 = mD;
+}
+
+function EQ() {
+    mPos = mPos - Cdrv * tInt;
+    pwr = (0.8 * gSpd + 15 * gAng) + (0.095 * mSpd + 0.13 * mPos) - 0.01 * Cdrv
+    if (pwr > 100) pwr = 100
+    else if (pwr < -100) pwr = -100
+}
+
+function cntrl() {
+    mPos = mPos - tInt * Cdrv
+    lpwr = (pwr + Cstr * 0.1)
+    rpwr = (pwr - Cstr * 0.1)
+}
+
+function CHK() {
+    if (Math.abs(pwr) < 100)
+        control.timer2.reset();
+    if (control.timer2.seconds() > 2) {
+        ok = true;
+    }
+}
+
+// M
+loops.forever(function () {
+    RST();
+    brick.showImage(images.eyesSleeping)
+    OS()
+    gAng = -0.25;
+    music.playSoundEffect(sounds.movementsSpeedUp)
+    brick.showImage(images.eyesAwake)
+    st = 1;
+    // BALANCE
+    while (!ok) {
+        GT();
+        let t1 = control.timer1.millis()
+        GG();
+        GM();
+        EQ();
+        cntrl();
+        motors.largeA.setSpeed(lpwr)
+        motors.largeD.setSpeed(rpwr)
+        CHK()
+        let t2 = control.timer1.millis();
+        let p = 5 - (t2 - t1);
+        loops.pause(Math.max(1, p))
+    }
+    motors.stopAllMotors()
+    st = 0;
+    brick.setLight(BrickLight.RedPulse);
+    brick.showImage(images.eyesKnockedOut)
+    music.playSoundEffect(sounds.movementsSpeedDown)
+    sensors.touch3.pauseUntil(TouchSensorEvent.Pressed)
+    brick.setLight(BrickLight.Off);
+})
+
+// BHV
+loops.forever(function () {
+    switch (st) {
+        case 0:
+            Cdrv = 0;
+            Cstr = 0;
+            break;
+        case 1:
+            Cdrv = 40;
+            loops.pause(4000);
+            Cdrv = 0;
+            music.playTone(1000, 100);
+            st = 2;
+            break;
+        case 2:
+            switch (sensors.color1.color()) {
+                case ColorSensorColor.Red:
+                    music.playTone(2000, 100);
+                    Cdrv = 0;
+                    Cstr = 0;
+                    break;
+                case ColorSensorColor.Green:
+                    music.playTone(2000, 100);
+                    Cdrv = 150;
+                    Cstr = 0;
+                    break;
+                case ColorSensorColor.Blue:
+                    music.playTone(2000, 100);
+                    Cstr = 70;
+                    break;
+                case ColorSensorColor.Yellow:
+                    music.playTone(2000, 100);
+                    Cstr = -70;
+                    break;
+                case ColorSensorColor.White:
+                    music.playTone(2000, 100);
+                    Cdrv = -75;
+                    break;
+            }
+            if (sensors.ultrasonic4.distance() < 25) {
+                Cstr = 0;
+                oldDr = Cdrv;
+                Cdrv = -10;
+                motors.mediumC.setSpeed(30, 30, MoveUnit.Degrees);
+                motors.mediumC.setSpeed(-30, 60, MoveUnit.Degrees);
+                motors.mediumC.setSpeed(30, 30, MoveUnit.Degrees);
+                if (Math.randomRange(-1, 1) >= 1)
+                    Cstr = 70;
+                else
+                    Cstr = -70;
+                loops.pause(4000);
+                music.playTone(2000, 100)
+                Cstr = 0;
+                Cdrv = oldDr;
+            }
+            break;
+    }
+    loops.pause(80);
+})
+```

docs/examples/happy-unhappy.md

@@ -3,10 +3,10 @@
 Use a touch sensor to make the brick happy.
 
 ```blocks
-sensors.touchSensor1.onEvent(TouchSensorEvent.Pressed, function () {
+sensors.touch1.onEvent(TouchSensorEvent.Pressed, function () {
     brick.showImage(images.expressionsBigSmile)
 })
-sensors.touchSensor1.onEvent(TouchSensorEvent.Released, function () {
+sensors.touch1.onEvent(TouchSensorEvent.Released, function () {
     brick.showImage(images.expressionsSick)
 })
 ```

docs/examples/line-follower-pid.md

@@ -0,0 +1,50 @@
+# Gradien follower PID + calibration
+
+```blocks
+let lasterror = 0
+let D = 0
+let I = 0
+let P = 0
+let error = 0
+let setpoint = 0
+let max = 0
+let min = 0
+let v = 0
+v = sensors.color3.light(LightIntensityMode.Reflected)
+min = v
+max = v
+setpoint = v
+while (!(brick.buttonEnter.wasPressed())) {
+    brick.clearScreen()
+    brick.showString("Move robot on terrain", 1)
+    brick.showString("Press ENTER when done", 2)
+    v = sensors.color3.light(LightIntensityMode.Reflected)
+    min = Math.min(min, v)
+    max = Math.max(max, v)
+    setpoint = (max + min) / 2
+    brick.showValue("v", v, 3)
+    brick.showValue("min", min, 4)
+    brick.showValue("max", v, 5)
+    brick.showValue("setpoint", setpoint, 6)
+    loops.pause(100)
+}
+loops.forever(function () {
+    brick.clearScreen()
+    v = sensors.color3.light(LightIntensityMode.Reflected)
+    brick.showValue("light", v, 1)
+    error = v - setpoint
+    brick.showValue("error", error, 2)
+    P = error * 5
+    brick.showValue("P", P, 3)
+    I = I + error * 0.01
+    brick.showValue("I", I, 4)
+    D = (error - lasterror) * 0.2
+    brick.showValue("D", D, 5)
+    motors.largeBC.steer(P + (I + D), 100)
+    lasterror = error
+    if (brick.buttonEnter.wasPressed()) {
+        motors.largeBC.setSpeed(0)
+        brick.buttonDown.pauseUntil(ButtonEvent.Click)
+    }
+})
+```

docs/lessons.md

@@ -0,0 +1,27 @@
+# Lessons
+
+Learning activities for LEGO Mindstorms with MakeCode.
+
+## Motors and motion
+
+```codecard
+[{
+    "name": "Make it Move",
+    "imageUrl":"/static/lessons/make-it-move.jpg",
+    "url": "/lessons/make-it-move",
+    "cardType": "project",
+    "description": "Make a robot that moves itself without wheels."
+}, {
+    "name": "Make it Move TUTORIAL",
+    "imageUrl":"/static/lessons/make-it-move.jpg",
+    "url": "/lessons/make-it-move-tutorial",
+    "cardType": "tutorial",
+    "description": "Make a robot that moves itself without wheels."
+}, {
+    "name": "Line Detection",
+    "imageUrl":"/static/lessons/line-detection.jpg",
+    "url": "/lessons/line-detection",
+    "cardType": "project",
+    "description": "Make your robot drive itself by following lines."
+}]
+```

docs/lessons/line-detection.md

@@ -0,0 +1,266 @@
+# Line Detection
+
+## Objective
+
+Design ways to improve driving safety by helping to prevent drivers from falling asleep and causing an accident.
+ 
+![Car driving on highway](/static/lessons/line-detection/car-driving.jpg)
+
+## Connect
+
+Make sure that you can answer the following questions:
+
+* Can autonomous cars react to different traffic light signals?
+* What can happen if a driver falls asleep while driving?
+* How can we detect when a driver is falling asleep?
+
+Think about what you have learned, then document it. Describe the problem in your own words. Creatively record your ideas and findings.
+
+## Construct
+
+Start by constructing this model. Read the building instructions [here](https://le-www-live-s.legocdn.com/sc/media/lessons/mindstorms-ev3/building-instructions/ev3-rem-color-sensor-down-driving-base-d30ed30610c3d6647d56e17bc64cf6e2.pdf) first.
+
+![Color sensor on the driving base](/static/lessons/line-detection/color-sensor-driving.jpg)
+
+## Program
+
+Autonomous cars need to recognize and respond to traffic lights automatically.
+First, create a program that will make your robot stop at red lights.
+Make sure your robot is only responding to the color red.
+Once you have succeeded, program your robot to drive forward again when the light changes from red to green.
+
+There are two coding tasks for this lesson:
+
+1. Create a program that will make your robot stop at red lights.
+2. Create a program that drives the robot forward until the Color Sensor sees red. The robot then stops.
+
+## Coding task 1 - Stop at red lights
+
+**Goal:** Create a program that will make your robot stop at red lights.
+
+### Step 1
+
+Create a program that drives the robot forward until the Color Sensor sees red. The robot then stops.
+
+Place a ``||motors:steer large B+C||`` block from ``||motors:Motors||`` under ``||loops:on start||``. Change the speed to 20%.
+
+```blocks 
+motors.largeBC.steer(0, 20)
+```
+
+### Step 2
+
+Place a ``||loops:while||`` loop block under ``||motors:steer large B+C||``.  
+
+```blocks
+motors.largeBC.steer(0, 20)
+while (true) {
+}
+```
+
+### Step 3
+
+Place a ``||sensors:pause for color||`` from ``||sensors:Sensors||`` inside the ``||loops:while||`` loop block. Change the color to red.
+ 
+```blocks
+motors.largeBC.steer(0, 20)
+while (true) {
+    sensors.color3.pauseForColor(ColorSensorColor.Red)
+}
+```
+
+### Step 4
+
+Place a ``||motors:stop all motors||`` block under the ``||sensors:pause for color||`` block.
+
+Study the program...what do you think the program will do?
+
+**Hint:** The motors will run until the Color Sensor senses the color red, then all motors will stop. The motors will run until the sensor reading in the while block is true.
+
+```blocks
+motors.largeBC.steer(0, 20)
+while (true) {
+    sensors.color3.pauseForColor(ColorSensorColor.Red)
+    motors.stopAllMotors()
+}
+```
+
+### Step 5
+
+Click `|Download|` and follow the instructions to get your code onto your EV3 Brick. Press the **center** button on the EV3 Brick to run the program.
+
+## Coding task 2 - Detect light changes
+
+**Goal:** Program your robot to drive forward again when the light changes from red to green.
+
+### Step 1
+
+Place a ``||loops:while||`` loop block under ``||loops:on start||``.
+
+```blocks
+while (true) {
+    
+}
+```
+
+### Step 2
+
+Place a ``||motors:steer large B+C||`` block from ``||motors:Motors||`` inside the ``||loops:while||`` loop block. Change the speed to 20%.
+
+```blocks
+while (true) {
+    motors.largeBC.steer(0, 20)
+}
+```
+ 
+### Step 4
+
+Place a ``||loops:while||`` loop block under the ``||motors:steer large B+C||``  block.
+
+```blocks
+while (true) {
+    motors.largeBC.steer(0, 20)
+    while (true) {
+        
+    }
+}
+```
+
+### Step 5
+
+Place a ``||sensors:pause for color||`` block from ``||sensors:Sensors||`` inside the ``||loops:while||`` loop block. Change the color to red.
+
+```blocks
+while (true) {
+    motors.largeBC.steer(0, 20)
+    while (true) {
+        sensors.color3.pauseForColor(ColorSensorColor.Red)
+    }
+}
+```
+
+### Step 6
+
+Place a ``||motors:stop all motors||`` block under the ``||sensors:pause for color||`` block.  
+
+```blocks
+while (true) {
+    motors.largeBC.steer(0, 20)
+    while (true) {
+        sensors.color3.pauseForColor(ColorSensorColor.Red)
+        motors.stopAllMotors()
+    }
+}
+```
+
+### Step 7
+
+Place a ``||loops:while||`` loop block under the second ``||loops:while||`` loop block.
+
+```blocks
+while (true) {
+    motors.largeBC.steer(0, 20)
+    while (true) {
+        sensors.color3.pauseForColor(ColorSensorColor.Red)
+        motors.stopAllMotors()
+    }
+    while (true) {
+        
+    }
+}
+```
+
+### Step 8
+
+Place a ``||sensors:pause for color||`` block inside the new ``||loops:while||`` loop block. Change the color to red.
+
+What do you think the program will do?
+
+**Hint:** The motors will run until the Color Sensor detects the color red, then it will stop all motors. The motors will also run and not stop when the color sensor detects the color green.
+ 
+```blocks
+while (true) {
+    motors.largeBC.steer(0, 20)
+    while (true) {
+        sensors.color3.pauseForColor(ColorSensorColor.Red)
+        motors.stopAllMotors()
+    }
+    while (true) {
+        sensors.color3.pauseForColor(ColorSensorColor.Red)
+    }
+}
+```
+
+### Step 9
+
+Click `|Download|` and follow the instructions to get your code onto your EV3 Brick. Press the **center** button on the EV3 Brick to run the program.
+ 
+## Contemplate
+
+To simulate what could happen if a driver falls asleep while driving, your robot could sound an alarm signal when it crosses the line. This feature is often available in new cars.
+
+Program your robot to perform this function.
+
+Think about what you have learned, then document it. Describe your pseudocode for this task. Creatively record your ideas, and findings.
+
+### Programming hint
+
+```blocks
+motors.largeBC.steer(0, 20)
+while (true) {
+sensors.color3.pauseForColor(ColorSensorColor.Yellow)
+music.playSoundEffect(sounds.systemGeneralAlert)
+}
+while (true) {
+    while (true) {      sensors.color3.pauseForLight(LightIntensityMode.Reflected, LightCondition.Bright)
+        motors.largeB.setSpeed(10)
+        motors.largeC.setSpeed(-10)
+    }
+    while (true) {
+        sensors.color3.pauseForLight(LightIntensityMode.Reflected, LightCondition.Bright)
+        motors.largeA.setSpeed(-10)
+        motors.largeA.setSpeed(10)
+    }
+}
+```
+
+## Continue
+
+Program your robot to drive on “autopilot” along a given route. You will need to create a program that recognizes and responds to a dark line (or white line). You will create a line-following program and your robot will need to travel along the line without losing contact with it.
+
+You will need to constantly debug your program in order to make your robot travel as smoothly as possible along the line.
+
+### Programming hint
+
+```blocks
+while (true) {
+    while (true) {   sensors.color3.pauseForLight(LightIntensityMode.Reflected, LightCondition.Bright)
+        motors.largeB.setSpeed(10)
+        motors.largeC.setSpeed(-10)
+    }
+    while (true) {
+        sensors.color3.pauseForLight(LightIntensityMode.Reflected, LightCondition.Bright)
+        motors.largeB.setSpeed(-10)
+        motors.largeC.setSpeed(10)
+    }
+}
+```
+
+## Share
+
+Consider the following questions:
+
+1. What challenged you? 
+2. Where there any surprises? 
+3. How could you improve your program?
+4. Could your program have been more streamlined? 
+5. Have you used too many blocks?
+6. Is there a more efficient way of building your program?
+7. How could your program be used in real-world scenarios?
+
+Think about what you have learned, then document it. Creatively record and present your ideas, creations, and findings.
+
+
+
+
+

docs/lessons/make-it-move-tutorial.md

@@ -0,0 +1,72 @@
+# Make It Move Without Wheels 
+
+## Objective @unplugged
+
+Design, build and program a robot that can move itself:
+
+Your robot will:
+
+* Go a distance of at least 30cm
+* Use at least one motor
+* Use NO wheels for locomotion
+
+![LECG Mindstorms brick with parts](/static/lessons/make-it-move/locomotion-no-wheels.jpg)
+
+
+## Construct @unplugged
+
+Build a Walker Bot!
+
+The Walker Bot is one example of many possible solutions for making a robot move without wheels.
+
+The Walker Bot combines an EV3 Frame and two legs that are mirror-images to create left and right legs.
+
+The legs in the Walker Bot are designed to show how to change the rotary motion of a motor to reciprocating motion.
+
+Start by reading [these](https://le-www-live-s.legocdn.com/sc/media/lessons/mindstorms-ev3/ev3-dep/building%20instructions/walker-bot-bi-180fc24f9298e1dd6201099627d43903.pdf) instructions first.
+ 
+![LEGO Mindstorms Walker Bot](/static/lessons/make-it-move/walker-bot.jpg)
+
+ 
+## Program 1 @fullscreen
+
+In nature, creatures use many methods to get around. None of them, however, use wheels to move. Can we copy the method of animal locomotion with our robot? Using motors and legs, make the robot move without using any wheels.
+
+Place a ``||motors:tank large B+C||`` block from ``||motors:Motors||`` under ``||loops:on start||``.
+
+Change the speed to `-60%` (for motor B) and `+60%` (for motor C).
+Change the rotations to `9`.
+
+The ``||motors:tank large B+C||`` block will run for `9` rotations when the **center** button is pressed on the EV3 brick. The motors are set for the reverse direction because they are mounted upside down in this model.
+
+```blocks
+motors.largeBC.tank(-60, 60, 9, MoveUnit.Rotations)
+```
+
+## Program 2 @fullscreen
+
+Place a ``||motors:stop all motors||`` block under ``||motors:tank large B+C||``.
+
+The ``||motors:tank large B+C||`` block will run for `9` rotations when the **center** button is pressed on the EV3 brick then stop.
+
+```blocks
+motors.largeBC.tank(-60, 60, 9, MoveUnit.Rotations)
+motors.stopAllMotors()
+```
+
+## Program 3 @fullscreen
+
+Place a ``||brick:show string||`` block under ``||motors:stop all motors||``.
+Change the `"Hello World"` text to `"30 cm"`.
+
+The ``||motors:tank large B+C||`` will run for `9` rotations when the **center** button is pressed on the EV3 brick then stop and display "30 cm" on the EV3 Brick’s screen.
+
+```blocks
+motors.largeBC.tank(-60, 60, 9, MoveUnit.Rotations)
+motors.stopAllMotors()
+brick.showString("30 cm", 1)
+```
+
+## Download @fullscreen
+
+Click `|Download|` and follow the instructions to get your code onto your EV3 Brick. Press the **center** button on the EV3 Brick to run the program.

docs/lessons/make-it-move.md

@@ -0,0 +1,73 @@
+# Make It Move Without Wheels 
+
+## Objective
+
+Design, build and program a robot that can move itself:
+
+Your robot will:
+
+* Go a distance of at least 30cm
+* Use at least one motor
+* Use NO wheels for locomotion
+
+![LECG Mindstorms brick with parts](/static/lessons/make-it-move/locomotion-no-wheels.jpg)
+
+## Construct
+
+Build a Walker Bot!
+
+The Walker Bot is one example of many possible solutions for making a robot move without wheels.
+
+The Walker Bot combines an EV3 Frame and two legs that are mirror-images to create left and right legs.
+
+The legs in the Walker Bot are designed to show how to change the rotary motion of a motor to reciprocating motion.
+
+Start by reading [these](https://le-www-live-s.legocdn.com/sc/media/lessons/mindstorms-ev3/ev3-dep/building%20instructions/walker-bot-bi-180fc24f9298e1dd6201099627d43903.pdf) instructions first.
+ 
+![LEGO Mindstorms Walker Bot](/static/lessons/make-it-move/walker-bot.jpg)
+
+ 
+## Program
+
+In nature, creatures use many methods to get around. None of them, however, use wheels to move. Can we copy the method of animal locomotion with our robot? Using motors and legs, make the robot move without using any wheels.
+
+### Step 1
+
+Place a ``||motors:tank large B+C||`` block from ``||motors:Motors||`` under ``||loops:on start||``.
+
+Change the speed to `-60%` (for motor B) and `+60%` (for motor C).
+Change the rotations to `9`.
+
+The ``||motors:tank large B+C||`` block will run for `9` rotations when the **center** button is pressed on the EV3 brick. The motors are set for the reverse direction because they are mounted upside down in this model.
+
+```blocks
+motors.largeBC.tank(-60, 60, 9, MoveUnit.Rotations)
+```
+
+### Step 2
+
+Place a ``||motors:stop all motors||`` block under ``||motors:tank large B+C||``.
+
+The ``||motors:tank large B+C||`` block will run for `9` rotations when the **center** button is pressed on the EV3 brick then stop.
+
+```blocks
+motors.largeBC.tank(-60, 60, 9, MoveUnit.Rotations)
+motors.largeBC.stop()
+```
+
+### Step 3
+
+Place a ``||brick:show string||`` block under ``||motors:stop all motors||``.
+Change the `"Hello World"` text to `"30 cm"`.
+
+The ``||motors:tank large B+C||`` will run for `9` rotations when the **center** button is pressed on the EV3 brick then stop and display "30 cm" on the EV3 Brick’s screen.
+
+```blocks
+motors.largeBC.tank(-60, 60, 9, MoveUnit.Rotations)
+motors.largeBC.stop()
+brick.showString("30 cm", 1)
+```
+
+### Step 4
+
+Click `|Download|` and follow the instructions to get your code onto your EV3 Brick. Press the **center** button on the EV3 Brick to run the program.

docs/maker/intruder-detector.md

@@ -2,10 +2,8 @@
 
 This program will activate an alarm when an object moves in front of the Ultrasonic Sensor.
 
-TODO support for event when value changes
-
 ```blocks
-input.ultrasonic4.onObjectNear(function () {
+sensors.ultrasonic4.onEvent(UltrasonicSensorEvent.ObjectNear, function () {
-    music.playSoundUntilDone(music.sounds(Sounds.PowerUp))
+    music.playSoundEffectUntilDone(sounds.informationActivate)
 })
 ```

docs/maker/puppet.md

@@ -4,14 +4,12 @@ Use this program with the Programmable Brick and Large Motor.
 
 ```blocks
 loops.forever(function () {
-    output.largeMotorA.setPower(30)
+    motors.largeA.setSpeed(30)
-    output.largeMotorA.on(true)
     loops.pause(100)
-    output.largeMotorA.on(false)
+    motors.largeA.stop()
-    music.playSoundUntilDone(music.sounds(Sounds.PowerUp))
+    music.playSoundEffectUntilDone(sounds.animalsCatPurr)
-    output.largeMotorA.setPower(-30)
+    motors.largeA.setSpeed(-30)
-    output.largeMotorA.on(true)
     loops.pause(100)
-    output.largeMotorA.on(false)
+    motors.largeA.stop()
 })
 ```

docs/maker/security-gadget.md

@@ -3,7 +3,7 @@
 This program will activate an alarm when an object is lifted from the Touch Sensor.
 
 ```blocks
-input.touchSensor1.onEvent(TouchSensorEvent.Released, function () {
+sensors.touch1.onEvent(TouchSensorEvent.Released, function () {
-    music.playSoundUntilDone(music.sounds(Sounds.PowerUp))
+    music.playSoundEffectUntilDone(sounds.informationActivate);
 })
 ```

docs/maker/sound-machine.md

@@ -4,9 +4,9 @@ This example program combined with the small model will make a beat and rhythm o
 
 ```blocks
 loops.forever(function () {
-    output.motorA.on(50)
+    motors.largeA.setSpeed(50)
     loops.pause(200)
-    output.motorA.on(100)
+    motors.largeA.setSpeed(100)
     loops.pause(200)
 })
 ``` 

docs/maker/sound-of-color.md

@@ -3,13 +3,13 @@
 This program will play different sounds when the wheel is rotated. The sound is determined by which color is placed in front of the color Sensor.
 
 ```blocks
-input.color3.onColorDetected(ColorSensorColor.Blue, function () {
+sensors.color3.onColorDetected(ColorSensorColor.Blue, function () {
     music.playTone(Note.G4, music.beat(BeatFraction.Half))
 })
-input.color3.onColorDetected(ColorSensorColor.Red, function () {
+sensors.color3.onColorDetected(ColorSensorColor.Red, function () {
     music.playTone(Note.C5, music.beat(BeatFraction.Half))
 })
-input.color3.onColorDetected(ColorSensorColor.Green, function () {
+sensors.color3.onColorDetected(ColorSensorColor.Green, function () {
     music.playTone(Note.D5, music.beat(BeatFraction.Half))
 })
 ```

docs/static/avatar.svg

@@ -0,0 +1,109 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 22.0.1, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1"
+	 id="svg2" inkscape:version="0.91 r13725" sodipodi:docname="avatar.svg" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" xmlns:svg="http://www.w3.org/2000/svg"
+	 xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 32 32"
+	 style="enable-background:new 0 0 32 32;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill:#303030;}
+</style>
+<sodipodi:namedview  bordercolor="#666666" borderopacity="1" gridtolerance="10" guidetolerance="10" id="namedview15" inkscape:current-layer="svg2" inkscape:cx="16" inkscape:cy="16" inkscape:pageopacity="0" inkscape:pageshadow="2" inkscape:window-height="661" inkscape:window-maximized="0" inkscape:window-width="997" inkscape:window-x="0" inkscape:window-y="0" inkscape:zoom="5.2149125" objecttolerance="10" pagecolor="#ffffff" showgrid="false">
+	</sodipodi:namedview>
+<g id="avatar_mf" transform="translate(-5304.979 8145.745)">
+	<path id="Path_180" class="st0" d="M5317.1-8125.6c0.2,0,0.3-0.1,0.5-0.1l2.9-0.6c1.3-0.3,2.5-0.5,3.8-0.8c0.5-0.1,1-0.2,1.5-0.3
+		c0.1,0,0.1,0,0.1-0.1c0-0.5,0-1-0.1-1.5c-0.1-0.6-0.2-1.1-0.3-1.7c-0.1-0.4-0.1-0.8-0.2-1.2c-0.1-0.7-0.2-1.4-0.3-2
+		c-0.1-0.6-0.2-1.1-0.3-1.7c0-0.2-0.2-0.4-0.4-0.4c0,0,0,0-0.1,0c-0.2,0-0.5,0.1-0.7,0.1c-0.5,0.1-1,0.1-1.5,0.2
+		c-0.5,0.1-1,0.1-1.6,0.2c-0.5,0.1-1,0.1-1.4,0.2c-0.2,0-0.3,0-0.5,0.1c-0.2,0-0.4,0.2-0.5,0.4c0,0.2-0.1,0.4-0.1,0.5
+		c0,0.4-0.1,0.8-0.1,1.2c-0.1,0.5-0.1,1-0.2,1.5c0,0.4-0.1,0.9-0.1,1.3l-0.1,1.3l-0.1,1.3c-0.1,0.5-0.1,1-0.2,1.5
+		C5317.1-8126,5317.1-8125.8,5317.1-8125.6z"/>
+	<path id="Path_181" class="st0" d="M5316.1-8140c0,0.6,0.1,1.2,0.1,1.8c0,0.4,0.2,0.8,0.6,1c0.3,0.2,0.7,0.3,1.1,0.3
+		c0.7,0.1,1.4,0.1,2.1,0c0.6,0,1.2-0.1,1.8-0.2c0.4,0,0.9-0.2,1.2-0.5c0.3-0.3,0.5-0.7,0.5-1.1c0-1.2,0-2.3-0.1-3.5
+		c0-0.3-0.1-0.6-0.3-0.8c-0.3-0.4-0.8-0.6-1.4-0.6c0,0,0,0-0.1,0c-0.2,0.1-0.4,0.1-0.6,0.1c-0.9,0-1.8,0.1-2.7,0.1
+		c-0.1,0-0.3,0-0.4,0c-0.4-0.1-0.8,0-1.2,0.2c-0.4,0.2-0.6,0.6-0.7,1c0,0.1,0,0.2,0,0.3C5316-8141.2,5316.1-8140.6,5316.1-8140
+		L5316.1-8140z"/>
+	<path id="Path_182" class="st0" d="M5312-8129.2c0,0.6,0,1.2,0,1.8c0,0.1,0,0.1,0.1,0.1c0.3,0,0.6,0.1,0.9,0.1c0.3,0,0.7,0,1,0
+		c0.1,0,0.2,0,0.3,0c0.1,0,0.1,0,0.1-0.1c0.1-0.4,0.2-0.8,0.2-1.2c0.1-0.5,0.2-1,0.3-1.4c0-0.1,0.1-0.1,0.1-0.1
+		c0.4-0.2,0.8-0.5,1.2-0.8c0.4-0.4,0.7-0.9,0.8-1.5c0.1-0.6,0-1.2-0.4-1.7c-0.2-0.3-0.6-0.4-0.9-0.3c-0.3,0.1-0.6,0.3-0.9,0.5
+		c-0.7,0.6-1.5,1.2-2.2,1.8c-0.3,0.2-0.5,0.5-0.6,0.8c0,0.2-0.1,0.4-0.1,0.6C5311.9-8130.2,5311.9-8129.7,5312-8129.2
+		C5311.9-8129.2,5312-8129.2,5312-8129.2z"/>
+	<path id="Path_183" class="st0" d="M5315.5-8124.7c0,0.2-0.1,0.5-0.1,0.7c-0.1,0.5-0.4,0.9-0.8,1.1c0,0,0,0,0,0
+		c-0.1,0-0.2,0.2-0.2,0.3c-0.4,1.4-0.9,2.7-1.3,4.1c0,0,0,0.1,0,0.1c0.8,1.1,1.6,2.2,2.4,3.3c0,0,0,0,0.1,0.1
+		c0.1-0.2,0.1-0.3,0.2-0.5c0.1-0.3,0.2-0.5,0.3-0.8c0,0,0-0.1,0-0.1c-0.2-0.3-0.5-0.7-0.7-1c0,0,0-0.1,0-0.2
+		c0.3-0.9,0.6-1.7,0.9-2.6c0,0,0-0.1,0.1-0.1c0.5-0.2,0.9-0.6,1.1-1.1c0.1-0.3,0.1-0.7,0.1-1.1c0-0.4-0.1-0.8-0.3-1.2
+		c-0.2-0.4-0.5-0.8-1-1C5315.9-8124.7,5315.7-8124.7,5315.5-8124.7z"/>
+	<path id="Path_184" class="st0" d="M5314.7-8134.2c0.1-0.1,0.2-0.1,0.3-0.2c0.3-0.2,0.7-0.3,1-0.3c0.4,0,0.7,0.2,0.8,0.6
+		c0.6,1.1,0.5,2.4-0.4,3.3c-0.4,0.4-0.8,0.7-1.3,1c0,0-0.1,0.1-0.1,0.1c-0.2,0.8-0.3,1.6-0.5,2.5c0,0,0,0.1,0,0.1
+		c0,0.2,0,0.2-0.2,0.2c-0.1,0-0.1,0-0.2,0c0,0.1,0,0.2,0,0.3c0,0,0,0,0.1,0.1l1.9,0.7c0.2,0.1,0.4,0.2,0.7,0.2c0-0.1,0-0.2,0-0.2
+		c0-0.3,0-0.6,0-0.8l0.2-1.5l0.2-1.5c0.1-0.5,0.1-1,0.2-1.5c0.1-0.5,0.1-1.1,0.2-1.6c0.1-0.5,0.1-1,0.2-1.5c0-0.2,0-0.4,0-0.6
+		c0-0.2-0.1-0.4-0.3-0.4c0,0,0,0,0,0c-0.1,0-0.1,0-0.2,0c-0.6-0.1-1.2-0.2-1.9-0.3c-0.1,0-0.2,0-0.3,0c-0.1,0-0.2,0.1-0.3,0.3
+		C5314.8-8135,5314.7-8134.6,5314.7-8134.2z"/>
+	<path id="Path_185" class="st0" d="M5324.5-8117.2c-0.2-0.7-0.5-1.3-0.7-2l-0.7,0.3c0,0-0.1,0-0.1,0c-0.1,0.1-0.2,0-0.2-0.1
+		c-0.1-0.3-0.2-0.5-0.3-0.8c-0.2-0.7-0.5-1.4-0.7-2.1c0,0,0-0.1,0-0.1c0,0,0,0.1-0.1,0.1c-0.1,0.2-0.3,0.3-0.5,0.5c0,0-0.1,0-0.1,0
+		c-0.3,0.1-0.6,0.1-0.8,0.2c0,0-0.1,0-0.1,0c0,0.2-0.1,0.3-0.1,0.5c0.6,1.5,1.1,3.1,1.7,4.6c0,0,0,0,0,0.1
+		C5322.7-8116.3,5323.6-8116.7,5324.5-8117.2z"/>
+	<path id="Path_186" class="st0" d="M5325.4-8123.1c-0.7,0.2-1.3,0.3-2,0.5c-0.5,0.1-0.9,0.2-1.4,0.3c-0.1,0-0.2,0.1-0.1,0.2
+		c0,0,0,0,0,0.1c0.2,0.5,0.3,0.9,0.5,1.4c0.2,0.5,0.4,1.1,0.6,1.6c0,0,0,0,0,0c0.1-0.1,0.2-0.1,0.3-0.2c0.2-0.1,0.3-0.2,0.5-0.2
+		c0.2-0.1,0.4-0.1,0.6-0.2c0.7-0.2,1.5-0.4,2.2-0.6c0,0,0,0,0.1,0C5326.3-8121.1,5325.9-8122.1,5325.4-8123.1z"/>
+	<path id="Path_187" class="st0" d="M5320.7-8124.4c-0.4,0.1-0.8,0.2-1.2,0.3c-0.6,0.1-1.3,0.3-1.9,0.4c0,0-0.1,0-0.1,0
+		c-0.1,0-0.2-0.1-0.3-0.1c0,0,0,0.1,0,0.1c0.3,0.7,0.4,1.5,0.3,2.2c-0.1,0.4-0.3,0.8-0.5,1.1c0,0,0,0-0.1,0.1
+		c0.2-0.1,0.4-0.1,0.6-0.1l2.5-0.6c0.5-0.1,0.9-0.6,1-1.1c0.1-0.5,0-1-0.1-1.5C5320.8-8124,5320.8-8124.2,5320.7-8124.4z"/>
+	<path id="Path_188" class="st0" d="M5325.5-8127c-2.7,0.5-5.3,1.1-7.9,1.6c0,0.5,0,0.9,0.1,1.4c0.1,0,0.2,0,0.3-0.1
+		c1.2-0.3,2.3-0.5,3.5-0.8c1.2-0.3,2.4-0.5,3.6-0.8c0.1,0,0.3-0.1,0.4-0.1c0,0,0.1,0,0.1-0.1
+		C5325.6-8126.2,5325.5-8126.6,5325.5-8127z"/>
+	<path id="Path_189" class="st0" d="M5328.6-8118.4c-0.2-0.4-0.3-0.7-0.5-1.1c-0.1-0.2-0.2-0.5-0.3-0.7c0-0.1,0-0.1-0.1,0
+		c-1.2,0.3-2.4,0.6-3.6,1c0,0,0,0-0.1,0c0.2,0.7,0.5,1.3,0.7,2C5326-8117.6,5327.3-8118,5328.6-8118.4z"/>
+	<path id="Path_190" class="st0" d="M5319.9-8120.9l-0.6,0.1c-1,0.2-2,0.5-3,0.7c-0.1,0-0.1,0.1-0.1,0.1c-0.3,0.7-0.5,1.5-0.8,2.2
+		c0,0,0,0,0,0.1c0.2,0,0.4-0.1,0.5-0.1c1-0.3,2-0.5,3.1-0.8c0.1,0,0.2-0.1,0.3-0.2C5319.5-8119.5,5319.7-8120.2,5319.9-8120.9z"/>
+	<path id="Path_191" class="st0" d="M5325.1-8125.4c-1.1,0.2-2.2,0.5-3.3,0.7c0.3,0.7,0.4,1.4,0.3,2.2c0.2,0,0.4-0.1,0.5-0.1
+		c0.9-0.2,1.8-0.4,2.7-0.6c0.1,0,0.1,0,0.1-0.1c0.1-0.4,0-0.9-0.1-1.3C5325.3-8124.9,5325.2-8125.1,5325.1-8125.4
+		C5325.1-8125.3,5325.1-8125.4,5325.1-8125.4z"/>
+	<path id="Path_192" class="st0" d="M5325.6-8132c0.2,0,0.4,0,0.5,0c0.2,0,0.4,0,0.6,0c0.3,0,0.6-0.2,0.8-0.4c0.3-0.4,0.7-0.8,1-1.2
+		c-0.1-0.1-0.1-0.1-0.1-0.2c0,0,0,0-0.1,0c-0.7-0.1-1.3-0.5-1.4-1.2c-0.1-0.2-0.1-0.4-0.1-0.6c-0.2,0.1-0.3,0.3-0.5,0.4
+		c-0.1,0.1-0.2,0.1-0.3,0.2c0,0-0.1,0.1-0.2,0c-0.2,0-0.5-0.1-0.7-0.1c0,0,0,0-0.1,0C5325.3-8134.1,5325.4-8133.1,5325.6-8132z"/>
+	<path id="Path_193" class="st0" d="M5328.4-8134.2c0.2-0.3,0.5-0.5,0.8-0.7c0.4-0.4,0.6-0.8,0.7-1.4c0-0.1,0-0.2-0.1-0.3
+		c-0.3-0.5-0.7-1.1-1-1.6c0-0.1-0.1-0.1-0.1,0c-0.4,0.2-0.8,0.5-1.1,0.8c-0.2,0.2-0.4,0.4-0.6,0.6c-0.1,0.1-0.1,0.3,0,0.4
+		c0.5,0.7,1,1.5,1.4,2.2C5328.4-8134.2,5328.4-8134.2,5328.4-8134.2z"/>
+	<path id="Path_194" class="st0" d="M5314.3-8126.1c-0.1-0.1-0.1-0.1-0.2-0.2c-0.1,0-0.1-0.1-0.1-0.2c0-0.1,0-0.3,0-0.4h-0.1
+		c-0.6,0-1.2-0.1-1.7-0.2c0,0-0.1,0-0.1,0c-0.4,0.2-0.7,0.4-1,0.8c-0.4,0.6-0.4,1.4,0.1,1.9c0.2,0.2,0.4,0.4,0.6,0.6
+		c0.1,0.1,0.2,0.2,0.3,0.2c-0.2-0.6,0-1.3,0.5-1.8C5313-8125.9,5313.6-8126.2,5314.3-8126.1z"/>
+	<path id="Path_195" class="st0" d="M5315.7-8114.9c0.5-0.1,0.9-0.3,1.4-0.4c0.8-0.2,1.6-0.4,2.4-0.7c0.1,0,0.1,0,0.1-0.1
+		c0.1-0.4,0.2-0.7,0.4-1.1c0,0,0,0,0-0.1c-0.1,0-0.2,0-0.3,0.1c-1.2,0.3-2.3,0.6-3.5,1c-0.1,0-0.1,0.1-0.1,0.1
+		c-0.1,0.4-0.3,0.7-0.4,1.1C5315.7-8115,5315.7-8115,5315.7-8114.9z"/>
+	<path id="Path_196" class="st0" d="M5315.4-8117.4c0.2,0.3,0.4,0.6,0.6,0.9c0,0,0.1,0,0.1,0c1-0.3,1.9-0.5,2.9-0.8
+		c0.3-0.1,0.6-0.2,0.9-0.2c-0.1-0.1-0.1-0.2-0.2-0.2c-0.2-0.2-0.3-0.4-0.5-0.6c0,0-0.1-0.1-0.1,0c-0.9,0.3-1.9,0.5-2.8,0.8
+		C5316-8117.5,5315.7-8117.5,5315.4-8117.4z"/>
+	<path id="Path_197" class="st0" d="M5321.3-8143.6c0-0.3,0-0.7,0-1c0,0-0.1,0-0.1,0c-0.7,0-1.5,0-2.2,0.1c-0.4,0-0.7,0-1.1,0.1
+		c-0.1,0-0.1,0-0.1,0.1c0,0.3,0,0.6,0,0.8c0,0,0,0.1,0.1,0.1c0.4,0,0.8,0,1.1,0c0.5,0,1.1,0,1.6-0.1
+		C5320.9-8143.5,5321.1-8143.6,5321.3-8143.6z"/>
+	<path id="Path_198" class="st0" d="M5329.2-8134.3c0.1,0,0.2,0,0.2-0.1c0.4-0.2,0.8-0.4,1.1-0.7c0.3-0.2,0.4-0.5,0.6-0.8
+		c0.1-0.3,0.1-0.6-0.1-0.9c-0.4-0.5-0.7-1-1.1-1.6c0,0,0,0-0.1-0.1c-0.2,0.2-0.4,0.4-0.6,0.6c0,0,0,0,0,0c0,0,0,0.1,0,0.1
+		c0.2,0.4,0.5,0.7,0.7,1c0.1,0.2,0.2,0.4,0.1,0.6c0,0.5-0.1,0.9-0.4,1.3c-0.1,0.1-0.2,0.2-0.3,0.3
+		C5329.4-8134.5,5329.3-8134.4,5329.2-8134.3C5329.2-8134.3,5329.2-8134.3,5329.2-8134.3z"/>
+	<path id="Path_199" class="st0" d="M5317.5-8136.7c0,0.2,0,0.3,0,0.5c0,0,0,0.1,0.1,0.1c0.2,0,0.3,0.1,0.5,0.1c0.7,0.1,1.4,0.1,2,0
+		c0.4,0,0.8-0.1,1.2-0.1c0.2,0,0.5-0.1,0.7-0.1c0.1,0,0.1,0,0.1-0.1c0-0.2,0-0.3,0-0.5C5320.5-8136.6,5319-8136.5,5317.5-8136.7z"/>
+	<path id="Path_200" class="st0" d="M5312.5-8123.2c0.1-0.4,0.1-0.8,0.2-1.2c0.1-0.6,0.6-1,1.2-1c0.3,0,0.5,0.1,0.7,0.3
+		c0.2,0.2,0.2,0.4,0.2,0.7c-0.1,0.3-0.2,0.6-0.2,0.9c0,0.1-0.1,0.2-0.1,0.4c0,0,0,0,0,0c0.1-0.1,0.2-0.2,0.3-0.3
+		c0.3-0.4,0.4-0.9,0.4-1.4c0-0.6-0.4-1-0.9-1.1c-0.1,0-0.1,0-0.2,0c-0.5,0-1,0.3-1.4,0.7c-0.3,0.3-0.4,0.6-0.5,1
+		c-0.1,0.3,0,0.7,0.2,1C5312.5-8123.2,5312.5-8123.2,5312.5-8123.2z"/>
+	<path id="Path_201" class="st0" d="M5314.3-8123.2c0.1-0.5,0.3-0.9,0.4-1.4c0.1-0.2,0-0.4-0.2-0.5c-0.4-0.2-0.9-0.1-1.2,0.2
+		c0,0,0,0,0,0.1c0,0.2,0,0.4,0.1,0.6c0,0.1,0.1,0.2,0.2,0.3C5313.7-8123.6,5314-8123.4,5314.3-8123.2
+		C5314.2-8123.2,5314.3-8123.2,5314.3-8123.2z"/>
+	<path id="Path_202" class="st0" d="M5317.4-8124.1c0-0.4,0-0.9-0.1-1.3c-0.1,0-0.1,0-0.2,0c-0.1,0-0.2,0-0.3,0
+		c-0.7-0.3-1.4-0.5-2.1-0.8c0,0,0,0,0,0c0.1,0.1,0.1,0.1,0.2,0.2c0.3,0.2,0.5,0.6,0.6,0.9c0,0,0,0,0,0c0.1,0,0.3,0,0.4,0.1
+		c0.3,0.1,0.6,0.3,0.9,0.5c0,0,0.1,0.1,0.1,0.1C5317.1-8124.2,5317.2-8124.1,5317.4-8124.1z"/>
+	<path id="Path_203" class="st0" d="M5321.6-8124.6c-0.2,0-0.4,0.1-0.6,0.1c0.1,0.2,0.1,0.4,0.2,0.6c0.1,0.4,0.2,0.8,0.1,1.2
+		c0,0.5-0.1,0.9-0.4,1.3c0,0,0,0,0,0c0.3,0,0.6-0.2,0.7-0.5c0.2-0.3,0.3-0.6,0.3-0.9C5321.9-8123.4,5321.8-8124,5321.6-8124.6z"/>
+	<path id="Path_204" class="st0" d="M5315.7-8135.8c0.2,0,0.3,0.1,0.5,0.1c0.5,0.1,1,0.2,1.5,0.2c0.2,0,0.5,0,0.7,0
+		c0.7-0.1,1.4-0.2,2.1-0.2c0.6-0.1,1.2-0.2,1.8-0.2c0.5-0.1,1.1-0.1,1.6-0.2l-1.5-0.2c0,0,0,0,0,0c0,0.2-0.1,0.3-0.2,0.3
+		c0,0,0,0,0,0c-0.3,0.1-0.5,0.1-0.8,0.2c-0.8,0.1-1.6,0.1-2.3,0.1c-0.4,0-0.9,0-1.3-0.1c-0.1,0-0.2-0.1-0.3-0.2c0,0-0.1,0-0.1,0
+		c-0.3,0-0.6,0.1-0.9,0.1L5315.7-8135.8L5315.7-8135.8z"/>
+	<path id="Path_205" class="st0" d="M5327.3-8117.7c-0.3,0.1-0.5,0.2-0.8,0.2c-0.6,0.2-1.1,0.3-1.7,0.5c0,0-0.1,0-0.1,0.1
+		c-0.5,0.2-1,0.5-1.5,0.7c0,0,0,0,0,0c0.3-0.1,0.5-0.1,0.8-0.2c0.5-0.2,1.1-0.3,1.6-0.5c0.1,0,0.2-0.1,0.2-0.1
+		C5326.2-8117.2,5326.8-8117.5,5327.3-8117.7C5327.3-8117.7,5327.3-8117.7,5327.3-8117.7C5327.3-8117.7,5327.3-8117.7,5327.3-8117.7
+		z"/>
+	<path id="Path_206" class="st0" d="M5327-8135.8c0,0.1,0,0.2,0,0.4c0.1,0.5,0.3,0.9,0.7,1.1c0.1,0.1,0.3,0.1,0.4,0.2l0,0
+		C5327.8-8134.7,5327.4-8135.2,5327-8135.8L5327-8135.8z"/>
+	<path id="Path_207" class="st0" d="M5329-8134.4c-0.1,0.1-0.2,0.2-0.3,0.4c0,0,0,0,0,0.1c0,0.1,0,0.1,0.1,0.1c0.1,0,0.2,0,0.3-0.1
+		c0.1,0,0.2-0.1,0.3-0.1c-0.1,0-0.1-0.1-0.2-0.1C5329-8134.2,5329-8134.3,5329-8134.4z"/>
+</g>
+</svg>

docs/static/download/connect.svg

@@ -0,0 +1,331 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="261.3" height="109.3" viewBox="0 0 69.1 28.9" id="svg9461">
+  <defs id="defs9455">
+    <clipPath id="clipPath8689">
+      <path d="M0 1145.9h1366V0H0z" id="path8687"/>
+    </clipPath>
+    <clipPath id="clipPath8663">
+      <path d="M309.8 89.4h3.7v3.7h-3.7z" id="path8661"/>
+    </clipPath>
+    <clipPath id="clipPath8647">
+      <path d="M0 1145.9h1366V0H0z" id="path8645"/>
+    </clipPath>
+    <linearGradient x2="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(0 .6661 -.32488 0 300.7 115)" id="linearGradient8637">
+      <stop offset="0" id="stop8633" stop-color="#757575"/>
+      <stop offset="1" id="stop8635" stop-color="#393939"/>
+    </linearGradient>
+    <clipPath id="clipPath8595">
+      <path d="M0 1145.9h1366V0H0z" id="path8593"/>
+    </clipPath>
+    <linearGradient x2="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(0 12.8096 -17.18704 0 300.7 98.4)" id="linearGradient8585">
+      <stop offset="0" id="stop8579" stop-color="#6a6a6a"/>
+      <stop offset=".5" id="stop8581" stop-color="#48e400"/>
+      <stop offset="1" id="stop8583" stop-color="#6a6a6a"/>
+    </linearGradient>
+    <clipPath id="clipPath8561">
+      <path d="M0 1145.9h1366V0H0z" id="path8559"/>
+    </clipPath>
+    <linearGradient x2="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(0 -1.33016 5.597 0 300.7 88.4)" id="linearGradient8551">
+      <stop offset="0" id="stop8547" stop-color="#a9aba9"/>
+      <stop offset="1" id="stop8549" stop-color="#535453"/>
+    </linearGradient>
+    <clipPath id="clipPath8525">
+      <path d="M0 1145.9h1366V0H0z" id="path8523"/>
+    </clipPath>
+    <linearGradient x2="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(0 -.56074 .70884 0 300.7 115.6)" id="linearGradient8515">
+      <stop offset="0" id="stop8511" stop-color="#a9aba9"/>
+      <stop offset="1" id="stop8513" stop-color="#818181"/>
+    </linearGradient>
+    <clipPath id="clipPath8493">
+      <path d="M0 1145.9h1366V0H0z" id="path8491"/>
+    </clipPath>
+    <linearGradient x2="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(0 -2.39765 2.48247 0 300.7 98.1)" id="linearGradient8483">
+      <stop offset="0" id="stop8479" stop-color="#f2f2f2"/>
+      <stop offset="1" id="stop8481" stop-color="#7a7a7a"/>
+    </linearGradient>
+    <clipPath id="clipPath8449">
+      <path d="M0 1145.9h1366V0H0z" id="path8447"/>
+    </clipPath>
+    <clipPath id="clipPath8977">
+      <path d="M0 1145.9h1366V0H0z" id="path8975"/>
+    </clipPath>
+    <clipPath id="clipPath8951">
+      <path d="M593 101h3.6v3.7H593z" id="path8949"/>
+    </clipPath>
+    <clipPath id="clipPath8935">
+      <path d="M0 1145.9h1366V0H0z" id="path8933"/>
+    </clipPath>
+    <linearGradient x2="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(0 .67046 -.32706 0 583.8 126.8)" id="linearGradient8925">
+      <stop offset="0" id="stop8921" stop-color="#757575"/>
+      <stop offset="1" id="stop8923" stop-color="#393939"/>
+    </linearGradient>
+    <clipPath id="clipPath8883">
+      <path d="M0 1145.9h1366V0H0z" id="path8881"/>
+    </clipPath>
+    <linearGradient x2="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(0 12.89405 -17.29507 0 583.7 110)" id="linearGradient8873">
+      <stop offset="0" id="stop8867" stop-color="#6a6a6a"/>
+      <stop offset=".5" id="stop8869" stop-color="#48e400"/>
+      <stop offset="1" id="stop8871" stop-color="#6a6a6a"/>
+    </linearGradient>
+    <clipPath id="clipPath8849">
+      <path d="M0 1145.9h1366V0H0z" id="path8847"/>
+    </clipPath>
+    <linearGradient x2="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(0 -1.33884 5.6329 0 583.7 100)" id="linearGradient8839">
+      <stop offset="0" id="stop8835" stop-color="#a9aba9"/>
+      <stop offset="1" id="stop8837" stop-color="#535453"/>
+    </linearGradient>
+    <clipPath id="clipPath8813">
+      <path d="M0 1145.9h1366V0H0z" id="path8811"/>
+    </clipPath>
+    <linearGradient x2="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(0 -.56429 .71345 0 583.7 127.4)" id="linearGradient8803">
+      <stop offset="0" id="stop8799" stop-color="#a9aba9"/>
+      <stop offset="1" id="stop8801" stop-color="#818181"/>
+    </linearGradient>
+    <clipPath id="clipPath8781">
+      <path d="M0 1145.9h1366V0H0z" id="path8779"/>
+    </clipPath>
+    <linearGradient x2="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(0 -2.41323 2.4988 0 583.7 109.8)" id="linearGradient8771">
+      <stop offset="0" id="stop8767" stop-color="#f2f2f2"/>
+      <stop offset="1" id="stop8769" stop-color="#7a7a7a"/>
+    </linearGradient>
+    <clipPath id="clipPath8737">
+      <path d="M0 1145.9h1366V0H0z" id="path8735"/>
+    </clipPath>
+    <clipPath id="clipPath9285">
+      <path d="M0 1145.9h1366V0H0z" id="path9283"/>
+    </clipPath>
+    <clipPath id="clipPath9259">
+      <path d="M852.5 96.3h3.3v3.3h-3.3z" id="path9257"/>
+    </clipPath>
+    <clipPath id="clipPath9243">
+      <path d="M0 1145.9h1366V0H0z" id="path9241"/>
+    </clipPath>
+    <linearGradient x2="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(0 .61565 -.3002 0 844 120)" id="linearGradient9233">
+      <stop offset="0" id="stop9229" stop-color="#757575"/>
+      <stop offset="1" id="stop9231" stop-color="#393939"/>
+    </linearGradient>
+    <clipPath id="clipPath9191">
+      <path d="M0 1145.9h1366V0H0z" id="path9189"/>
+    </clipPath>
+    <linearGradient x2="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(0 11.84237 -15.8829 0 844 104.6)" id="linearGradient9181">
+      <stop offset="0" id="stop9175" stop-color="#6a6a6a"/>
+      <stop offset=".5" id="stop9177" stop-color="#48e400"/>
+      <stop offset="1" id="stop9179" stop-color="#6a6a6a"/>
+    </linearGradient>
+    <clipPath id="clipPath9157">
+      <path d="M0 1145.9h1366V0H0z" id="path9155"/>
+    </clipPath>
+    <linearGradient x2="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(0 -1.22922 5.1724 0 844 95.3)" id="linearGradient9147">
+      <stop offset="0" id="stop9143" stop-color="#a9aba9"/>
+      <stop offset="1" id="stop9145" stop-color="#535453"/>
+    </linearGradient>
+    <clipPath id="clipPath9121">
+      <path d="M0 1145.9h1366V0H0z" id="path9119"/>
+    </clipPath>
+    <linearGradient x2="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(0 -.51809 .65506 0 844 120.5)" id="linearGradient9111">
+      <stop offset="0" id="stop9107" stop-color="#a9aba9"/>
+      <stop offset="1" id="stop9109" stop-color="#818181"/>
+    </linearGradient>
+    <clipPath id="clipPath9089">
+      <path d="M0 1145.9h1366V0H0z" id="path9087"/>
+    </clipPath>
+    <linearGradient x2="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(0 -2.21578 2.29436 0 844 104.3)" id="linearGradient9079">
+      <stop offset="0" id="stop9075" stop-color="#f2f2f2"/>
+      <stop offset="1" id="stop9077" stop-color="#7a7a7a"/>
+    </linearGradient>
+    <clipPath id="clipPath9009">
+      <path d="M0 1145.9h1366V0H0z" id="path9007"/>
+    </clipPath>
+    <clipPath id="clipPath9041">
+      <path d="M779.5 134.7h16.7v-12.6h-16.7z" id="path9039"/>
+    </clipPath>
+    <clipPath id="clipPath9045">
+      <path d="M779.5 134.7h16.7v-12.6h-16.7z" id="path9043"/>
+    </clipPath>
+    <clipPath id="clipPath8907">
+      <path d="M0 1145.9h1366V0H0z" id="path8905"/>
+    </clipPath>
+    <clipPath id="clipPath8881">
+      <path d="M309.8 89.4h3.7v3.7h-3.7z" id="path8879"/>
+    </clipPath>
+    <clipPath id="clipPath8865">
+      <path d="M0 1145.9h1366V0H0z" id="path8863"/>
+    </clipPath>
+    <clipPath id="clipPath8813-1">
+      <path d="M0 1145.9h1366V0H0z" id="path8811-4"/>
+    </clipPath>
+    <clipPath id="clipPath8779">
+      <path d="M0 1145.9h1366V0H0z" id="path8777"/>
+    </clipPath>
+    <clipPath id="clipPath8743">
+      <path d="M0 1145.9h1366V0H0z" id="path8741"/>
+    </clipPath>
+    <clipPath id="clipPath8711">
+      <path d="M0 1145.9h1366V0H0z" id="path8709"/>
+    </clipPath>
+    <clipPath id="clipPath8667">
+      <path d="M0 1145.9h1366V0H0z" id="path8665"/>
+    </clipPath>
+  </defs>
+  <g id="layer1" transform="translate(0 -268)">
+    <g id="g11329" transform="matrix(.35278 0 0 -.35278 -42.7 327.3)">
+      <g id="g8661">
+        <g clip-path="url(#clipPath8667)" id="g8663">
+          <g transform="translate(134 148)" id="g8669">
+            <path id="path8671" d="M0 0h83a4 4 0 0 0 4-4v-52.5H-4V-4a4 4 0 0 0 4 4" fill="#e6e6e6"/>
+          </g>
+          <g transform="translate(134 146.5)" id="g8673">
+            <path id="path8675" d="M0 0h83c1.3 0 2.4-1.1 2.4-2.5V-52c0-.9-.6-1.5-1.5-1.5H-1c-.8 0-1.5.6-1.5 1.5v49.5C-2.5-1.1-1.4 0 0 0z" fill="none" stroke="#282828" stroke-width="3"/>
+          </g>
+          <g transform="translate(121 91)" id="g8677">
+            <path id="path8679" d="M0 0h108.8v-1.2a3 3 0 0 0-3-3H3a3 3 0 0 0-3 3z" fill="#626262"/>
+          </g>
+          <g transform="translate(165.8 91)" id="g8681">
+            <path id="path8683" d="M0 0h19.3c0-.8-.6-1.4-1.4-1.4H1.4C.6-1.4 0-.8 0 0" fill="#818181"/>
+          </g>
+        </g>
+      </g>
+      <g id="g8685">
+        <g id="g8687">
+          <g id="g8693">
+            <g id="g8695">
+              <path id="path8703" d="M285 127.8a.6.6 0 0 1-.7-.5V96.9c0-.3.3-.6.6-.6h31.5c.3 0 .6.3.6.6v30.4c0 .3-.3.5-.6.5z" fill="url(#linearGradient8483)"/>
+            </g>
+          </g>
+        </g>
+      </g>
+      <g id="g8705">
+        <g clip-path="url(#clipPath8711)" id="g8707">
+          <g transform="translate(286.8 99.6)" id="g8713">
+            <path id="path8715" d="M0 0h27.8c.4 0 .6-.3.6-.6v-11.3c0-.4-.2-.6-.6-.6H0c-.3 0-.6.2-.6.6V-.6c0 .3.3.6.6.6" fill="#f2f2f2"/>
+          </g>
+        </g>
+      </g>
+      <g id="g8717">
+        <g id="g8719">
+          <g id="g8725">
+            <g id="g8727">
+              <path id="path8735-5" d="M286.5 137.2a.6.6 0 0 1-.6-.6v-22.2c0-.3.3-.6.6-.6h28.4c.3 0 .5.3.5.6v22.2c0 .3-.2.6-.5.6z" fill="url(#linearGradient8515)"/>
+            </g>
+          </g>
+        </g>
+      </g>
+      <g id="g8737">
+        <g clip-path="url(#clipPath8743)" id="g8739">
+          <g transform="translate(289.7 134.1)" id="g8745">
+            <path id="path8747" d="M0 0h22c.6 0 1-.5 1-1.1v-12.4c0-.6-.4-1-1-1H0c-.6 0-1.1.4-1.1 1V-1c0 .5.5 1 1.1 1" fill="#393939"/>
+          </g>
+          <g transform="translate(291.4 133.5)" id="g8749">
+            <path id="path8751" d="M0 0h18.7c.4 0 .8-.4.8-.8v-11.9c0-.4-.4-.8-.8-.8H0c-.4 0-.8.3-.8.8V-.8c0 .4.4.8.8.8" fill="#98b6a7"/>
+          </g>
+        </g>
+      </g>
+      <g id="g8753">
+        <g id="g8755">
+          <g id="g8761">
+            <g id="g8763">
+              <path id="path8771" d="M286.2 94v-6.4c0-.3.2-.6.6-.6h27.8c.3 0 .6.3.6.6V94z" fill="url(#linearGradient8551)"/>
+            </g>
+          </g>
+        </g>
+      </g>
+      <g id="g8773">
+        <g clip-path="url(#clipPath8779)" id="g8775">
+          <g transform="translate(298.7 97.7)" id="g8781">
+            <path id="path8783" d="M0 0l-4.2 4.2v.5h-1a2.4 2.4 0 0 0 0 5h1v.5L0 14.4h4l4.2-4.2v-.6h1a2.4 2.4 0 1 0 0-4.9h-1v-.5L4.2 0z" fill="#6a6a6a"/>
+          </g>
+        </g>
+      </g>
+      <g id="g8785">
+        <g id="g8787">
+          <g id="g8793">
+            <g id="g8795">
+              <path id="path8805" d="M298.7 112.1l-4.2-4.3v-.5h-1c-1.4 0-2.5-1-2.5-2.4s1.1-2.5 2.5-2.5h1v-.5l4.2-4.2h4.2l4 4.2v.5h1c1.4 0 2.5 1.1 2.5 2.5 0 1.3-1.1 2.4-2.5 2.4h-1v.6l-4 4.2z" fill="url(#linearGradient8585)"/>
+            </g>
+          </g>
+        </g>
+      </g>
+      <g id="g8807">
+        <g clip-path="url(#clipPath8813-1)" id="g8809">
+          <g transform="translate(293.4 106.7)" id="g8815">
+            <path id="path8817" d="M0 0h3v-3.6H0c-1 0-1.8.8-1.8 1.8S-1 0 0 0" fill="#a9aba9"/>
+          </g>
+          <g transform="translate(308 103.1)" id="g8819">
+            <path id="path8821" d="M0 0h-3v3.6h3c1 0 1.8-.8 1.8-1.8S1 0 0 0" fill="#a9aba9"/>
+          </g>
+          <g transform="translate(299 106.7)" id="g8823">
+            <path id="path8825" d="M0 0h3.5l.2-.1v-3.4l-.2-.1H0l-.1.1V0H0" fill="#393939"/>
+          </g>
+          <g transform="translate(298.8 111.4)" id="g8827">
+            <path id="path8829" d="M0 0h3.8l2.8-2.9L5.4-4v-2.1h-1V-5c0 .5-.5.9-1 .9H.2a.7.7 0 0 1-.8-.8V-6h-1v2l-1.2 1.2z" fill="#a9aba9"/>
+          </g>
+          <g transform="translate(302.6 98.4)" id="g8831">
+            <path id="path8833" d="M0 0h-3.7l-2.9 2.9L-5.4 4v2.1h1V5c0-.5.5-.9 1-.9h3.2c.4 0 .8.4.8.8v1.3h1v-2L2.8 3z" fill="#a9aba9"/>
+          </g>
+          <path id="path8835" d="M300.3 119.6h.9v-4.1h-1z" fill="#393939"/>
+          <path id="path8837" d="M300.3 115.7h.9v-1.8h-1z" fill="#9b9b9b"/>
+        </g>
+      </g>
+      <g id="g8839">
+        <g id="g8841">
+          <g id="g8847">
+            <g id="g8849">
+              <path id="path8857" d="M300.3 113.8h.9v1.9h-1z" fill="url(#linearGradient8637)"/>
+            </g>
+          </g>
+        </g>
+      </g>
+      <g id="g8859">
+        <g clip-path="url(#clipPath8865)" id="g8861">
+          <path id="path8867" d="M300.3 113.8h.9v-1.7h-1z" fill="#818181"/>
+          <g transform="translate(288.2 113.8)" id="g8869">
+            <path id="path8871" d="M0 0h7v-1.7L5.2-3.4H.6c-.3 0-.6.2-.6.5z" fill="#a9aba9"/>
+          </g>
+          <path id="path8873" d="M309.9 93h3.6v-3.6h-3.6z" fill="#fff"/>
+        </g>
+      </g>
+      <g id="g8875">
+        <g clip-path="url(#clipPath8881)" id="g8877">
+          <g transform="translate(313.2 91.6)" id="g8883">
+            <path id="path8885" d="M0 0v-.3C-.3-.7-.4-1-.8-1l-.3.2v.1a.6.6 0 0 0-.5-.3c-.1 0-.2 0-.3.2l-.4-.1h-.6c-.2 0-.3 0-.3.2l.3 1h.4V0l.1.1.5.2.3-.1h.3c.2.1.3 0 .4 0V.1l.4.2.3-.1L0 0m-3.4-2.1H.2v3.6h-3.6z" fill="#fe0"/>
+          </g>
+          <g transform="translate(313.3 91.4)" id="g8887">
+            <path id="path8889" d="M0 0c0-.2 0-.3-.2-.5 0-.2-.3-.4-.6-.4l-.4.1a.7.7 0 0 0-.4-.1H-2a.6.6 0 0 0-.4 0H-3c-.3 0-.4.1-.4.3 0 .4.1.7.3 1 0 .2.2.2.4.2h2.1L0 .5V0m-3.5-2H.1v3.6h-3.6z" fill="#d52715"/>
+          </g>
+          <path id="path8891" d="M313.4 89.5H310V93h3.5zm-3.6 0h3.7V93h-3.7z" fill="#171714"/>
+          <g transform="translate(313.3 92)" id="g8893">
+            <path id="path8895" d="M0 0v-.2.2m0 0v-.2.1m0 0zm0 0z" fill="#171714"/>
+          </g>
+          <g transform="translate(312.9 91.6)" id="g8897">
+            <path id="path8899" d="M0 0l-.2-.5v-.1h-.1c0 .2 0 .4.2.6H0m.3-.2L0-.6C0-.8-.2-1-.3-1c-.2 0-.3 0-.3.3l.1.5c.1.2.2.4.5.4s.3-.3.3-.5M-1 .1V0l-.3-.5.1-.1.2.2c0 .2 0 .2.2.2s.2-.1.1-.2c0-.3-.2-.5-.5-.5a.3.3 0 0 0-.2.3v.5c.2.2.3.4.6.4.2 0 .3 0 .3-.2 0-.1 0-.2-.2-.2h-.1v.2m-1-.5v-.2h.3c0-.2-.2-.3-.3-.3-.2 0-.3.1-.3.2 0 .3 0 .5.2.7 0 .2.2.3.4.3l.2-.1c0-.1 0-.2-.2-.2h-.1v-.1c.1 0 .2 0 .1-.2h-.3m-.6-.3h.2c0-.2-.1-.3-.3-.3 0 0-.2 0-.2.2l.3.9s.1.1.2 0h.1c0-.3-.1-.5-.3-.8M0 .4C-.2.4-.3.4-.4.2l-.4.2-.4-.1-.3.1c-.2 0-.3 0-.4-.2v.1l-.3.1s-.2 0-.3-.2l-.3-.9c0-.2.1-.3.3-.3l.4.1h.9l.5.1.4-.2c.3 0 .5.3.6.7V0a.4.4 0 0 1-.3.4" fill="#171714"/>
+          </g>
+        </g>
+      </g>
+      <g id="g8901">
+        <g clip-path="url(#clipPath8907)" id="g8903">
+          <g transform="translate(295 91.5)" id="g8909">
+            <path id="path8911" d="M0 0v-.3h-.6l-.1-.1v-.4H0v-.4h-1l-.2.1h-.3l-.1-.1v-.5l.1-.1H.6V.5h-2.2v-.6h.5V0H0z" fill="#f2f2f2"/>
+          </g>
+          <g transform="translate(293 92)" id="g8913">
+            <path id="path8915" d="M0 0h-.5l-.1-.1-.6-1.3L-2 0h-.6v-.1l.9-2 .2-.1h.4l.1.1 1 2V0" fill="#f2f2f2"/>
+          </g>
+          <g transform="translate(290 91.1)" id="g8917">
+            <path id="path8919" d="M0 0h.1v-.4L0-.5h-1.5v-.3H0L.1-1v-.4h-2.2v2c0 .1 0 .2.1.1H.1V.4h-1.6V0z" fill="#f2f2f2"/>
+          </g>
+          <path id="path8921" d="M249 87h-13v7.9h13z" fill="#a9aba9"/>
+          <path id="path8923" d="M263.5 87h-12.9v7.9h12.9z"/>
+          <path id="path8925" d="M240.7 92.2h-1.3v1.4h1.3z"/>
+          <path id="path8927" d="M240.7 88.2h-1.3v1.4h1.3z"/>
+          <path id="path8929" d="M258.2 86h-14.5v9.9h14.5z"/>
+          <path id="path8931" d="M311.6 141h-5v9h5z" fill="#a9aba9"/>
+          <path id="path8933-4" d="M311.2 151.6h-4v9.3h4z"/>
+          <path id="path8935" d="M311.2 141.4h-.3v3h.3z"/>
+          <path id="path8937" d="M307.3 141.4h-.4v3h.4z"/>
+          <path id="path8939" d="M312.9 145h-7.3v12.2h7.3z"/>
+          <g transform="translate(309.2 158)" id="g8941">
+            <path id="path8943" d="M0 0v8.8h-36.4v-75.5h-15.1" fill="none" stroke="#000" stroke-width="2"/>
+          </g>
+        </g>
+      </g>
+    </g>
+  </g>
+</svg>

docs/static/download/firmware.svg

@@ -0,0 +1,252 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="261.3" height="109.3" viewBox="0 0 69.1 28.9" id="svg9461">
+  <defs id="defs9455">
+    <clipPath id="clipPath8689">
+      <path d="M0 1145.9h1366V0H0z" id="path8687"/>
+    </clipPath>
+    <clipPath id="clipPath8663">
+      <path d="M309.8 89.4h3.7v3.7h-3.7z" id="path8661"/>
+    </clipPath>
+    <clipPath id="clipPath8647">
+      <path d="M0 1145.9h1366V0H0z" id="path8645"/>
+    </clipPath>
+    <linearGradient x2="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(0 .6661 -.32488 0 300.7 115)" id="linearGradient8637">
+      <stop offset="0" id="stop8633" stop-color="#757575"/>
+      <stop offset="1" id="stop8635" stop-color="#393939"/>
+    </linearGradient>
+    <clipPath id="clipPath8595">
+      <path d="M0 1145.9h1366V0H0z" id="path8593"/>
+    </clipPath>
+    <linearGradient x2="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(0 12.8096 -17.18704 0 300.7 98.4)" id="linearGradient8585">
+      <stop offset="0" id="stop8579" stop-color="#6a6a6a"/>
+      <stop offset=".5" id="stop8581" stop-color="#48e400"/>
+      <stop offset="1" id="stop8583" stop-color="#6a6a6a"/>
+    </linearGradient>
+    <clipPath id="clipPath8561">
+      <path d="M0 1145.9h1366V0H0z" id="path8559"/>
+    </clipPath>
+    <linearGradient x2="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(0 -1.33016 5.597 0 300.7 88.4)" id="linearGradient8551">
+      <stop offset="0" id="stop8547" stop-color="#a9aba9"/>
+      <stop offset="1" id="stop8549" stop-color="#535453"/>
+    </linearGradient>
+    <clipPath id="clipPath8525">
+      <path d="M0 1145.9h1366V0H0z" id="path8523"/>
+    </clipPath>
+    <linearGradient x2="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(0 -.56074 .70884 0 300.7 115.6)" id="linearGradient8515">
+      <stop offset="0" id="stop8511" stop-color="#a9aba9"/>
+      <stop offset="1" id="stop8513" stop-color="#818181"/>
+    </linearGradient>
+    <clipPath id="clipPath8493">
+      <path d="M0 1145.9h1366V0H0z" id="path8491"/>
+    </clipPath>
+    <linearGradient x2="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(0 -2.39765 2.48247 0 300.7 98.1)" id="linearGradient8483">
+      <stop offset="0" id="stop8479" stop-color="#f2f2f2"/>
+      <stop offset="1" id="stop8481" stop-color="#7a7a7a"/>
+    </linearGradient>
+    <clipPath id="clipPath8449">
+      <path d="M0 1145.9h1366V0H0z" id="path8447"/>
+    </clipPath>
+    <clipPath id="clipPath8977">
+      <path d="M0 1145.9h1366V0H0z" id="path8975"/>
+    </clipPath>
+    <clipPath id="clipPath8951">
+      <path d="M593 101h3.6v3.7H593z" id="path8949"/>
+    </clipPath>
+    <clipPath id="clipPath8935">
+      <path d="M0 1145.9h1366V0H0z" id="path8933"/>
+    </clipPath>
+    <linearGradient x2="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(0 .67046 -.32706 0 583.8 126.8)" id="linearGradient8925">
+      <stop offset="0" id="stop8921" stop-color="#757575"/>
+      <stop offset="1" id="stop8923" stop-color="#393939"/>
+    </linearGradient>
+    <clipPath id="clipPath8883">
+      <path d="M0 1145.9h1366V0H0z" id="path8881"/>
+    </clipPath>
+    <linearGradient x2="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(0 12.89405 -17.29507 0 583.7 110)" id="linearGradient8873">
+      <stop offset="0" id="stop8867" stop-color="#6a6a6a"/>
+      <stop offset=".5" id="stop8869" stop-color="#48e400"/>
+      <stop offset="1" id="stop8871" stop-color="#6a6a6a"/>
+    </linearGradient>
+    <clipPath id="clipPath8849">
+      <path d="M0 1145.9h1366V0H0z" id="path8847"/>
+    </clipPath>
+    <linearGradient x2="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(0 -1.33884 5.6329 0 583.7 100)" id="linearGradient8839">
+      <stop offset="0" id="stop8835" stop-color="#a9aba9"/>
+      <stop offset="1" id="stop8837" stop-color="#535453"/>
+    </linearGradient>
+    <clipPath id="clipPath8813">
+      <path d="M0 1145.9h1366V0H0z" id="path8811"/>
+    </clipPath>
+    <linearGradient x2="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(0 -.56429 .71345 0 583.7 127.4)" id="linearGradient8803">
+      <stop offset="0" id="stop8799" stop-color="#a9aba9"/>
+      <stop offset="1" id="stop8801" stop-color="#818181"/>
+    </linearGradient>
+    <clipPath id="clipPath8781">
+      <path d="M0 1145.9h1366V0H0z" id="path8779"/>
+    </clipPath>
+    <linearGradient x2="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(0 -2.41323 2.4988 0 583.7 109.8)" id="linearGradient8771">
+      <stop offset="0" id="stop8767" stop-color="#f2f2f2"/>
+      <stop offset="1" id="stop8769" stop-color="#7a7a7a"/>
+    </linearGradient>
+    <clipPath id="clipPath8737">
+      <path d="M0 1145.9h1366V0H0z" id="path8735"/>
+    </clipPath>
+  </defs>
+  <g id="layer1" transform="translate(0 -268)">
+    <g id="g10860" transform="translate(-20.8 -2)">
+      <g transform="matrix(.35278 0 0 -.35278 62.8 291.4)" id="g8727">
+        <path id="path8729" d="M0 0h24" fill="none" stroke="#000" stroke-width="2"/>
+      </g>
+      <g id="g8731" transform="matrix(.35278 0 0 -.35278 -129 330.1)">
+        <g clip-path="url(#clipPath8737)" id="g8733">
+          <g transform="translate(458 159.9)" id="g8739">
+            <path id="path8741" d="M0 0h83a4 4 0 0 0 4-4v-52.5H-4V-4a4 4 0 0 0 4 4" fill="#e6e6e6"/>
+          </g>
+          <g transform="translate(458 158.4)" id="g8743">
+            <path id="path8745" d="M0 0h83c1.3 0 2.4-1.1 2.4-2.5V-52c0-.9-.6-1.5-1.5-1.5H-1c-.8 0-1.5.6-1.5 1.5v49.5C-2.5-1.1-1.4 0 0 0z" fill="none" stroke="#282828" stroke-width="3"/>
+          </g>
+          <g transform="translate(445 102.9)" id="g8747">
+            <path id="path8749" d="M0 0h108.8v-1.2a3 3 0 0 0-3-3H3a3 3 0 0 0-3 3z" fill="#626262"/>
+          </g>
+          <g transform="translate(489.8 102.9)" id="g8751">
+            <path id="path8753" d="M0 0h19.3c0-.8-.6-1.4-1.4-1.4H1.4C.6-1.4 0-.8 0 0" fill="#818181"/>
+          </g>
+        </g>
+      </g>
+      <g id="g8755" transform="matrix(.35278 0 0 -.35278 -129 330.1)">
+        <g id="g8757">
+          <g id="g8763">
+            <g id="g8765">
+              <path id="path8773" d="M567.9 139.7a.6.6 0 0 1-.6-.6v-30.6c0-.3.2-.6.6-.6h31.7c.3 0 .5.3.5.6v30.6c0 .3-.2.6-.5.6z" fill="url(#linearGradient8771)"/>
+            </g>
+          </g>
+        </g>
+      </g>
+      <g id="g8775" transform="matrix(.35278 0 0 -.35278 -129 330.1)">
+        <g clip-path="url(#clipPath8781)" id="g8777">
+          <g transform="translate(569.7 111.2)" id="g8783">
+            <path id="path8785" d="M0 0h28c.3 0 .6-.3.6-.6V-12c0-.4-.3-.6-.6-.6H0c-.3 0-.6.2-.6.6V-.6c0 .3.3.6.6.6" fill="#f2f2f2"/>
+          </g>
+        </g>
+      </g>
+      <g id="g8787" transform="matrix(.35278 0 0 -.35278 -129 330.1)">
+        <g id="g8789">
+          <g id="g8795">
+            <g id="g8797">
+              <path id="path8805" d="M569.4 149.1a.6.6 0 0 1-.6-.6v-22.3c0-.3.3-.6.6-.6H598c.3 0 .6.3.6.6v22.3c0 .3-.3.6-.6.6z" fill="url(#linearGradient8803)"/>
+            </g>
+          </g>
+        </g>
+      </g>
+      <g id="g8807" transform="matrix(.35278 0 0 -.35278 -129 330.1)">
+        <g clip-path="url(#clipPath8813)" id="g8809">
+          <g transform="translate(572.7 146)" id="g8815">
+            <path id="path8817" d="M0 0h22.1c.6 0 1.1-.5 1.1-1.1v-12.5c0-.6-.5-1-1-1H0c-.6 0-1.1.4-1.1 1V-1c0 .5.5 1 1.1 1" fill="#393939"/>
+          </g>
+          <g transform="translate(574.4 145.4)" id="g8819">
+            <path id="path8821" d="M0 0h18.8c.4 0 .8-.4.8-.8v-12c0-.4-.4-.8-.8-.8H0c-.4 0-.8.4-.8.8v12c0 .4.4.8.8.8" fill="#98b6a7"/>
+          </g>
+        </g>
+      </g>
+      <g id="g8823" transform="matrix(.35278 0 0 -.35278 -129 330.1)">
+        <g id="g8825">
+          <g id="g8831">
+            <g id="g8833">
+              <path id="path8841" d="M569.1 105.6v-6.4c0-.3.3-.6.6-.6h28c.3 0 .6.3.6.6v6.4z" fill="url(#linearGradient8839)"/>
+            </g>
+          </g>
+        </g>
+      </g>
+      <g id="g8843" transform="matrix(.35278 0 0 -.35278 -129 330.1)">
+        <g clip-path="url(#clipPath8849)" id="g8845">
+          <g transform="translate(581.7 109.3)" id="g8851">
+            <path id="path8853" d="M0 0l-4.2 4.2v.6h-1a2.5 2.5 0 0 0 0 4.9h1v.5L0 14.5h4l4.2-4.2v-.6h1a2.5 2.5 0 0 0 0-5h-1v-.5L4.2 0z" fill="#6a6a6a"/>
+          </g>
+        </g>
+      </g>
+      <g id="g8855" transform="matrix(.35278 0 0 -.35278 -129 330.1)">
+        <g id="g8857">
+          <g id="g8863">
+            <g id="g8865">
+              <path id="path8875" d="M581.7 123.8l-4.2-4.2v-.6h-1a2.5 2.5 0 1 1 0-5v.1h1v-.5l4.2-4.3h4.2l4.2 4.3v.5h1a2.5 2.5 0 0 1-.1 4.9h-1v.7l-4.1 4.1z" fill="url(#linearGradient8873)"/>
+            </g>
+          </g>
+        </g>
+      </g>
+      <g id="g8877" transform="matrix(.35278 0 0 -.35278 -129 330.1)">
+        <g clip-path="url(#clipPath8883)" id="g8879">
+          <g transform="translate(576.4 118.4)" id="g8885">
+            <path id="path8887" d="M0 0h3v-3.6H0A1.8 1.8 0 1 0 0 0" fill="#a9aba9"/>
+          </g>
+          <g transform="translate(591 114.8)" id="g8889">
+            <path id="path8891" d="M0 0h-3v3.6h3A1.8 1.8 0 1 0 0 0" fill="#a9aba9"/>
+          </g>
+          <g transform="translate(582 118.4)" id="g8893">
+            <path id="path8895" d="M0 0h3.6v-3.6H-.1V0H0" fill="#393939"/>
+          </g>
+          <g transform="translate(581.9 123.2)" id="g8897">
+            <path id="path8899" d="M0 0h3.8l2.8-2.9L5.5-4v-2H4.3v1c0 .5-.4 1-1 1h-3a.7.7 0 0 1-.8-.8v-1.4h-1V-4l-1.2 1.2z" fill="#a9aba9"/>
+          </g>
+          <g transform="translate(585.6 110)" id="g8901">
+            <path id="path8903" d="M0 0h-3.8l-2.8 2.9 1.2 1.2v2h1V5c0-.5.5-1 1-1h3.2c.5 0 .8.4.8.8v1.4h1.1V4l1.2-1.2z" fill="#a9aba9"/>
+          </g>
+          <path id="path8905" d="M583.3 131.4h.9v-4.1h-.9z" fill="#393939"/>
+          <path id="path8907" d="M583.3 127.4h.9v-1.8h-.9z" fill="#9b9b9b"/>
+        </g>
+      </g>
+      <g id="g8909" transform="matrix(.35278 0 0 -.35278 -129 330.1)">
+        <g id="g8911">
+          <g id="g8917">
+            <g id="g8919">
+              <path id="path8927" d="M583.3 125.6h.9v1.8h-.9z" fill="url(#linearGradient8925)"/>
+            </g>
+          </g>
+        </g>
+      </g>
+      <g id="g8929" transform="matrix(.35278 0 0 -.35278 -129 330.1)">
+        <g clip-path="url(#clipPath8935)" id="g8931">
+          <path id="path8937" d="M583.3 125.6h.9v-1.8h-.9z" fill="#818181"/>
+          <g transform="translate(571.2 125.6)" id="g8939">
+            <path id="path8941" d="M0 0h7v-1.7L5.3-3.5H.6c-.3 0-.6.3-.6.6z" fill="#a9aba9"/>
+          </g>
+          <path id="path8943" d="M593 104.7h3.6V101H593z" fill="#fff"/>
+        </g>
+      </g>
+      <g id="g8945" transform="matrix(.35278 0 0 -.35278 -129 330.1)">
+        <g clip-path="url(#clipPath8951)" id="g8947">
+          <g transform="translate(596.4 103.2)" id="g8953">
+            <path id="path8955" d="M0 0v-.3C-.3-.8-.4-1-.8-1l-.3.2a.6.6 0 0 0-.5-.2c-.1 0-.2 0-.3.2C-2-1-2.1-1-2.2-1h-.6a.3.3 0 0 0-.3.2l.3 1h.5l.5.2.2-.1h.4c.1.1.3 0 .4 0V.1l.4.2.3-.1L0 0m-3.4-2.1H.2v3.6h-3.6z" fill="#fe0"/>
+          </g>
+          <g transform="translate(596.5 103)" id="g8957">
+            <path id="path8959" d="M0 0c0-.2 0-.3-.2-.5 0-.2-.3-.4-.6-.4l-.4.1a.7.7 0 0 0-.4-.1H-2a.7.7 0 0 0-.4 0H-3c-.2 0-.3.1-.4.3 0 .4.2.7.4 1 0 .2.2.2.4.2h2.1L0 .5V0m-3.5-2H.1v3.6h-3.6z" fill="#d52715"/>
+          </g>
+          <path id="path8961" d="M596.6 101H593v3.6h3.6zm-3.7 0h3.7v3.7H593z" fill="#171714"/>
+          <g transform="translate(596.5 103.7)" id="g8963">
+            <path id="path8965" d="M0 0v-.2.2m0 0v-.2.1m0 0zm0 0z" fill="#171714"/>
+          </g>
+          <g transform="translate(596 103.2)" id="g8967">
+            <path id="path8969" d="M0 0a3 3 0 0 0-.2-.6h-.1c0 .2 0 .4.2.6H0m.3-.2L0-.6C0-.8-.2-1-.3-1c-.2 0-.3 0-.3.3l.1.4c.1.3.2.5.5.5s.3-.3.3-.5M-1 .1V0l-.3-.5.1-.1.2.2c0 .2 0 .2.2.2s.2-.1.1-.2c0-.3-.2-.5-.5-.5a.3.3 0 0 0-.3.3l.2.5c0 .2.2.4.5.4.2 0 .3 0 .3-.2 0-.1 0-.2-.2-.2h-.1v.2m-1-.5v-.2h.3c0-.2-.2-.3-.3-.3-.2 0-.3.1-.3.2 0 .3 0 .5.2.7 0 .2.2.3.4.3l.2-.1c0-.2 0-.2-.2-.2h-.1v-.1c.1 0 .2 0 .1-.2l-.3-.1m-.6-.2h.2c0-.2-.1-.3-.3-.3 0 0-.2 0-.2.2l.3.9s.1.1.2 0h.1c0-.3-.2-.5-.3-.8M0 .4C-.2.4-.3.4-.4.2l-.4.2-.4-.1-.3.1c-.2 0-.3 0-.4-.2v.1l-.3.1c-.1 0-.2 0-.3-.2-.1-.3-.3-.6-.3-1 0 0 .1-.2.3-.2l.3.1c.1 0 .2-.1.4 0h.6l.5.1.4-.2c.3 0 .5.3.6.6V0a.4.4 0 0 1-.3.4" fill="#171714"/>
+          </g>
+        </g>
+      </g>
+      <g id="g8971" transform="matrix(.35278 0 0 -.35278 -129 330.1)">
+        <g clip-path="url(#clipPath8977)" id="g8973">
+          <g transform="translate(578 103)" id="g8979">
+            <path id="path8981" d="M0 0v-.3h-.6l-.1-.1v-.4H0v-.4h-1l-.2.2h-.3l-.1-.1v-.6H.7V.5h-2.3v-.6h.5V0H0z" fill="#f2f2f2"/>
+          </g>
+          <g transform="translate(576 103.6)" id="g8983">
+            <path id="path8985" d="M0 0h-.5l-.1-.1-.6-1.3L-2-.1V0h-.5s-.1 0 0-.1l.9-2 .2-.1h.5l1 2L0 0" fill="#f2f2f2"/>
+          </g>
+          <g transform="translate(573 102.8)" id="g8987">
+            <path id="path8989" d="M0 0h.1v-.4L0-.5h-1.5v-.3H0L.1-1v-.4h-2.2v2l.1.2H.1V.4h-1.6V0z" fill="#f2f2f2"/>
+          </g>
+          <g transform="translate(583.5 136.6)" id="g8991">
+            <path id="path8993" d="M0 0l-.8 1.3-1.4-2.9 4-1c-.5.5-.5.7-.9 1.3.5.1 1 .4 1.4.7.8.4 1.5 1 2 1.9a4 4 0 0 1-.6 3.6c-.4 0-.8 0-1.3-.2C3.5 3 3.5 1 0 0" fill="#303030"/>
+          </g>
+          <g transform="translate(583.1 141.4)" id="g8995">
+            <path id="path8997" d="M0 0l.8-1.2 1.4 2.8-3.8 1 .7-1.3-1.3-.7a4.5 4.5 0 0 1-2-2c-.4-1-.2-2.4.5-3.4.4 0 .8 0 1.2.2C-3.3-3-3.3-1 0 0" fill="#303030"/>
+          </g>
+        </g>
+      </g>
+    </g>
+  </g>
+</svg>

docs/static/download/transfer.svg

@@ -0,0 +1,327 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="261.3" height="109.3" viewBox="0 0 69.1 28.9" id="svg9461">
+  <defs id="defs9455">
+    <clipPath id="clipPath8689">
+      <path d="M0 1145.9h1366V0H0z" id="path8687"/>
+    </clipPath>
+    <clipPath id="clipPath8663">
+      <path d="M309.8 89.4h3.7v3.7h-3.7z" id="path8661"/>
+    </clipPath>
+    <clipPath id="clipPath8647">
+      <path d="M0 1145.9h1366V0H0z" id="path8645"/>
+    </clipPath>
+    <linearGradient x2="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(0 .6661 -.32488 0 300.7 115)" id="linearGradient8637">
+      <stop offset="0" id="stop8633" stop-color="#757575"/>
+      <stop offset="1" id="stop8635" stop-color="#393939"/>
+    </linearGradient>
+    <clipPath id="clipPath8595">
+      <path d="M0 1145.9h1366V0H0z" id="path8593"/>
+    </clipPath>
+    <linearGradient x2="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(0 12.8096 -17.18704 0 300.7 98.4)" id="linearGradient8585">
+      <stop offset="0" id="stop8579" stop-color="#6a6a6a"/>
+      <stop offset=".5" id="stop8581" stop-color="#48e400"/>
+      <stop offset="1" id="stop8583" stop-color="#6a6a6a"/>
+    </linearGradient>
+    <clipPath id="clipPath8561">
+      <path d="M0 1145.9h1366V0H0z" id="path8559"/>
+    </clipPath>
+    <linearGradient x2="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(0 -1.33016 5.597 0 300.7 88.4)" id="linearGradient8551">
+      <stop offset="0" id="stop8547" stop-color="#a9aba9"/>
+      <stop offset="1" id="stop8549" stop-color="#535453"/>
+    </linearGradient>
+    <clipPath id="clipPath8525">
+      <path d="M0 1145.9h1366V0H0z" id="path8523"/>
+    </clipPath>
+    <linearGradient x2="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(0 -.56074 .70884 0 300.7 115.6)" id="linearGradient8515">
+      <stop offset="0" id="stop8511" stop-color="#a9aba9"/>
+      <stop offset="1" id="stop8513" stop-color="#818181"/>
+    </linearGradient>
+    <clipPath id="clipPath8493">
+      <path d="M0 1145.9h1366V0H0z" id="path8491"/>
+    </clipPath>
+    <linearGradient x2="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(0 -2.39765 2.48247 0 300.7 98.1)" id="linearGradient8483">
+      <stop offset="0" id="stop8479" stop-color="#f2f2f2"/>
+      <stop offset="1" id="stop8481" stop-color="#7a7a7a"/>
+    </linearGradient>
+    <clipPath id="clipPath8449">
+      <path d="M0 1145.9h1366V0H0z" id="path8447"/>
+    </clipPath>
+    <clipPath id="clipPath8977">
+      <path d="M0 1145.9h1366V0H0z" id="path8975"/>
+    </clipPath>
+    <clipPath id="clipPath8951">
+      <path d="M593 101h3.6v3.7H593z" id="path8949"/>
+    </clipPath>
+    <clipPath id="clipPath8935">
+      <path d="M0 1145.9h1366V0H0z" id="path8933"/>
+    </clipPath>
+    <linearGradient x2="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(0 .67046 -.32706 0 583.8 126.8)" id="linearGradient8925">
+      <stop offset="0" id="stop8921" stop-color="#757575"/>
+      <stop offset="1" id="stop8923" stop-color="#393939"/>
+    </linearGradient>
+    <clipPath id="clipPath8883">
+      <path d="M0 1145.9h1366V0H0z" id="path8881"/>
+    </clipPath>
+    <linearGradient x2="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(0 12.89405 -17.29507 0 583.7 110)" id="linearGradient8873">
+      <stop offset="0" id="stop8867" stop-color="#6a6a6a"/>
+      <stop offset=".5" id="stop8869" stop-color="#48e400"/>
+      <stop offset="1" id="stop8871" stop-color="#6a6a6a"/>
+    </linearGradient>
+    <clipPath id="clipPath8849">
+      <path d="M0 1145.9h1366V0H0z" id="path8847"/>
+    </clipPath>
+    <linearGradient x2="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(0 -1.33884 5.6329 0 583.7 100)" id="linearGradient8839">
+      <stop offset="0" id="stop8835" stop-color="#a9aba9"/>
+      <stop offset="1" id="stop8837" stop-color="#535453"/>
+    </linearGradient>
+    <clipPath id="clipPath8813">
+      <path d="M0 1145.9h1366V0H0z" id="path8811"/>
+    </clipPath>
+    <linearGradient x2="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(0 -.56429 .71345 0 583.7 127.4)" id="linearGradient8803">
+      <stop offset="0" id="stop8799" stop-color="#a9aba9"/>
+      <stop offset="1" id="stop8801" stop-color="#818181"/>
+    </linearGradient>
+    <clipPath id="clipPath8781">
+      <path d="M0 1145.9h1366V0H0z" id="path8779"/>
+    </clipPath>
+    <linearGradient x2="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(0 -2.41323 2.4988 0 583.7 109.8)" id="linearGradient8771">
+      <stop offset="0" id="stop8767" stop-color="#f2f2f2"/>
+      <stop offset="1" id="stop8769" stop-color="#7a7a7a"/>
+    </linearGradient>
+    <clipPath id="clipPath8737">
+      <path d="M0 1145.9h1366V0H0z" id="path8735"/>
+    </clipPath>
+    <clipPath id="clipPath9285">
+      <path d="M0 1145.9h1366V0H0z" id="path9283"/>
+    </clipPath>
+    <clipPath id="clipPath9259">
+      <path d="M852.5 96.3h3.3v3.3h-3.3z" id="path9257"/>
+    </clipPath>
+    <clipPath id="clipPath9243">
+      <path d="M0 1145.9h1366V0H0z" id="path9241"/>
+    </clipPath>
+    <linearGradient x2="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(0 .61565 -.3002 0 844 120)" id="linearGradient9233">
+      <stop offset="0" id="stop9229" stop-color="#757575"/>
+      <stop offset="1" id="stop9231" stop-color="#393939"/>
+    </linearGradient>
+    <clipPath id="clipPath9191">
+      <path d="M0 1145.9h1366V0H0z" id="path9189"/>
+    </clipPath>
+    <linearGradient x2="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(0 11.84237 -15.8829 0 844 104.6)" id="linearGradient9181">
+      <stop offset="0" id="stop9175" stop-color="#6a6a6a"/>
+      <stop offset=".5" id="stop9177" stop-color="#48e400"/>
+      <stop offset="1" id="stop9179" stop-color="#6a6a6a"/>
+    </linearGradient>
+    <clipPath id="clipPath9157">
+      <path d="M0 1145.9h1366V0H0z" id="path9155"/>
+    </clipPath>
+    <linearGradient x2="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(0 -1.22922 5.1724 0 844 95.3)" id="linearGradient9147">
+      <stop offset="0" id="stop9143" stop-color="#a9aba9"/>
+      <stop offset="1" id="stop9145" stop-color="#535453"/>
+    </linearGradient>
+    <clipPath id="clipPath9121">
+      <path d="M0 1145.9h1366V0H0z" id="path9119"/>
+    </clipPath>
+    <linearGradient x2="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(0 -.51809 .65506 0 844 120.5)" id="linearGradient9111">
+      <stop offset="0" id="stop9107" stop-color="#a9aba9"/>
+      <stop offset="1" id="stop9109" stop-color="#818181"/>
+    </linearGradient>
+    <clipPath id="clipPath9089">
+      <path d="M0 1145.9h1366V0H0z" id="path9087"/>
+    </clipPath>
+    <linearGradient x2="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(0 -2.21578 2.29436 0 844 104.3)" id="linearGradient9079">
+      <stop offset="0" id="stop9075" stop-color="#f2f2f2"/>
+      <stop offset="1" id="stop9077" stop-color="#7a7a7a"/>
+    </linearGradient>
+    <clipPath id="clipPath9009">
+      <path d="M0 1145.9h1366V0H0z" id="path9007"/>
+    </clipPath>
+    <clipPath id="clipPath9041">
+      <path d="M779.5 134.7h16.7v-12.6h-16.7z" id="path9039"/>
+    </clipPath>
+    <clipPath id="clipPath9045">
+      <path d="M779.5 134.7h16.7v-12.6h-16.7z" id="path9043"/>
+    </clipPath>
+  </defs>
+  <g id="layer1" transform="translate(0 -268)">
+    <g id="g8999" transform="matrix(.35278 0 0 -.35278 40.2 289.4)">
+      <path d="M0 0h40" id="path9001" fill="none" stroke="#000" stroke-width="2"/>
+    </g>
+    <g id="g9011" transform="matrix(.35278 0 0 -.35278 10.4 271.7)">
+      <path d="M0 0h83a4 4 0 0 0 4-4v-52.5H-4V-4a4 4 0 0 0 4 4" id="path9013" fill="#e6e6e6"/>
+    </g>
+    <g id="g9015" transform="matrix(.35278 0 0 -.35278 10.4 272.3)">
+      <path d="M0 0h83c1.3 0 2.4-1.1 2.4-2.5V-52c0-.9-.6-1.5-1.5-1.5H-1c-.8 0-1.5.6-1.5 1.5v49.5C-2.5-1.1-1.4 0 0 0z" id="path9017" fill="none" stroke="#282828" stroke-width="3"/>
+    </g>
+    <g id="g9019" transform="matrix(.35278 0 0 -.35278 5.8 291.9)">
+      <path d="M0 0h108.8v-1.2a3 3 0 0 0-3-3H3a3 3 0 0 0-3 3z" id="path9021" fill="#626262"/>
+    </g>
+    <g id="g9023" transform="matrix(.35278 0 0 -.35278 21.6 291.9)">
+      <path d="M0 0h19.3c0-.8-.6-1.4-1.4-1.4H1.4C.6-1.4 0-.8 0 0" id="path9025" fill="#818181"/>
+    </g>
+    <g id="g9027" transform="matrix(.35278 0 0 -.35278 45 286.7)">
+      <path d="M0 0l-28-5.4-7.6 39 20 3.9c3.9-2.4 8-4.7 9.4-5.4z" id="path9029" fill="#fff"/>
+    </g>
+    <g id="g9031" transform="matrix(.35278 0 0 -.35278 45.4 287)">
+      <path d="M0 0l-30-5.8-8 41 21.5 4.1c4.7-2.8 10-5.7 10-5.7zm-2.3 1.6l-6 30.7c-1.6.8-5.2 2.8-8.6 4.9l-18.7-3.6 7.2-37 26 5" id="path9033" fill="#303030"/>
+    </g>
+    <g id="g9035" transform="matrix(.35278 0 0 -.35278 -239.7 326.4)">
+      <g id="g9061">
+        <g clip-path="url(#clipPath9041)" id="g9059">
+          <g id="g9057">
+            <g id="g9055">
+              <g clip-path="url(#clipPath9045)" id="g9053">
+                <g aria-label=".uf2" transform="scale(1 -1) rotate(-11 -255.3 -4117.6)" style="-inkscape-font-specification:LEGOChalet60-Bold" id="text9051" font-weight="700" font-size="9" font-family="LEGO Chalet 60" fill="#303030">
+                  <path d="M2.4 0H.8v-1.7h1.6z" id="path12451"/>
+                  <path d="M7.6 0H6.1v-.5l-.9.5-.8.1Q3.6.1 3-.3q-.4-.5-.4-1.4V-5h1.6v3l.1.4q0 .2.3.3h.9l.5-.2V-5h1.5z" id="path12453"/>
+                  <path d="M11.1-5.7H9.7q-.2.2-.2.7h1.3v1.1H9.6V0H8v-3.9h-.7v-1H8v-.2q0-.9.5-1.3Q9-7 10-7h.6l.5.1z" id="path12455"/>
+                  <path d="M16 0h-5.2v-1L12-2l1-.8q.5-.5.7-1 .2-.3.2-.7 0-.4-.3-.7-.3-.2-.8-.2l-.9.2-.8.4H11v-1.5l.9-.2 1.2-.2q1.2 0 1.9.5.6.6.6 1.5 0 .6-.3 1.2-.3.5-1 1.1l-.7.7-.6.4h3z" id="path12457"/>
+                </g>
+              </g>
+            </g>
+          </g>
+        </g>
+      </g>
+    </g>
+    <g transform="matrix(.35278 0 0 -.35278 -239.7 326.4)" id="g9063">
+      <g id="g9065">
+        <g id="g9071">
+          <g id="g9073">
+            <path d="M829.4 131.8a.5.5 0 0 1-.5-.6v-28c0-.3.2-.6.5-.6h29.1c.3 0 .6.3.6.6v28c0 .3-.3.6-.6.6z" id="path9081" fill="url(#linearGradient9079)"/>
+          </g>
+        </g>
+      </g>
+    </g>
+    <g transform="matrix(.35278 0 0 -.35278 -239.7 326.4)" id="g9083">
+      <g id="g9085" clip-path="url(#clipPath9089)">
+        <g id="g9091" transform="translate(831.1 105.6)">
+          <path d="M0 0h25.7c.3 0 .6-.2.6-.5V-11c0-.3-.3-.6-.6-.6H0c-.3 0-.5.3-.5.6V-.5c0 .3.2.5.5.5" id="path9093" fill="#f2f2f2"/>
+        </g>
+      </g>
+    </g>
+    <g transform="matrix(.35278 0 0 -.35278 -239.7 326.4)" id="g9095">
+      <g id="g9097">
+        <g id="g9103">
+          <g id="g9105">
+            <path d="M830.9 140.4a.5.5 0 0 1-.6-.5v-20.5c0-.3.3-.6.6-.6H857c.3 0 .5.3.5.6v20.5c0 .3-.2.5-.5.5z" id="path9113" fill="url(#linearGradient9111)"/>
+          </g>
+        </g>
+      </g>
+    </g>
+    <g transform="matrix(.35278 0 0 -.35278 -239.7 326.4)" id="g9115">
+      <g id="g9117" clip-path="url(#clipPath9121)">
+        <g id="g9123" transform="translate(833.9 137.6)">
+          <path d="M0 0h20.3c.6 0 1-.5 1-1v-11.4c0-.6-.4-1-1-1H0a1 1 0 0 0-1 1V-1c0 .5.4 1 1 1" id="path9125" fill="#393939"/>
+        </g>
+        <g id="g9127" transform="translate(835.4 137)">
+          <path d="M0 0h17.2c.5 0 .8-.3.8-.7v-11c0-.5-.3-.8-.8-.8H0c-.4 0-.7.3-.7.8v11c0 .4.3.7.7.7" id="path9129" fill="#98b6a7"/>
+        </g>
+      </g>
+    </g>
+    <g transform="matrix(.35278 0 0 -.35278 -239.7 326.4)" id="g9131">
+      <g id="g9133">
+        <g id="g9139">
+          <g id="g9141">
+            <path d="M830.6 100.4v-5.8c0-.3.2-.5.5-.5h25.7c.3 0 .6.2.6.5v5.8z" id="path9149" fill="url(#linearGradient9147)"/>
+          </g>
+        </g>
+      </g>
+    </g>
+    <g transform="matrix(.35278 0 0 -.35278 -239.7 326.4)" id="g9151">
+      <g id="g9153" clip-path="url(#clipPath9157)">
+        <g id="g9159" transform="translate(842.2 103.9)">
+          <path d="M0 0l-3.9 3.9v.5h-1a2.3 2.3 0 1 0 0 4.5h1v.5l3.9 4h3.8c1.7-1.9 3.9-4 3.9-4V9h.8a2.3 2.3 0 0 0 0-4.5h-.8V4L3.8 0z" id="path9161" fill="#6a6a6a"/>
+        </g>
+      </g>
+    </g>
+    <g transform="matrix(.35278 0 0 -.35278 -239.7 326.4)" id="g9163">
+      <g id="g9165">
+        <g id="g9171">
+          <g id="g9173">
+            <path d="M842.1 117.2l-3.8-3.9v-.5h-1a2.3 2.3 0 1 1 0-4.5h1v-.5l3.9-3.9h3.8l3.8 3.9v.5h1c1.1 0 2 1 2.1 2.2 0 1.2-1 2.3-2.2 2.3h-.9v.6l-3.8 3.8z" id="path9183" fill="url(#linearGradient9181)"/>
+          </g>
+        </g>
+      </g>
+    </g>
+    <g transform="matrix(.35278 0 0 -.35278 -239.7 326.4)" id="g9185">
+      <g id="g9187" clip-path="url(#clipPath9191)">
+        <g id="g9193" transform="translate(837.3 112.3)">
+          <path d="M0 0h2.8v-3.4H0A1.7 1.7 0 0 0 0 0" id="path9195" fill="#a9aba9"/>
+        </g>
+        <g id="g9197" transform="translate(850.7 109)">
+          <path d="M0 0h-2.8v3.4H0A1.7 1.7 0 0 0 0 0" id="path9199" fill="#a9aba9"/>
+        </g>
+        <g id="g9201" transform="translate(842.4 112.3)">
+          <path d="M0 0h3.3v-3.3H-.1V0H0" id="path9203" fill="#393939"/>
+        </g>
+        <g id="g9205" transform="translate(842.3 116.6)">
+          <path d="M0 0h3.5L6-2.6 5-3.7v-2H4v1.2c0 .4-.4.8-.8.8h-3a.7.7 0 0 1-.7-.7v-1.3h-1v2l-1.1 1z" id="path9207" fill="#a9aba9"/>
+        </g>
+        <g id="g9209" transform="translate(845.8 104.6)">
+          <path d="M0 0h-3.5L-6 2.7l1.1 1v2h1V4.6c0-.5.4-.9.8-.9h3a.7.7 0 0 1 .8.7v1.3h1v-2l1-1z" id="path9211" fill="#a9aba9"/>
+        </g>
+        <path d="M843.6 124.1h.8v-3.7h-.8z" id="path9213" fill="#393939"/>
+        <path d="M843.6 120.5h.8V119h-.8z" id="path9215" fill="#9b9b9b"/>
+      </g>
+    </g>
+    <g transform="matrix(.35278 0 0 -.35278 -239.7 326.4)" id="g9217">
+      <g id="g9219">
+        <g id="g9225">
+          <g id="g9227">
+            <path d="M843.6 118.8h.8v1.7h-.8z" id="path9235" fill="url(#linearGradient9233)"/>
+          </g>
+        </g>
+      </g>
+    </g>
+    <g transform="matrix(.35278 0 0 -.35278 -239.7 326.4)" id="g9237">
+      <g id="g9239" clip-path="url(#clipPath9243)">
+        <path d="M843.6 118.8h.8v-1.6h-.8z" id="path9245" fill="#818181"/>
+        <g id="g9247" transform="translate(832.5 118.8)">
+          <path d="M0 0h6.5v-1.6L4.8-3.2H.5c-.3 0-.5.3-.5.6z" id="path9249" fill="#a9aba9"/>
+        </g>
+        <path d="M852.5 99.6h3.3v-3.3h-3.3z" id="path9251" fill="#fff"/>
+      </g>
+    </g>
+    <g transform="matrix(.35278 0 0 -.35278 -239.7 326.4)" id="g9253">
+      <g id="g9255" clip-path="url(#clipPath9259)">
+        <g id="g9261" transform="translate(855.6 98.2)">
+          <path d="M0 0v-.3C-.3-.7-.4-1-.7-1-.9-1-1-1-1-.8a.5.5 0 0 0-.5-.2l-.3.1h-.8l-.3.1c0 .4.2.6.3 1h.5l.4.2.3-.1h.6V.2h.1l.4.2.2-.1V0m-3-2H.2v3.4H-3z" id="path9263" fill="#fe0"/>
+        </g>
+        <g id="g9265" transform="translate(855.7 98.1)">
+          <path d="M0 0l-.1-.4C-.2-.7-.5-1-.7-1c-.2 0-.3 0-.4.2a.6.6 0 0 0-.4-.2l-.3.1a.6.6 0 0 0-.3 0h-.6c-.2 0-.4 0-.4.3l.3.9.4.2.2-.1.4.1h.6l.4-.1h.7L0 0m-3.2-1.8H.1v3.3h-3.3z" id="path9267" fill="#d52715"/>
+        </g>
+        <path d="M855.8 96.3h-3.3v3.3h3.3zm-3.3 0h3.3v3.3h-3.3z" id="path9269" fill="#171714"/>
+        <g id="g9271" transform="translate(855.7 98.7)">
+          <path d="M0 0v-.2.2m0 0v-.1m0 0zm0 0z" id="path9273" fill="#171714"/>
+        </g>
+        <g id="g9275" transform="translate(855.3 98.2)">
+          <path d="M0 0l-.2-.5h-.1c0 .2 0 .4.2.5H0m.2-.1L.1-.6l-.4-.2c-.1 0-.3 0-.3.2l.1.5c.1.2.2.4.5.4s.3-.3.2-.4m-1 .2l-.3-.6.2.1v.1l.1.1c.2 0 .2-.1.2-.2 0-.2-.2-.4-.5-.4-.1 0-.2 0-.2.2V0c.2.2.3.4.6.4.1 0 .2 0 .2-.2L-.6 0s-.2 0-.1.1m-1-.4v-.1h.3c0-.2-.2-.3-.3-.3-.1 0-.2 0-.3.2l.2.7.4.2.2-.1c0-.1 0-.2-.2-.2l-.2-.1.3-.1c0-.2-.2-.2-.3-.1m-.6-.2h.2c0-.3-.2-.3-.3-.3 0 0-.2 0-.2.2 0 .3.2.5.3.8h.2c0-.2 0-.5-.2-.7M0 .4C-.2.4-.3.4-.4.2c-.1.2-.2.2-.4.2L-1 .3l-.3.1c-.1 0-.3 0-.4-.2v.1h-.5l-.3-1s.1-.2.3-.2l.3.1.3-.1.3.1.3-.1c.2 0 .3 0 .4.2l.4-.2c.3 0 .5.2.6.6V0a.3.3 0 0 1-.3.4" id="path9277" fill="#171714"/>
+        </g>
+      </g>
+    </g>
+    <g transform="matrix(.35278 0 0 -.35278 -239.7 326.4)" id="g9279">
+      <g id="g9281" clip-path="url(#clipPath9285)">
+        <g id="g9287" transform="translate(838.7 98.2)">
+          <path d="M0 0v-.3h-.5l-.1-.1v-.4H0v-.3h-1v.2h-.4v-.6h2V.4h-2v-.5h.4V0h1z" id="path9289" fill="#f2f2f2"/>
+        </g>
+        <g id="g9291" transform="translate(836.9 98.7)">
+          <path d="M0 0h-.4l-.2-.1-.5-1.2-.6 1.2-.1.1h-.5v-.1l.8-1.8.2-.1h.5l.9 2H0" id="path9293" fill="#f2f2f2"/>
+        </g>
+        <g id="g9295" transform="translate(834.2 97.9)">
+          <path d="M0 0h.1v-.4h-1.5v-.4H0L.1-1v-.3H-2v2h2V.3h-1.5V0z" id="path9297" fill="#f2f2f2"/>
+        </g>
+        <g id="g9299" transform="translate(820.8 131.1)">
+          <path d="M0 0l-1.9-2.9 7.3-1C4.3 1.3 4 1.7 3.4 5.2l-2-3a39.5 39.5 0 0 1-4.1 3.2c-1.4.8-3 1.3-4.7 1.5-2.1 0-4.3-.2-6.4-.8l.1-3.3C-9 4.8-3.5 3.8 0 0" id="path9301" fill="#303030"/>
+        </g>
+        <g id="g9303" transform="translate(767 107.4)">
+          <path d="M0 0c1.6 2.3 3.8 4 6.4 5" id="path9305" fill="none" stroke="#303030"/>
+        </g>
+        <g id="g9307" transform="translate(766.2 110.4)">
+          <path d="M0 0c1.6 2.3 3.8 4 6.4 5" id="path9309" fill="none" stroke="#303030"/>
+        </g>
+        <g id="g9311" transform="translate(765.6 113.3)">
+          <path d="M0 0c1.6 2.3 3.8 4 6.4 5" id="path9313" fill="none" stroke="#303030"/>
+        </g>
+      </g>
+    </g>
+  </g>
+</svg>

docs/static/filelogo.svg

@@ -0,0 +1,4 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32">
+  <path fill="#aa278f" d="M32 15.994v-.011c0-.108-.005-.209-.016-.303h-.001c-.032-.285-.112-.504-.239-.656-.171-.204-.459-.435-.864-.691a4.275 4.275 0 0 1-.986-.827c-.252-.296-.442-.734-.57-1.316-.049-.227-.087-.719-.112-1.473V8.696c0-.38-.031-.723-.076-1.049a12.313 12.313 0 0 0-.004-.188c-.009-.782-.18-1.475-.513-2.078a3.462 3.462 0 0 0-1.416-1.401c-.611-.33-1.305-.495-2.081-.495H6.271s-.674.067-.962.201a4.021 4.021 0 0 0-.521.295 3.502 3.502 0 0 0-.798.59c-.693.688-1.061 1.601-1.113 2.734a9.172 9.172 0 0 0-.088 1.283v2.558a6.802 6.802 0 0 1-.183 1.373 2.311 2.311 0 0 1-.532 1.033 2.67 2.67 0 0 0-.202.196c-.265.238-.638.511-1.13.823-.404.262-.64.633-.715 1.108l-.002.023a2.195 2.195 0 0 0-.023.287L0 16.006v.011c0 .108.005.209.016.303h.001c.032.285.112.504.239.656.171.204.459.435.864.691.406.256.735.532.986.827.252.296.442.734.57 1.316.049.227.087.719.112 1.473v2.019c0 .38.031.723.076 1.049l.004.188c.009.782.18 1.475.513 2.078a3.462 3.462 0 0 0 1.416 1.401c.611.33 1.305.495 2.081.495H25.73c.35 0 .673-.067.961-.201.184-.085.356-.187.521-.296.291-.159.559-.353.798-.59.693-.688 1.061-1.601 1.113-2.734.056-.398.088-.823.088-1.283v-2.558c.019-.495.079-.953.183-1.373.104-.419.282-.762.532-1.033a2.67 2.67 0 0 0 .202-.196c.265-.238.638-.511 1.13-.823.404-.262.64-.633.715-1.108h.002l.002-.023c.013-.092.022-.187.023-.287v-.014z"/>
+  <path fill="#fff" d="M27.366 16.522l.819-.518-.821-.516a4.547 4.547 0 0 1-.927-.744 3.033 3.033 0 0 1-.554-.896 5.166 5.166 0 0 1-.328-1.339 16.319 16.319 0 0 1-.103-1.961c0-.781-.016-1.365-.05-1.786-.039-.489-.123-.852-.258-1.112a1.36 1.36 0 0 0-.718-.661c-.223-.089-.527-.154-.924-.199a.532.532 0 0 1-.356-.213c-.11-.133-.165-.344-.165-.627 0-.41.086-.811 1.121-.811.636 0 1.196.127 1.666.376.464.247.818.589 1.085 1.046.267.458.406.995.413 1.597.064 3.554.129 4.265.184 4.492.153.63.382 1.109.701 1.464.287.319.635.602 1.035.843.29.175.501.341.627.493.035.043.116.181.116.554 0 .383-.12.628-.39.794-.606.373-1.041.699-1.331.997a2.734 2.734 0 0 0-.678 1.24c-.112.437-.177 1.05-.198 1.875-.02.773-.042 1.741-.066 2.904-.021.941-.306 1.668-.873 2.222-.568.554-1.317.823-2.291.823-.409 0-.71-.077-.895-.23-.155-.128-.226-.32-.226-.604 0-.179.03-.336.093-.479a.682.682 0 0 1 .188-.268.463.463 0 0 1 .24-.094c.414-.055.725-.127.951-.219.317-.131.567-.378.723-.716.124-.269.2-.625.233-1.089.029-.402.044-.968.044-1.725.016-1.061.077-1.896.182-2.481.095-.53.274-.987.533-1.359.261-.375.665-.736 1.198-1.073zm-16.618 6.519h10.458a.75.75 0 0 0 .751-.751l-.001-3.709c-.134-.449-.518-.492-.878-.15-.033 0-.393.443-1.22.443a2.033 2.033 0 0 1-1.944-1.715h-.011a6.59 6.59 0 0 1 0-.526h.011a2.03 2.03 0 0 1 1.944-1.715c.827 0 1.187.443 1.22.443.35.332.738.252.879-.147l.001-3.432a.769.769 0 0 0-.562-.741c-.061.016-3.259 0-3.259 0-.786.065-1.063-.466-.624-.928 0-.033.443-.393.443-1.22a2.033 2.033 0 0 0-1.715-1.944v-.011a6.59 6.59 0 0 0-.526 0v.011A2.03 2.03 0 0 0 14 8.893c0 .827.443 1.187.443 1.22.439.462.254.97-.624.928 0 0-3.198.016-3.259 0a.77.77 0 0 0-.562.741V22.29a.75.75 0 0 0 .75.751zm-6.197-3.692c.055.227.12.938.184 4.492.007.602.146 1.138.413 1.597.267.458.622.8 1.085 1.046.47.25 1.03.376 1.666.376 1.035 0 1.121-.4 1.121-.811 0-.283-.056-.493-.165-.627a.537.537 0 0 0-.356-.213c-.397-.045-.701-.11-.925-.199a1.367 1.367 0 0 1-.718-.661c-.135-.259-.219-.623-.258-1.112a24.159 24.159 0 0 1-.05-1.786c0-.751-.035-1.41-.103-1.961a5.174 5.174 0 0 0-.329-1.339 3.028 3.028 0 0 0-.554-.896 4.52 4.52 0 0 0-.927-.744l-.821-.516.819-.518c.533-.337.936-.698 1.199-1.075.259-.372.438-.829.533-1.359.105-.585.166-1.419.182-2.481 0-.757.014-1.323.044-1.725.033-.464.109-.82.233-1.089.156-.337.406-.584.723-.715.226-.092.537-.163.951-.219a.463.463 0 0 0 .24-.094.662.662 0 0 0 .189-.267 1.18 1.18 0 0 0 .093-.479c0-.284-.072-.476-.226-.604-.186-.153-.487-.23-.895-.23-.974 0-1.723.269-2.291.823-.567.554-.852 1.281-.873 2.222a588.806 588.806 0 0 1-.065 2.904c-.021.825-.086 1.438-.198 1.875a2.731 2.731 0 0 1-.679 1.24c-.289.298-.725.624-1.331.997-.27.166-.39.41-.39.794 0 .373.081.511.116.554.127.153.338.319.627.493.4.24.748.524 1.035.843.319.355.548.834.701 1.464z"/>
+</svg>

docs/static/fonts/icons/iconfont.css

@@ -1,8 +1,8 @@
 @font-face {
 	font-family: "iconfont";
-	src: url("iconfont.eot?e05611aaee246c1da118a83eaf515de9?#iefix") format("embedded-opentype"),
+	src: url("iconfont.eot?8b7e57577c2d1f1ae9e810b9e010bc84?#iefix") format("embedded-opentype"),
-url("iconfont.woff2?e05611aaee246c1da118a83eaf515de9") format("woff2"),
+url("iconfont.woff2?8b7e57577c2d1f1ae9e810b9e010bc84") format("woff2"),
-url("iconfont.woff?e05611aaee246c1da118a83eaf515de9") format("woff");
+url("iconfont.woff?8b7e57577c2d1f1ae9e810b9e010bc84") format("woff");
 }
 
 .icon {
@@ -28,3 +28,66 @@ url("iconfont.woff?e05611aaee246c1da118a83eaf515de9") format("woff");
 .icon-gyro:before {
 	content: "\f104";
 }
+.icon-addpackage:before {
+	content: "\f105";
+}
+.icon-brick:before {
+	content: "\f106";
+}
+.icon-controls:before {
+	content: "\f107";
+}
+.icon-functions:before {
+	content: "\f108";
+}
+.icon-list:before {
+	content: "\f109";
+}
+.icon-logic:before {
+	content: "\f10a";
+}
+.icon-loops:before {
+	content: "\f10b";
+}
+.icon-math:before {
+	content: "\f10c";
+}
+.icon-motors:before {
+	content: "\f10d";
+}
+.icon-music:before {
+	content: "\f10e";
+}
+.icon-sensors:before {
+	content: "\f10f";
+}
+.icon-text:before {
+	content: "\f110";
+}
+.icon-variables:before {
+	content: "\f111";
+}
+.icon-console:before {
+	content: "\f112";
+}
+.icon-advancedcollapsed:before {
+	content: "\f113";
+}
+.icon-advancedexpanded:before {
+	content: "\f114";
+}
+.icon-cancel:before {
+	content: "\f115";
+}
+.icon-check:before {
+	content: "\f116";
+}
+.icon-download:before {
+	content: "\f117";
+}
+.icon-save:before {
+	content: "\f118";
+}
+.icon-blocks:before {
+	content: "\f119";
+}

docs/static/fonts/icons/iconfont.svg

@@ -19,6 +19,69 @@
     <glyph glyph-name="gyro"
       unicode="&#xF104;"
       horiz-adv-x="23.578015492438215" d=" M17 0H6.4A5.901881224640355 5.901881224640355 0 0 0 5.1 0.3H2.3A1.283659166359277 1.283659166359277 0 0 0 1 1.6V4.5H0.5A0.5016599040944301 0.5016599040944301 0 0 0 0 5V35.4A0.5016599040944301 0.5016599040944301 0 0 0 0.5 35.9H1V38.7A1.283659166359277 1.283659166359277 0 0 0 2.3 40H10.6V39.6H12.8V40H21.2A1.283659166359277 1.283659166359277 0 0 0 22.5 38.7V35.9H23.1A0.5016599040944301 0.5016599040944301 0 0 0 23.6 35.4V5.1A0.5016599040944301 0.5016599040944301 0 0 0 23.1 4.6H22.5V1.6A1.283659166359277 1.283659166359277 0 0 0 21.2 0.4H18.5C18.4 0.1 17.2 0 17 0zM6.2 34.5L3.7 33.8A1.0033198081888601 1.0033198081888601 0 0 1 3.4 33.7A0.2360752489856142 0.2360752489856142 0 0 1 3.3 33.5A0.20656584286241245 0.20656584286241245 0 0 1 3.4 33.3L4.1 32.8A7.657690888970861 7.657690888970861 0 0 1 3.1 30A8.51346366654371 8.51346366654371 0 0 1 4.8 23.5C5.8 24.2 6.5 24.7 6.5 24.7A7.377351530800443 7.377351530800443 0 0 0 5.4 26.9A6.300258207303577 6.300258207303577 0 0 0 6 31.8L6.5 31.5H6.5L6.6 31.5A0.3541128734784213 0.3541128734784213 0 0 1 6.8 31.4A0.17705643673921065 0.17705643673921065 0 0 1 7 31.5A0.6344522316488379 0.6344522316488379 0 0 1 7 32L6.2 34.5zM17.5 31.8H17.5A6.300258207303577 6.300258207303577 0 0 0 18 26.9A7.510143858354851 7.510143858354851 0 0 0 17 24.7L17.1 24.6L18.6 23.5A8.631501291036518 8.631501291036518 0 0 1 20.3 30A7.657690888970861 7.657690888970861 0 0 1 19.3 32.8L19.8 33.1L20 33.2A0.22132054592401326 0.22132054592401326 0 0 1 20.1 33.4A0.26558465510881596 0.26558465510881596 0 0 1 20 33.6A1.0033198081888601 1.0033198081888601 0 0 1 19.7 33.7L17.2 34.5S17.1 34.1 17 33.6S16.6 32.3 16.5 32A0.619697528587237 0.619697528587237 0 0 1 16.5 31.5A0.17705643673921065 0.17705643673921065 0 0 1 16.6 31.4A0.48690520103282936 0.48690520103282936 0 0 1 16.8 31.4L16.8 31.4L17.4 31.7zM11.7 30.6A1.9918849133161198 1.9918849133161198 0 1 1 13.7 28.6A1.9918849133161198 1.9918849133161198 0 0 1 11.7 30.6H11.7z" />
+    <glyph glyph-name="addpackage"
+      unicode="&#xF105;"
+      horiz-adv-x="40" d=" M20 35.7C11.3 35.7 4.3 28.7 4.3 20S11.3 4.3 20 4.3S35.7 11.3 35.7 20S28.7 35.7 20 35.7zM30.4 18.3H21.7V9.6H18.3V18.3H9.6V21.7H18.3V30.4H21.7V21.7H30.4V18.3z" />
+    <glyph glyph-name="brick"
+      unicode="&#xF106;"
+      horiz-adv-x="40" d=" M34.3 0.9H5.7V39.1H34.4V0.9zM10.4 32.7V18.4H29.6V32.7H10.4z" />
+    <glyph glyph-name="controls"
+      unicode="&#xF107;"
+      horiz-adv-x="40" d=" M6.1 33H9.6V5.2H6.1V33z M18.3 33H21.7V5.2H18.3V33z M30.4 33H33.9V5.2H30.4V33z M2.6 15.7H13V7H2.6V15.7z M14.8 31.3H25.2V22.6H14.8V31.3z M27 22.6H37.4V13.9H27V22.6z" />
+    <glyph glyph-name="functions"
+      unicode="&#xF108;"
+      horiz-adv-x="40" d=" M12.2 25.4H9.1C9.1 26.3 9.1 26.5 9.9 26.5C11.5 26.5 12.5 27.2 13.1 28.6C13.8 30.1 14.8 31.5 15.7 33.1C16.5 34.3 18.1 35.3 19.7 35.5C20.7 35.7 21.9 35.3 22.5 34.5C22.8 33.9 22.8 33.4 22.6 32.7C22.3 32.2 21.8 32 21.1 32.2C20.5 32.2 20.2 32.7 20.2 33.3C20.2 33.4 20.2 33.4 20.2 33.6C20.2 33.9 20.4 34.3 20.4 34.6C20 34.6 19.5 34.8 19.2 34.6C18.5 34.3 17.9 33.9 17.4 33.1C16.7 32 16.2 30.6 15.7 29.4C15.3 28.6 15 27.3 14.8 26.5H17.2C17.1 26.1 17.1 25.8 16.9 25.4H14.5C13.9 23.5 13.6 21.9 12.9 20.2C12.2 16.7 10.8 13.4 9.4 10.1C8.7 8.6 7.7 7.3 6.6 6.3C5.8 5.4 4.5 4.9 3.3 4.9C2.6 4.7 1.8 5.1 1.1 5.4C0.7 5.8 0.5 6.5 0.7 7.2C1.1 7.7 1.6 8 2.5 7.9C3 7.9 3.2 7.3 3.2 6.8C3.2 6.6 3 6.5 3 6.5C2.8 6.3 2.8 6.1 2.8 5.9C3 5.9 3.2 5.8 3.5 5.8C4.4 5.8 5.4 6.3 5.9 7.2C6.5 8 7 9.1 7.2 9.9C8.5 15.2 10.1 20.4 11.7 25.4C12.2 25.3 12.2 25.3 12.2 25.4z M32.5 4.7C32.7 4.9 32.7 5.1 32.9 5.3C34.8 6.3 36 8.4 36.4 10.5C37.1 13.9 37.1 17.4 36.2 20.9C35.7 22.8 34.5 24.2 33.1 25.4C32.9 25.6 32.7 25.8 32.7 25.9C36 24.7 39.2 20.6 39.2 15.3C39.3 10.8 36.7 6.5 32.5 4.7z M23.9 25.8C23.9 25.6 23.7 25.4 23.7 25.4C21.8 24.4 20.5 22.3 20.2 20.2C19.5 16.7 19.5 13.3 20.4 9.6C20.9 7.7 22.1 6.3 23.5 5.1C23.7 4.9 23.9 4.9 23.9 4.6C20 6.5 17.4 10.5 17.6 15C17.4 20.7 20.9 24.9 23.9 25.8z M32 12.2C32 12.2 32.2 12.2 32.4 12C32.4 12 32.4 12 32.4 11.9C31.9 11 31.3 10.1 30.3 9.6C29.9 9.3 29.2 9.1 28.5 9.6C28.4 9.8 28.2 9.9 28.2 10.3C27.9 11.3 27.7 12.4 27.5 13.4C27.5 13.6 27.5 13.6 27.3 13.8C27.2 13.4 27 13.1 26.6 12.7C26.1 12 25.6 11 24.7 10.3C24.4 9.9 24 9.6 23.5 9.4C23 9.3 22.5 9.4 21.9 9.9V10.1C21.9 10.5 21.9 10.8 22.3 11C22.5 11.2 22.8 11.2 23.2 11L23.3 10.8C23.9 10.5 24 10.3 24.4 11C25.1 12 25.9 13.4 26.8 14.5C26.8 14.6 26.8 14.8 26.8 15C26.6 15.7 26.5 16.6 26.3 17.3C25.9 18.5 25.4 19 24 19H23.9C23.7 19.2 23.9 19.3 24 19.3C24.7 19.5 25.8 19.7 26.5 19.7C26.6 19.7 26.8 19.7 27 19.5C27.5 18.8 27.9 18.1 28 17.1C28 16.9 28.2 16.6 28.2 16.4C28.4 16.7 28.7 17.3 29.1 17.6C29.6 18.1 30.1 18.8 30.8 19.3C31.2 19.5 31.5 19.7 31.9 19.7C32.4 19.7 32.7 19.3 32.7 18.8V18.6C32.5 18.1 32.2 17.9 31.7 18.1L31.7 18.1C31.5 18.1 31.5 18.1 31.3 18.1C30.8 18.5 30.1 18.3 29.6 17.8L29.6 17.8C29.2 17.3 28.7 16.6 28.4 15.9C28.4 15.7 28.4 15.7 28.4 15.5C28.7 14.3 28.9 12.9 29.2 11.5C29.2 11.3 29.2 11.3 29.4 11.2C29.6 10.6 29.9 10.5 30.3 11C31.3 11.3 31.5 11.9 32 12.2z" />
+    <glyph glyph-name="list"
+      unicode="&#xF109;"
+      horiz-adv-x="40" d=" M11.1 30.4H36.9V27.3H11.1V30.4z M11.1 22.4H36.9V19.3H11.1V22.4z M11.1 14.4H36.9V11.3H11.1V14.4z M5.6 27.3H3.8V33.6H2.4V34.6C3.3 34.6 4 35.1 4.2 36.2H5.6V27.3z M7.7 17.6V16H1.4V16.7C1.4 18.8 2.8 19.7 4 20.3C5.7 21.2 5.7 21.6 5.7 22.1C5.7 22.6 5.4 23.1 4.5 23.1C3.7 23.1 3.1 22.4 3.1 21.6H1.4C1.4 23.1 2.4 24.7 4.5 24.7C6.6 24.7 7.5 23.3 7.5 22.1C7.5 20.3 6.3 19.8 4.9 19C4 18.4 3.3 17.9 3.3 17.4H7.7z M4.5 4.5C2.4 4.5 1.4 5.9 1.2 7.5H3C3 6.6 3.5 6.1 4.5 6.1C5.6 6.1 6.1 6.6 6.1 7.3C6.1 8 5.6 8.5 4.7 8.5H4.2V9.9H4.5C5.6 9.9 5.9 10.4 5.9 11C5.9 11.7 5.4 12 4.7 12C3.8 12 3.3 11.3 3.3 10.6H1.6C1.6 12.2 2.6 13.6 4.5 13.6C6.4 13.6 7.5 12.3 7.5 11.1C7.5 10.4 7.1 9.7 6.3 9.4C7.3 9 7.7 8.2 7.7 7.3C7.8 6.1 6.8 4.5 4.5 4.5z" />
+    <glyph glyph-name="logic"
+      unicode="&#xF10A;"
+      horiz-adv-x="40" d=" M2.8 14.1H7.4C10 14.2 12.2 16 13.1 18.6C15 23.1 18.3 31.3 23.7 31.3S29.8 31.3 29.8 31.3V35.8L36.9 28.3L29.8 21.5V26.4H24.9C22.3 25.7 20.2 24 19.4 21.5C17.3 17 15.2 9.4 8.2 9.2C5.1 9.2 3 9.2 3 9.2V14.1z M2.8 31.1V26.2H8.2C8.2 26.2 11.4 26.2 13.1 22.1C13.8 23.8 14.7 25.4 15.7 26.9C15.7 26.9 12.2 30.9 8.4 30.9S2.8 31.1 2.8 31.1z M19.5 18.4C19.5 18.4 21.8 13.9 24.4 13.9H30V18.4L37.3 11.3L30 4.2V9H23.7C23.7 9 20.2 9 16.9 13.4C18 14.9 18.8 16.7 19.5 18.4z" />
+    <glyph glyph-name="loops"
+      unicode="&#xF10B;"
+      horiz-adv-x="40" d=" M6.3 12.7C4.5 15.2 2.6 17.4 0.9 20H4.5C4.5 24.2 6.3 28.4 9.2 31.3C11.3 33.4 13.7 34.8 16.7 35.3C21.9 36.6 27.3 35 31.1 31.2C30.3 30.3 29.4 29.4 28.7 28.7C24.2 32.6 19.3 33.3 14.1 30.5C10.3 28.4 8.2 24.4 8.2 20.2H11.8C9.7 17.6 7.8 15 6.3 12.7z M32.2 20H28.5C30.4 22.5 32.2 24.7 33.9 27.3C35.8 24.9 37.6 22.6 39.3 20H35.6C35.6 15.7 33.7 11.5 30.6 8.6C28.5 6.6 26.1 5.3 23.3 4.7C18.1 3.5 12.7 5.1 8.9 8.9L11.3 11.3C15.6 7.5 20.7 6.6 25.9 9.6C29.9 11.7 32.2 15.7 32.2 20z" />
+    <glyph glyph-name="math"
+      unicode="&#xF10C;"
+      horiz-adv-x="40" d=" M15.2 5.3C14.9 4.9 14.2 4.2 13.8 3.9L9.3 8.4C7.6 6.7 6.2 5.3 4.8 3.9C4.4 4.2 3.8 4.9 3.4 5.3L7.9 9.8C6.2 11.5 4.8 12.9 3.4 14.3C3.8 14.7 4.4 15.4 4.8 15.7L9.3 11.2L13.8 15.7C14.2 15.4 14.9 14.7 15.2 14.3L10.7 9.8C12.1 8.2 13.7 6.7 15.2 5.3z M1.5 28V30H7.9V36.4C8.6 36.4 9.1 36.4 9.8 36.4V30H16.3V28H9.8V21.6H7.8V28H1.5z M38.4 10.7H22V14.1H38.4V10.7z M38.4 7.2V3.7H22V7.2H38.4z M38.4 31V27.5H22V31H38.4z" />
+    <glyph glyph-name="motors"
+      unicode="&#xF10D;"
+      horiz-adv-x="40" d=" M28.9 25.8C27.5 24.4 25.9 22.9 24.5 21.5H35.7V32.6L32.2 29.1C29.6 32.3 25.9 34.3 21.8 34.9C18.3 35.4 14.6 34.5 11.7 32.6C4.2 28.1 1.9 18.3 6.5 10.9S20.7 1.1 28.2 5.6C30.8 7.2 32.7 9.5 34.1 12.1C32.7 12.6 31.3 13.3 29.9 13.8C28.5 11 25.9 9 23 8.1C20.7 7.4 18.3 7.6 16 8.4C10.3 10.7 7.3 17.1 9.4 22.9C10.6 26.3 13.6 29 17.1 29.8C21.6 31.2 26.3 29.5 28.9 25.8z M16.7 19C16.7 17.1 18.3 15.7 20 15.7S23.3 17.3 23.3 19C23.3 21 21.8 22.3 20 22.3C18.1 22.5 16.7 21 16.7 19C16.7 19 16.7 19 16.7 19z" />
+    <glyph glyph-name="music"
+      unicode="&#xF10E;"
+      horiz-adv-x="40" d=" M24.2 17.7C27.1 17.2 29.9 15.7 31.7 13.2C32.5 13.2 33.4 13.2 33.4 13.2S36 20.9 30.3 26.3S13.4 31.7 9.2 26.3C6.3 22.6 5.2 17.6 6.8 13.2C7.3 13.2 7.7 13.2 8.2 13.2C8.2 13.2 11.1 17.6 15.8 17.7C15.7 10.1 15.7 3.5 15.7 3.5C12.3 4.2 9.6 6.3 8 9.4C4.5 10.1 1.7 13.2 1.7 17C1.7 28.3 10.3 34.8 20 34.8S38.8 27.3 38.1 17C37.7 9.9 31.8 9.4 31.8 9.4C30.4 6.3 27.7 4 24.3 3.5C24.2 11.3 24.2 17.7 24.2 17.7z" />
+    <glyph glyph-name="sensors"
+      unicode="&#xF10F;"
+      horiz-adv-x="40" d=" M20 36.9C10.6 36.9 3 29.2 3 19.8C3 10.4 10.6 2.8 20 2.8S37 10.4 37 19.8C36.9 29.4 29.4 36.9 20 36.9zM20 8.2C13.4 8.2 8.2 13.6 8.2 20S13.6 31.8 20 31.8S31.8 26.4 31.8 20S26.6 8.2 20 8.2z M13.2 20C13.2 16.3 16.3 13.2 20 13.2C23.7 13.2 26.8 16.3 26.8 20C26.8 23.7 23.7 26.8 20 26.8C16.3 26.8 13.2 23.7 13.2 20z" />
+    <glyph glyph-name="text"
+      unicode="&#xF110;"
+      horiz-adv-x="40" d=" M23.1 30.6V2.8H16.5V30.6H7.7V36.7H32.3V30.6H23.1z" />
+    <glyph glyph-name="variables"
+      unicode="&#xF111;"
+      horiz-adv-x="40" d=" M36.8 12V7.8H3.4V12H36.8z M36.8 22.1V17.9H3.4V22.1H36.8z M36.7 32.2V28H3.3V32.2H36.7z" />
+    <glyph glyph-name="console"
+      unicode="&#xF112;"
+      horiz-adv-x="40" d=" M15.6 21.3L2.3 15L2.3 19.8L11.1 23.6L2.3 27.4L2.3 32.2L15.6 25.9L15.6 21.3z M36 9.1L16.6 9.1L16.6 12.2L36 12.2L36 9.1z" />
+    <glyph glyph-name="advancedcollapsed"
+      unicode="&#xF113;"
+      horiz-adv-x="40" d=" M39.7 28.2L36.2 31.5L20 15.3L3.8 31.5L0.3 28.2L18.3 10.3L18.3 10.3L20 8.5L20.5 9L20.5 9z" />
+    <glyph glyph-name="advancedexpanded"
+      unicode="&#xF114;"
+      horiz-adv-x="40" d=" M39.3 12L21.7 29.6L21.7 29.6L20 31.3L19.5 30.8L19.5 30.8L0.7 12L4 8.7L20 24.7L36 8.7z" />
+    <glyph glyph-name="cancel"
+      unicode="&#xF115;"
+      horiz-adv-x="40" d=" M33 29.6L29.4 33.2L20.2 24L11 33.2L7.3 29.6L16.5 20.3L7.3 11.1L11 7.3L20.2 16.5L29.4 7.3L33 11.1L23.8 20.3z" />
+    <glyph glyph-name="check"
+      unicode="&#xF116;"
+      horiz-adv-x="40" d=" M33.7 32.9L15.3 14.4L7.5 22.3L3.8 18.4L11.7 10.8L11.7 10.8L15.3 7.1L37.4 29.2z" />
+    <glyph glyph-name="download"
+      unicode="&#xF117;"
+      horiz-adv-x="40" d=" M5.2 15.7H36.5V1.7H5.2V15.7z M28.5 24.2L26.1 26.6L22.6 23.1L22.6 36.5L19.1 36.5L19.1 23.5L16 26.6L13.6 24.2L20.9 16.7L21 16.9L21.2 16.7z" />
+    <glyph glyph-name="save"
+      unicode="&#xF118;"
+      horiz-adv-x="40" d=" M25 34.5C25 33.6 25 32.8 25 31.9C25 31 24.7 30.9 24 30.9C23.5 30.9 22.8 30.9 22.4 30.9C22.1 30.9 21.4 31 21.4 31.7V31.9V36.9C21.4 37.3 21.6 37.8 22.3 38C22.3 38 22.3 38 22.4 38C23 38 23.7 38 24.2 38C24.7 38 25.2 37.6 25.2 37.1C25.2 37.1 25.2 37.1 25.2 36.9C25 36.3 25 35.2 25 34.5z M37.6 31.2C35.8 32.9 34.3 34.5 32.5 36.3C31 37.8 31 37.8 28.5 37.8C27.5 37.8 27.3 37.6 27.3 36.6V28.4C27.3 27.4 27.1 27.2 26.1 27.2H14.3C13.2 27.2 13 27.4 13 28.4V36.4C13 37.6 12.9 37.8 11.7 37.8H3.8C2.6 37.8 2.4 37.6 2.4 36.4V19.9C2.4 14.3 2.4 8.9 2.4 3.2C2.4 2 2.6 1.8 3.7 1.8H36.9C37.9 1.8 38.1 2.2 38.1 3.2V29.6C38.3 30.5 37.9 30.9 37.6 31.2zM33.7 6.7H7.1V23H33.7V6.7z" />
+    <glyph glyph-name="blocks"
+      unicode="&#xF119;"
+      horiz-adv-x="40" d=" M10.9 23H39V16.9H10.9V23z M39.2 27.1L39.2 33L0.9 33L0.9 31.1L0.9 27.1L0.9 12.9L0.9 7L39.2 7L39.2 12.9L6.9 12.9L6.9 27.1z" />
   </font>
 </defs>
 </svg>

docs/static/loader_back.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="301.499" height="179.742" viewBox="0 0 282.655 168.508"><g transform="translate(-41.005 -446.364)"><rect ry="30" rx="30" y="458.77" x="53.41" height="143.698" width="105.312" stroke="#000" stroke-width="17.724" stroke-linecap="round" stroke-linejoin="round"/><rect width="105.668" height="144.183" x="53.232" y="458.527" rx="30.101" ry="30.101" fill="#fff"/></g><g transform="translate(111.528 -446.364)"><rect width="105.312" height="143.698" x="53.41" y="458.77" rx="30" ry="30" stroke="#000" stroke-width="17.724" stroke-linecap="round" stroke-linejoin="round"/><rect ry="30.101" rx="30.101" y="458.527" x="53.232" height="144.183" width="105.668" fill="#fff"/></g></svg>

docs/static/loader_front.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="301.499" height="179.742" viewBox="0 0 282.655 168.508"><g stroke="#000" stroke-linecap="round" stroke-linejoin="round"><g transform="translate(124.66 -243.829)"><circle r="25.968" cy="356.872" cx="-38.891" fill="none"/><circle cx="-38.891" cy="356.872" r="21.013" stroke-width=".809"/><path d="M-30.581 341.741a13.835 13.835 0 0 1 5.76 4.504l-11.099 8.26z" fill="#fff" stroke-width=".533"/></g><g transform="translate(277.193 -243.829)"><circle cx="-38.891" cy="356.872" r="25.968" fill="none"/><circle r="21.013" cy="356.872" cx="-38.891" stroke-width=".809"/><path d="M-30.581 341.741a13.835 13.835 0 0 1 5.76 4.504l-11.099 8.26z" fill="#fff" stroke-width=".533"/></g></g></svg>

docs/static/loader_full.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="301.499" height="179.742" viewBox="0 0 282.655 168.508"><g transform="translate(-41.005 -446.364)"><rect ry="30" rx="30" y="458.77" x="53.41" height="143.698" width="105.312" stroke="#000" stroke-width="17.724" stroke-linecap="round" stroke-linejoin="round"/><rect width="105.668" height="144.183" x="53.232" y="458.527" rx="30.101" ry="30.101" fill="#fff"/></g><g transform="translate(124.66 -243.829)" stroke="#000" stroke-linecap="round" stroke-linejoin="round"><circle r="25.968" cy="356.872" cx="-38.891" fill="none"/><circle cx="-38.891" cy="356.872" r="21.013" stroke-width=".809"/><path d="M-30.581 341.741a13.835 13.835 0 0 1 5.76 4.504l-11.099 8.26z" fill="#fff" stroke-width=".533"/></g><g transform="translate(111.528 -446.364)"><rect width="105.312" height="143.698" x="53.41" y="458.77" rx="30" ry="30" stroke="#000" stroke-width="17.724" stroke-linecap="round" stroke-linejoin="round"/><rect ry="30.101" rx="30.101" y="458.527" x="53.232" height="144.183" width="105.668" fill="#fff"/></g><g transform="translate(277.193 -243.829)" stroke="#000" stroke-linecap="round" stroke-linejoin="round"><circle cx="-38.891" cy="356.872" r="25.968" fill="none"/><circle r="21.013" cy="356.872" cx="-38.891" stroke-width=".809"/><path d="M-30.581 341.741a13.835 13.835 0 0 1 5.76 4.504l-11.099 8.26z" fill="#fff" stroke-width=".533"/></g></svg>

docs/tests/motors.md

@@ -1,94 +0,0 @@
-```typescript
-let errors: string[] = [];
-let tachoB = 0;
-let tachoC = 0;
-
-function assert(name: string, condition: boolean) {
-    if (!condition) {
-        errors.push(name)
-        brick.print("error:" + name, 0, 60)
-    }
-}
-
-function assertClose(name: string, expected: number, actual: number, tolerance = 5) {
-    const diff = Math.abs(expected - actual);
-    assert(name + ` ${expected}vs${actual}`, diff < tolerance);
-}
-
-function state(name: string, motor: motors.SingleMotor, line: number) {
-    brick.print(`${name}: ${motor.speed()}%,${motor.angle()}deg`, 0, 12 * line)
-}
-
-function test(name: string, f: () => void, check?: () => void) {
-    motors.stopAllMotors();
-    motors.largeB.clearCount()
-    motors.largeC.clearCount()
-    motors.largeB.setBrake(false)
-    motors.largeC.setBrake(false)
-    motors.largeB.setReversed(false);
-    motors.largeC.setReversed(false);
-    loops.pause(500);
-    tachoB = motors.largeB.angle()
-    tachoC = motors.largeC.angle()
-    brick.clearScreen()
-    brick.print(name, 0, 0)
-    state("B", motors.largeB, 1)
-    state("C", motors.largeC, 2)
-    f();
-    loops.pause(3000);
-    state("B", motors.largeB, 3)
-    state("C", motors.largeC, 4)
-    if (check)
-        check()
-    motors.stopAllMotors();
-    loops.pause(1000);
-}
-
-brick.buttonLeft.onEvent(ButtonEvent.Click, function () {
-    test("lgBC set speed 25", () => {
-        motors.largeBC.setSpeed(25)
-    }, () => {
-        assertClose("speedB", 25, motors.largeB.speed());
-        assertClose("speedC", 25, motors.largeC.speed());
-    });
-})
-
-brick.buttonEnter.onEvent(ButtonEvent.Click, function () {
-    test("lgB set speed 10", () => {
-        motors.largeB.setSpeed(10)
-    }, () => assertClose("speedB", 10, motors.largeB.speed()));
-    test("lgB set speed 25 (reversed)", () => {
-        motors.largeB.setReversed(true)
-        motors.largeB.setSpeed(25)
-    }, () => assertClose("speedB", -25, motors.largeB.speed()));
-    test("lgBC set speed 5", () => {
-        motors.largeBC.setSpeed(5)
-    }, () => {
-        assertClose("speedB", 5, motors.largeB.speed());
-        assertClose("speedC", 5, motors.largeC.speed());
-    });
-    test("lgBC steer 50% 2x", () => {
-        motors.largeBC.setBrake(true)
-        motors.largeBC.steer(50, 50, 2, MoveUnit.Rotations)
-    }, () => assertClose("largeB", 720, motors.largeB.angle()));
-    test("lgBC steer 50% 500deg", () => {
-        motors.largeBC.setBrake(true)
-        motors.largeBC.steer(50, 50, 500, MoveUnit.Degrees)
-    }, () => assertClose("largeB", 500, motors.largeB.angle()));
-    test("lgBC steer 50% 2s", () => {
-        motors.largeBC.setBrake(true)
-        motors.largeBC.steer(50, 50, 2000, MoveUnit.MilliSeconds)
-    })
-    test("lgBC tank 50% 720deg", () => {
-        motors.largeBC.setBrake(true)
-        motors.largeBC.tank(50, 50, 720, MoveUnit.Degrees)
-    }, () => assertClose("largeB", 720, motors.largeB.angle()));
-
-    brick.clearScreen()
-    brick.print(`${errors.length} errors`, 0, 0)
-    let l = 1;
-    for (const error of errors)
-        brick.print(`error: ${error}`, 0, l++ * 12)
-})
-
-```

editor/deploy.ts

@@ -0,0 +1,134 @@
+/// <reference path="../node_modules/pxt-core/built/pxteditor.d.ts"/>
+/// <reference path="../node_modules/pxt-core/built/pxtsim.d.ts"/>
+
+import UF2 = pxtc.UF2;
+
+export let ev3: pxt.editor.Ev3Wrapper
+
+export function debug() {
+    return initAsync()
+        .then(w => w.downloadFileAsync("/tmp/dmesg.txt", v => console.log(pxt.Util.uint8ArrayToString(v))))
+}
+
+function hf2Async() {
+    return pxt.HF2.mkPacketIOAsync()
+        .then(h => {
+            let w = new pxt.editor.Ev3Wrapper(h)
+            ev3 = w
+            return w.reconnectAsync(true)
+                .then(() => w)
+        })
+}
+
+let noHID = false
+
+let initPromise: Promise<pxt.editor.Ev3Wrapper>
+export function initAsync() {
+    if (initPromise)
+        return initPromise
+
+    let canHID = false
+    if (pxt.U.isNodeJS) {
+        // doesn't seem to work ATM
+        canHID = false
+    } else {
+        const forceHexDownload = /forceHexDownload/i.test(window.location.href);
+        if (pxt.Cloud.isLocalHost() && pxt.Cloud.localToken && !forceHexDownload)
+            canHID = true
+    }
+
+    if (noHID)
+        canHID = false
+
+    if (canHID) {
+        initPromise = hf2Async()
+            .catch(err => {
+                initPromise = null
+                noHID = true
+                return Promise.reject(err)
+            })
+    } else {
+        noHID = true
+        initPromise = Promise.reject(new Error("no HID"))
+    }
+
+    return initPromise
+}
+
+// this comes from aux/pxt.lms
+const rbfTemplate = `
+4c45474f580000006d000100000000001c000000000000000e000000821b038405018130813e8053
+74617274696e672e2e2e0084006080XX00448581644886488405018130813e80427965210084000a
+`
+export function deployCoreAsync(resp: pxtc.CompileResult, isCli = false) {
+    let w: pxt.editor.Ev3Wrapper
+
+    let filename = resp.downloadFileBaseName || "pxt"
+    filename = filename.replace(/^lego-/, "")
+
+    let fspath = "../prjs/BrkProg_SAVE/"
+
+    let elfPath = fspath + filename + ".elf"
+    let rbfPath = fspath + filename + ".rbf"
+
+    let rbfHex = rbfTemplate
+        .replace(/\s+/g, "")
+        .replace("XX", pxt.U.toHex(pxt.U.stringToUint8Array(elfPath)))
+    let rbfBIN = pxt.U.fromHex(rbfHex)
+    pxt.HF2.write16(rbfBIN, 4, rbfBIN.length)
+
+    let origElfUF2 = UF2.parseFile(pxt.U.stringToUint8Array(atob(resp.outfiles[pxt.outputName()])))
+
+    let mkFile = (ext: string, data: Uint8Array = null) => {
+        let f = UF2.newBlockFile()
+        f.filename = "Projects/" + filename + ext
+        if (data)
+            UF2.writeBytes(f, 0, data)
+        return f
+    }
+
+    let elfUF2 = mkFile(".elf")
+    for (let b of origElfUF2) {
+        UF2.writeBytes(elfUF2, b.targetAddr, b.data)
+    }
+
+    let r = UF2.concatFiles([elfUF2, mkFile(".rbf", rbfBIN)])
+    let data = UF2.serializeFile(r)
+
+    resp.outfiles[pxtc.BINARY_UF2] = btoa(data)
+
+    let saveUF2Async = () => {
+        if (isCli || !pxt.commands.saveOnlyAsync) {
+            return Promise.resolve()
+        } else {
+            return pxt.commands.saveOnlyAsync(resp)
+        }
+    }
+
+    if (noHID) return saveUF2Async()
+
+    return initAsync()
+        .then(w_ => {
+            w = w_
+            if (w.isStreaming)
+                pxt.U.userError("please stop the program first")
+            return w.stopAsync()
+        })
+        .then(() => w.rmAsync(elfPath))
+        .then(() => w.flashAsync(elfPath, UF2.readBytes(origElfUF2, 0, origElfUF2.length * 256)))
+        .then(() => w.flashAsync(rbfPath, rbfBIN))
+        .then(() => w.runAsync(rbfPath))
+        .then(() => {
+            if (isCli)
+                return w.disconnectAsync()
+            else
+                return Promise.resolve()
+            //return Promise.delay(1000).then(() => w.dmesgAsync())
+        }).catch(e => {
+            // if we failed to initalize, retry
+            if (noHID)
+                return saveUF2Async()
+            else
+                return Promise.reject(e)
+        })
+}

editor/extension.ts

@@ -1,152 +1,234 @@
-/// <reference path="../node_modules/pxt-core/built/pxteditor.d.ts" />
+/// <reference path="../node_modules/pxt-core/built/pxteditor.d.ts"/>
+/// <reference path="../node_modules/pxt-core/built/pxtsim.d.ts"/>
+
+import { deployCoreAsync, initAsync } from "./deploy";
+import { FieldPorts } from "./field_ports";
+import { FieldImages } from "./field_images";
+import { FieldSpeed } from "./field_speed";
+import { FieldBrickButtons } from "./field_brickbuttons";
+import { FieldTurnRatio } from "./field_turnratio";
+
+pxt.editor.initExtensionsAsync = function (opts: pxt.editor.ExtensionOptions): Promise<pxt.editor.ExtensionResult> {
+    pxt.debug('loading pxt-ev3 target extensions...')
+    updateBlocklyShape();
+    const res: pxt.editor.ExtensionResult = {
+        fieldEditors: [{
+            selector: "ports",
+            editor: FieldPorts
+        }, {
+            selector: "images",
+            editor: FieldImages
+        }, {
+            selector: "speed",
+            editor: FieldSpeed
+        }, {
+            selector: "brickbuttons",
+            editor: FieldBrickButtons
+        }, {
+            selector: "turnratio",
+            editor: FieldTurnRatio
+        }],
+        deployCoreAsync,
+        showUploadInstructionsAsync: (fn: string, url: string, confirmAsync: (options: any) => Promise<number>) => {
+            let resolve: (thenableOrResult?: void | PromiseLike<void>) => void;
+            let reject: (error: any) => void;
+            const deferred = new Promise<void>((res, rej) => {
+                resolve = res;
+                reject = rej;
+            });
+            const boardName = pxt.appTarget.appTheme.boardName || "???";
+            const boardDriveName = pxt.appTarget.appTheme.driveDisplayName || pxt.appTarget.compile.driveName || "???";
+
+            // https://msdn.microsoft.com/en-us/library/cc848897.aspx
+            // "For security reasons, data URIs are restricted to downloaded resources. 
+            // Data URIs cannot be used for navigation, for scripting, or to populate frame or iframe elements"
+            const downloadAgain = !pxt.BrowserUtils.isIE() && !pxt.BrowserUtils.isEdge();
+            const docUrl = pxt.appTarget.appTheme.usbDocs;
+            const saveAs = pxt.BrowserUtils.hasSaveAs();
+
+            const htmlBody = `
+            <div class="ui three column grid stackable">
+                <div class="column">
+                    <div class="ui">
+                        <div class="image">
+                            <img class="ui medium rounded image" src="./static/download/connect.svg" style="height:109px;width:261px;margin-bottom:1rem;">
+                        </div>
+                        <div class="content">
+                            <div class="description">
+                                <span class="ui yellow circular label">1</span>
+                                <strong>${lf("Connect EV3 to computer with USB cable")}</strong>
+                                <br/>
+                                ${lf("Use the miniUSB port on top of EV3 brick")}
+                            </div>
+                        </div>
+                    </div>
+                </div>
+                <div class="column">
+                    <div class="ui">
+                        <div class="image">
+                            <img class="ui medium rounded image" src="./static/download/firmware.svg" style="height:109px;width:261px;margin-bottom:1rem;">
+                        </div>
+                        <div class="content">
+                            <div class="description">
+                                <span class="ui blue circular label">2</span>
+                                <strong>${lf("Make sure you have the latest EV3 firmware")}</strong>
+                                <br/>
+                                <a href="" target="_blank">${lf("Click here to update to latest firmware")}</a>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+                <div class="column">
+                    <div class="ui">
+                        <div class="image">
+                            <img class="ui medium rounded image" src="./static/download/transfer.svg" style="height:109px;width:261px;margin-bottom:1rem;">
+                        </div>
+                        <div class="content">
+                            <div class="description">
+                                <span class="ui blue circular label">3</span>
+                                ${lf("Move the .uf2 file to EV3 brick")}
+                                <br/>
+                                ${lf("Locate the downloaded .uf2 file and drag it to the EV3 drive")}
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>`;
+
+            return confirmAsync({
+                header: lf("Download to your EV3"),
+                htmlBody,
+                hasCloseIcon: true,
+                hideCancel: true,
+                hideAgree: false,
+                agreeLbl: lf("I got it"),
+                buttons: [downloadAgain ? {
+                    label: fn,
+                    icon: "download",
+                    class: "lightgrey focused",
+                    url,
+                    fileName: fn
+                } : undefined, docUrl ? {
+                    label: lf("Help"),
+                    icon: "help",
+                    class: "lightgrey",
+                    url: docUrl
+                } : undefined]
+                //timeout: 20000
+            }).then(() => { });
+        }
+    };
+    initAsync().catch(e => {
+        // probably no HID - we'll try this again upon deployment
+    })
+    return Promise.resolve<pxt.editor.ExtensionResult>(res);
+}
+
+/**
+ * Update the shape of Blockly blocks with square corners
+ */
+function updateBlocklyShape() {
+
+    /**
+     * Rounded corner radius.
+     * @const
+     */
+    (Blockly.BlockSvg as any).CORNER_RADIUS = 0 * (Blockly.BlockSvg as any).GRID_UNIT;
+
+    /**
+     * Inner space between edge of statement input and notch.
+     * @const
+     */
+    (Blockly.BlockSvg as any).STATEMENT_INPUT_INNER_SPACE = 3 * (Blockly.BlockSvg as any).GRID_UNIT;
+    /**
+     * SVG path for drawing next/previous notch from left to right.
+     * @const
+     */
+    (Blockly.BlockSvg as any).NOTCH_PATH_LEFT = (
+        'l 8,8 ' +
+        'h 16 ' +
+        'l 8,-8 '
+    );
+
+    /**
+     * SVG path for drawing next/previous notch from right to left.
+     * @const
+     */
+    (Blockly.BlockSvg as any).NOTCH_PATH_RIGHT = (
+        'l -8,8 ' +
+        'h -16 ' +
+        'l -8,-8 '
+    );
+
+    /**
+     * SVG start point for drawing the top-left corner.
+     * @const
+     */
+    (Blockly.BlockSvg as any).TOP_LEFT_CORNER_START =
+        'm 0,' + 0;
+
+    /**
+     * SVG path for drawing the rounded top-left corner.
+     * @const
+     */
+    (Blockly.BlockSvg as any).TOP_LEFT_CORNER =
+        'l ' + (Blockly.BlockSvg as any).CORNER_RADIUS + ',0 ';
+
+    /**
+     * SVG path for drawing the rounded top-right corner.
+     * @const
+     */
+    (Blockly.BlockSvg as any).TOP_RIGHT_CORNER =
+        'l ' + 0 + ',' + (Blockly.BlockSvg as any).CORNER_RADIUS;
+
+    /**
+     * SVG path for drawing the rounded bottom-right corner.
+     * @const
+     */
+    (Blockly.BlockSvg as any).BOTTOM_RIGHT_CORNER =
+        'l 0,' + (Blockly.BlockSvg as any).CORNER_RADIUS;
+
+    /**
+     * SVG path for drawing the rounded bottom-left corner.
+     * @const
+     */
+    (Blockly.BlockSvg as any).BOTTOM_LEFT_CORNER =
+        'l -' + (Blockly.BlockSvg as any).CORNER_RADIUS + ',0';
+
+    /**
+     * SVG path for drawing the top-left corner of a statement input.
+     * @const
+     */
+    (Blockly.BlockSvg as any).INNER_TOP_LEFT_CORNER =
+        'l ' + (Blockly.BlockSvg as any).CORNER_RADIUS + ',-' + 0;
+
+    /**
+     * SVG path for drawing the bottom-left corner of a statement input.
+     * Includes the rounded inside corner.
+     * @const
+     */
+    (Blockly.BlockSvg as any).INNER_BOTTOM_LEFT_CORNER =
+        'l ' + 0 + ',' + (Blockly.BlockSvg as any).CORNER_RADIUS * 2 +
+        'l ' + (Blockly.BlockSvg as any).CORNER_RADIUS + ',' + 0;
+
+    /**
+     * Corner radius of the flyout background.
+     * @type {number}
+     * @const
+     */
+    (Blockly as any).Flyout.prototype.CORNER_RADIUS = 0;
+
+    /**
+     * Margin around the edges of the blocks in the flyout.
+     * @type {number}
+     * @const
+     */
+    (Blockly as any).Flyout.prototype.MARGIN = 8;
+
+}
 
 // When require()d from node, bind the global pxt namespace
-namespace pxt {
+// namespace pxt {
-    export const dummyExport = 1;
+//     export const dummyExport = 1;
-}
+// }
-eval("if (typeof process === 'object' && process + '' === '[object process]') pxt = global.pxt")
+// eval("if (typeof process === 'object' && process + '' === '[object process]') pxt = global.pxt")
-
-namespace pxt.editor {
-    import UF2 = pxtc.UF2;
-
-    export let ev3: Ev3Wrapper
-
-    export function debug() {
-        return initAsync()
-            .then(w => w.downloadFileAsync("/tmp/dmesg.txt", v => console.log(pxt.Util.uint8ArrayToString(v))))
-    }
-
-    // this comes from aux/pxt.lms
-    const rbfTemplate = `
-4c45474f580000006d000100000000001c000000000000000e000000821b038405018130813e8053
-74617274696e672e2e2e0084006080XX00448581644886488405018130813e80427965210084000a
-`
-
-    function hf2Async() {
-        return pxt.HF2.mkPacketIOAsync()
-            .then(h => {
-                let w = new Ev3Wrapper(h)
-                ev3 = w
-                return w.reconnectAsync(true)
-                    .then(() => w)
-            })
-    }
-
-    let noHID = false
-
-    let initPromise: Promise<Ev3Wrapper>
-    function initAsync() {
-        if (initPromise)
-            return initPromise
-
-        let canHID = false
-        if (U.isNodeJS) {
-            canHID = true
-        } else {
-            const forceHexDownload = /forceHexDownload/i.test(window.location.href);
-            if (Cloud.isLocalHost() && Cloud.localToken && !forceHexDownload)
-                canHID = true
-        }
-
-        if (noHID)
-            canHID = false
-
-        if (canHID) {
-            initPromise = hf2Async()
-                .catch(err => {
-                    initPromise = null
-                    noHID = true
-                    return Promise.reject(err)
-                })
-        } else {
-            noHID = true
-            initPromise = Promise.reject(new Error("no HID"))
-        }
-
-        return initPromise
-    }
-
-    export function deployCoreAsync(resp: pxtc.CompileResult, isCli = false) {
-        let w: Ev3Wrapper
-
-        let filename = resp.downloadFileBaseName || "pxt"
-        filename = filename.replace(/^lego-/, "")
-
-        let fspath = "../prjs/BrkProg_SAVE/"
-
-        let elfPath = fspath + filename + ".elf"
-        let rbfPath = fspath + filename + ".rbf"
-
-        let rbfHex = rbfTemplate
-            .replace(/\s+/g, "")
-            .replace("XX", U.toHex(U.stringToUint8Array(elfPath)))
-        let rbfBIN = U.fromHex(rbfHex)
-        HF2.write16(rbfBIN, 4, rbfBIN.length)
-
-        let origElfUF2 = UF2.parseFile(U.stringToUint8Array(atob(resp.outfiles[pxt.outputName()])))
-
-        let mkFile = (ext: string, data: Uint8Array = null) => {
-            let f = UF2.newBlockFile()
-            f.filename = "Projects/" + filename + ext
-            if (data)
-                UF2.writeBytes(f, 0, data)
-            return f
-        }
-
-        let elfUF2 = mkFile(".elf")
-        for (let b of origElfUF2) {
-            UF2.writeBytes(elfUF2, b.targetAddr, b.data)
-        }
-
-        let r = UF2.concatFiles([elfUF2, mkFile(".rbf", rbfBIN)])
-        let data = UF2.serializeFile(r)
-
-        resp.outfiles[pxtc.BINARY_UF2] = btoa(data)
-
-        let saveUF2Async = () => {
-            if (isCli || !pxt.commands.saveOnlyAsync) {
-                return Promise.resolve()
-            } else {
-                return pxt.commands.saveOnlyAsync(resp)
-            }
-        }
-
-        if (noHID) return saveUF2Async()
-
-        return initAsync()
-            .then(w_ => {
-                w = w_
-                if (w.isStreaming)
-                    U.userError("please stop the program first")
-                return w.stopAsync()
-            })
-            .then(() => w.rmAsync(elfPath))
-            .then(() => w.flashAsync(elfPath, UF2.readBytes(origElfUF2, 0, origElfUF2.length * 256)))
-            .then(() => w.flashAsync(rbfPath, rbfBIN))
-            .then(() => w.runAsync(rbfPath))
-            .then(() => {
-                if (isCli)
-                    return w.disconnectAsync()
-                else
-                    return Promise.resolve()
-                //return Promise.delay(1000).then(() => w.dmesgAsync())
-            }).catch(e => {
-                // if we failed to initalize, retry
-                if (noHID)
-                    return saveUF2Async()
-                else
-                    return Promise.reject(e)
-            })
-    }
-
-    initExtensionsAsync = function (opts: pxt.editor.ExtensionOptions): Promise<pxt.editor.ExtensionResult> {
-        pxt.debug('loading pxt-ev3 target extensions...')
-        const res: pxt.editor.ExtensionResult = {
-            deployCoreAsync,
-        };
-        initAsync().catch(e => {
-            // probably no HID - we'll try this again upon deployment
-        })
-        return Promise.resolve<pxt.editor.ExtensionResult>(res);
-    }
-}

editor/field_brickbuttons.ts

@@ -0,0 +1,159 @@
+/// <reference path="../node_modules/pxt-core/localtypings/blockly.d.ts"/>
+/// <reference path="../node_modules/pxt-core/built/pxtsim.d.ts"/>
+
+export interface FieldPortsOptions extends Blockly.FieldCustomDropdownOptions {
+    columns?: string;
+    width?: string;
+}
+
+export class FieldBrickButtons extends Blockly.FieldDropdown implements Blockly.FieldCustom {
+    public isFieldCustom_ = true;
+
+    // Width in pixels
+    private width_: number;
+
+    // Columns in grid
+    private columns_: number;
+
+    private savedPrimary_: string;
+
+    constructor(text: string, options: FieldPortsOptions, validator?: Function) {
+        super(options.data);
+
+        this.columns_ = parseInt(options.columns) || 4;
+        this.width_ = parseInt(options.width) || 150;
+    }
+
+    /**
+     * Create a dropdown menu under the text.
+     * @private
+     */
+    public showEditor_() {
+        // If there is an existing drop-down we own, this is a request to hide the drop-down.
+        if (Blockly.DropDownDiv.hideIfOwner(this)) {
+            return;
+        }
+        // If there is an existing drop-down someone else owns, hide it immediately and clear it.
+        Blockly.DropDownDiv.hideWithoutAnimation();
+        Blockly.DropDownDiv.clearContent();
+        // Populate the drop-down with the icons for this field.
+        let dropdownDiv = Blockly.DropDownDiv.getContentDiv();
+        let contentDiv = document.createElement('div');
+        // Accessibility properties
+        contentDiv.setAttribute('role', 'menu');
+        contentDiv.setAttribute('aria-haspopup', 'true');
+
+        const buttonsSVG = document.createElementNS("http://www.w3.org/2000/svg", "svg") as SVGGElement;
+        pxsim.svg.hydrate(buttonsSVG, {
+            viewBox: "0 0 256.68237 256.68237",
+            width: this.width_,
+            height: this.width_
+        });
+        contentDiv.appendChild(buttonsSVG);
+
+        const gWrapper = pxsim.svg.child(buttonsSVG, 'g', { 'transform': 'translate(-4.695057,58.29823)' });
+        const gInnerWrapper = pxsim.svg.child(gWrapper, 'g', { 'transform': 'translate(3.9780427e-6,-32.677281)' });
+
+        const back = pxsim.svg.child(gInnerWrapper, 'path', {
+            style: 'fill:#6a6a6a;stroke-width:3.91719985',
+            d: 'M 106.30882,198.38022 C 84.431262,177.26258 50.453467,142.52878 50.453467,142.52878 v -7.12931 H 37.087971 a 32.381533,32.381533 0 1 1 0,-64.763062 H 50.457376 V 63.503186 L 105.71731,7.0563355 h 55.25604 c 25.02699,25.5048885 55.25994,55.2599395 55.25994,55.2599395 v 8.320133 h 12.77398 a 32.381533,32.381533 0 0 1 0,64.763062 h -12.77398 v 7.13323 c -29.43384,30.27603 -54.66454,55.85144 -54.66454,55.85144 z'
+        })
+
+        const buttonLeft = pxsim.svg.child(gInnerWrapper, 'path', {
+            style: 'fill:#a8a9a8;stroke-width:3.91719985',
+            d: 'm 36.492567,78.357208 h 40.69971 V 126.48393 H 36.492567 A 24.063359,24.063359 0 0 1 12.429199,102.42057 v 0 A 24.063359,24.063359 0 0 1 36.492567,78.357208 Z'
+        })
+
+        const buttonRight = pxsim.svg.child(gInnerWrapper, 'path', {
+            style: 'fill:#a8a9a8;stroke-width:3.91719985',
+            d: 'M 229.00727,126.48784 H 188.30756 V 78.361126 h 40.69971 a 24.063359,24.063359 0 0 1 24.06335,24.063354 v 0 a 24.063359,24.063359 0 0 1 -24.06335,24.06336 z'
+        })
+
+        const buttonEnter = pxsim.svg.child(gInnerWrapper, 'path', {
+            style: 'fill:#3c3c3c;stroke-width:3.91719985',
+            d: 'm 109.27806,78.357208 h 46.9398 a 1.782326,1.782326 0 0 1 1.78233,1.782326 V 124.7016 a 1.782326,1.782326 0 0 1 -1.78233,1.78233 h -46.9398 a 1.782326,1.782326 0 0 1 -1.78233,-1.78233 V 80.139534 a 1.782326,1.782326 0 0 1 1.78233,-1.782326 z'
+        })
+
+        const buttonTop = pxsim.svg.child(gInnerWrapper, 'path', {
+            style: 'fill:#a8a9a8;stroke-width:3.91719985',
+            d: 'm 108.09114,15.967966 49.90905,-0.59542 37.43276,38.619675 -15.44943,15.449437 V 97.367379 H 165.7249 V 81.306861 A 11.978797,11.978797 0 0 0 153.84012,69.422075 c -11.59883,-0.184102 -43.37516,0 -43.37516,0 A 9.6676495,9.6676495 0 0 0 100.36251,79.520618 V 97.347793 H 86.103905 V 69.422075 L 70.654464,53.97264 Z'
+        })
+
+        const buttonBottom = pxsim.svg.child(gInnerWrapper, 'path', {
+            style: 'fill:#a8a9a8;stroke-width:3.91719985',
+            d: 'M 157.78865,189.01028 108.18908,189.38233 70.654464,150.794 86.323259,135.4895 v -28.08625 h 14.101921 v 16.11144 a 12.006218,12.006218 0 0 0 11.85346,11.9788 c 11.59882,0.1841 43.13227,0 43.13227,0 a 10.18472,10.18472 0 0 0 10.38059,-10.38058 v -17.70966 h 14.39179 v 28.08632 l 15.3045,15.3045 z'
+        })
+
+        const buttons = [buttonEnter, buttonLeft, buttonRight, buttonTop, buttonBottom];
+        const options = this.getOptions();
+        for (let i = 0, option: any; option = options[i]; i++) {
+            let content = (options[i] as any)[0]; // Human-readable text or image.
+            const value = (options[i] as any)[1]; // Language-neutral value.
+            const button = buttons[i];
+            button.setAttribute('id', ':' + i); // For aria-activedescendant
+            button.setAttribute('role', 'menuitem');
+            button.setAttribute('cursor', 'pointer');
+            const title = pxsim.svg.child(button, 'title');
+            title.textContent = content;
+
+            Blockly.bindEvent_(button, 'click', this, this.buttonClick_);
+            Blockly.bindEvent_(button, 'mouseup', this, this.buttonClick_);
+            // These are applied manually instead of using the :hover pseudoclass
+            // because Android has a bad long press "helper" menu and green highlight
+            // that we must prevent with ontouchstart preventDefault
+            Blockly.bindEvent_(button, 'mousedown', button, function (e) {
+                this.setAttribute('stroke', '#ffffff');
+                e.preventDefault();
+            });
+            Blockly.bindEvent_(button, 'mouseover', button, function () {
+                this.setAttribute('stroke', '#ffffff');
+            });
+            Blockly.bindEvent_(button, 'mouseout', button, function () {
+                this.setAttribute('stroke', 'transparent');
+            });
+
+            button.setAttribute('data-value', value);
+        }
+
+        contentDiv.style.width = this.width_ + 'px';
+        dropdownDiv.appendChild(contentDiv);
+
+        Blockly.DropDownDiv.setColour('#ffffff', '#dddddd');
+
+        // Calculate positioning based on the field position.
+        var scale = this.sourceBlock_.workspace.scale;
+        var bBox = { width: this.size_.width, height: this.size_.height };
+        bBox.width *= scale;
+        bBox.height *= scale;
+        var position = this.fieldGroup_.getBoundingClientRect();
+        var primaryX = position.left + bBox.width / 2;
+        var primaryY = position.top + bBox.height;
+        var secondaryX = primaryX;
+        var secondaryY = position.top;
+        // Set bounds to workspace; show the drop-down.
+        (Blockly.DropDownDiv as any).setBoundsElement(this.sourceBlock_.workspace.getParentSvg().parentNode);
+        (Blockly.DropDownDiv as any).show(this, primaryX, primaryY, secondaryX, secondaryY,
+            this.onHide_.bind(this));
+    }
+
+    /**
+     * Callback for when a button is clicked inside the drop-down.
+     * Should be bound to the FieldIconMenu.
+     * @param {Event} e DOM event for the click/touch
+     * @private
+     */
+    private buttonClick_ = function (e: any) {
+        let value = e.target.getAttribute('data-value');
+        this.setValue(value);
+        Blockly.DropDownDiv.hide();
+    };
+
+    /**
+     * Callback for when the drop-down is hidden.
+     */
+    private onHide_ = function () {
+        Blockly.DropDownDiv.content_.removeAttribute('role');
+        Blockly.DropDownDiv.content_.removeAttribute('aria-haspopup');
+        Blockly.DropDownDiv.content_.removeAttribute('aria-activedescendant');
+    };
+}

editor/field_images.ts

@@ -0,0 +1,114 @@
+/// <reference path="../node_modules/pxt-core/localtypings/blockly.d.ts"/>
+/// <reference path="../node_modules/pxt-core/built/pxtblocks.d.ts"/>
+/// <reference path="../node_modules/pxt-core/built/pxtsim.d.ts"/>
+
+export interface FieldImagesOptions extends pxtblockly.FieldImageDropdownOptions {
+}
+
+export class FieldImages extends pxtblockly.FieldImageDropdown implements Blockly.FieldCustom {
+    public isFieldCustom_ = true;
+
+    constructor(text: string, options: FieldImagesOptions, validator?: Function) {
+        super(text, options, validator);
+    }
+
+    /**
+     * Create a dropdown menu under the text.
+     * @private
+     */
+    public showEditor_() {
+        // If there is an existing drop-down we own, this is a request to hide the drop-down.
+        if (Blockly.DropDownDiv.hideIfOwner(this)) {
+            return;
+        }
+        // If there is an existing drop-down someone else owns, hide it immediately and clear it.
+        Blockly.DropDownDiv.hideWithoutAnimation();
+        Blockly.DropDownDiv.clearContent();
+        // Populate the drop-down with the icons for this field.
+        let dropdownDiv = Blockly.DropDownDiv.getContentDiv();
+        let contentDiv = document.createElement('div');
+        // Accessibility properties
+        contentDiv.setAttribute('role', 'menu');
+        contentDiv.setAttribute('aria-haspopup', 'true');
+        const options = this.getOptions();
+        for (let i = 0, option: any; option = options[i]; i++) {
+            let content = (options[i] as any)[0]; // Human-readable text or image.
+            const value = (options[i] as any)[1]; // Language-neutral value.
+            // Icons with the type property placeholder take up space but don't have any functionality
+            // Use for special-case layouts
+            if (content.type == 'placeholder') {
+                let placeholder = document.createElement('span');
+                placeholder.setAttribute('class', 'blocklyDropDownPlaceholder');
+                placeholder.style.width = content.width + 'px';
+                placeholder.style.height = content.height + 'px';
+                contentDiv.appendChild(placeholder);
+                continue;
+            }
+            let button = document.createElement('button');
+            button.setAttribute('id', ':' + i); // For aria-activedescendant
+            button.setAttribute('role', 'menuitem');
+            button.setAttribute('class', 'blocklyDropDownButton');
+            button.title = content.alt;
+            if ((this as any).columns_) {
+                button.style.width = (((this as any).width_ / (this as any).columns_) - 8) + 'px';
+                //button.style.height = ((this.width_ / this.columns_) - 8) + 'px';
+            } else {
+                button.style.width = content.width + 'px';
+                button.style.height = content.height + 'px';
+            }
+            let backgroundColor = this.sourceBlock_.getColour();
+            if (value == this.getValue()) {
+                // This icon is selected, show it in a different colour
+                backgroundColor = this.sourceBlock_.getColourTertiary();
+                button.setAttribute('aria-selected', 'true');
+            }
+            button.style.backgroundColor = backgroundColor;
+            button.style.borderColor = this.sourceBlock_.getColourTertiary();
+            Blockly.bindEvent_(button, 'click', this, (this as any).buttonClick_);
+            Blockly.bindEvent_(button, 'mouseup', this, (this as any).buttonClick_);
+            // These are applied manually instead of using the :hover pseudoclass
+            // because Android has a bad long press "helper" menu and green highlight
+            // that we must prevent with ontouchstart preventDefault
+            Blockly.bindEvent_(button, 'mousedown', button, function (e) {
+                this.setAttribute('class', 'blocklyDropDownButton blocklyDropDownButtonHover');
+                e.preventDefault();
+            });
+            Blockly.bindEvent_(button, 'mouseover', button, function () {
+                this.setAttribute('class', 'blocklyDropDownButton blocklyDropDownButtonHover');
+                contentDiv.setAttribute('aria-activedescendant', this.id);
+            });
+            Blockly.bindEvent_(button, 'mouseout', button, function () {
+                this.setAttribute('class', 'blocklyDropDownButton');
+                contentDiv.removeAttribute('aria-activedescendant');
+            });
+            let buttonImg = document.createElement('img');
+            buttonImg.src = content.src;
+            //buttonImg.alt = icon.alt;
+            // Upon click/touch, we will be able to get the clicked element as e.target
+            // Store a data attribute on all possible click targets so we can match it to the icon.
+            button.setAttribute('data-value', value);
+            buttonImg.setAttribute('data-value', value);
+            button.appendChild(buttonImg);
+            contentDiv.appendChild(button);
+        }
+        contentDiv.style.width = (this as any).width_ + 'px';
+        dropdownDiv.appendChild(contentDiv);
+
+        Blockly.DropDownDiv.setColour(this.sourceBlock_.getColour(), this.sourceBlock_.getColourTertiary());
+
+        // Calculate positioning based on the field position.
+        var scale = this.sourceBlock_.workspace.scale;
+        var bBox = { width: this.size_.width, height: this.size_.height };
+        bBox.width *= scale;
+        bBox.height *= scale;
+        var position = this.fieldGroup_.getBoundingClientRect();
+        var primaryX = position.left + bBox.width / 2;
+        var primaryY = position.top + bBox.height;
+        var secondaryX = primaryX;
+        var secondaryY = position.top;
+        // Set bounds to workspace; show the drop-down.
+        (Blockly.DropDownDiv as any).setBoundsElement(this.sourceBlock_.workspace.getParentSvg().parentNode);
+        (Blockly.DropDownDiv as any).show(this, primaryX, primaryY, secondaryX, secondaryY,
+            (this as any).onHide_.bind(this));
+    }
+}

editor/field_ports.ts

@@ -0,0 +1,151 @@
+/// <reference path="../node_modules/pxt-core/localtypings/blockly.d.ts"/>
+/// <reference path="../node_modules/pxt-core/built/pxtsim.d.ts"/>
+
+export interface FieldPortsOptions extends Blockly.FieldCustomDropdownOptions {
+    columns?: string;
+    width?: string;
+}
+
+export class FieldPorts extends Blockly.FieldDropdown implements Blockly.FieldCustom {
+    public isFieldCustom_ = true;
+
+    // Width in pixels
+    private width_: number;
+
+    // Columns in grid
+    private columns_: number;
+
+    private savedPrimary_: string;
+
+    constructor(text: string, options: FieldPortsOptions, validator?: Function) {
+        super(options.data);
+
+        this.columns_ = parseInt(options.columns) || 4;
+        this.width_ = parseInt(options.width) || 300;
+    }
+
+    trimOptions_() {
+    }
+
+    /**
+     * Create a dropdown menu under the text.
+     * @private
+     */
+    public showEditor_() {
+        // If there is an existing drop-down we own, this is a request to hide the drop-down.
+        if (Blockly.DropDownDiv.hideIfOwner(this)) {
+            return;
+        }
+        // If there is an existing drop-down someone else owns, hide it immediately and clear it.
+        Blockly.DropDownDiv.hideWithoutAnimation();
+        Blockly.DropDownDiv.clearContent();
+        // Populate the drop-down with the icons for this field.
+        let dropdownDiv = Blockly.DropDownDiv.getContentDiv();
+        let contentDiv = document.createElement('div');
+        // Accessibility properties
+        contentDiv.setAttribute('role', 'menu');
+        contentDiv.setAttribute('aria-haspopup', 'true');
+        let options = this.getOptions();
+        options = options.sort();
+        for (let i = 0, option: any; option = options[i]; i++) {
+            let content = (options[i] as any)[0]; // Human-readable text or image.
+            const value = (options[i] as any)[1]; // Language-neutral value.
+            // Icons with the type property placeholder take up space but don't have any functionality
+            // Use for special-case layouts
+            if (content.type == 'placeholder') {
+                let placeholder = document.createElement('span');
+                placeholder.setAttribute('class', 'blocklyDropDownPlaceholder');
+                placeholder.style.width = content.width + 'px';
+                placeholder.style.height = content.height + 'px';
+                contentDiv.appendChild(placeholder);
+                continue;
+            }
+            let button = document.createElement('button');
+            button.setAttribute('id', ':' + i); // For aria-activedescendant
+            button.setAttribute('role', 'menuitem');
+            button.setAttribute('class', 'blocklyDropDownButton');
+            button.title = content.alt;
+            if (this.columns_) {
+                button.style.width = ((this.width_ / this.columns_) - 8) + 'px';
+                button.style.height = ((this.width_ / this.columns_) - 8) + 'px';
+            } else {
+                button.style.width = content.width + 'px';
+                button.style.height = content.height + 'px';
+            }
+            let backgroundColor = this.sourceBlock_.getColour();
+            if (value == this.getValue()) {
+                // This icon is selected, show it in a different colour
+                backgroundColor = this.sourceBlock_.getColourTertiary();
+                button.setAttribute('aria-selected', 'true');
+            }
+            button.style.backgroundColor = backgroundColor;
+            button.style.borderColor = this.sourceBlock_.getColourTertiary();
+            Blockly.bindEvent_(button, 'click', this, this.buttonClick_);
+            Blockly.bindEvent_(button, 'mouseup', this, this.buttonClick_);
+            // These are applied manually instead of using the :hover pseudoclass
+            // because Android has a bad long press "helper" menu and green highlight
+            // that we must prevent with ontouchstart preventDefault
+            Blockly.bindEvent_(button, 'mousedown', button, function (e) {
+                this.setAttribute('class', 'blocklyDropDownButton blocklyDropDownButtonHover');
+                e.preventDefault();
+            });
+            Blockly.bindEvent_(button, 'mouseover', button, function () {
+                this.setAttribute('class', 'blocklyDropDownButton blocklyDropDownButtonHover');
+                contentDiv.setAttribute('aria-activedescendant', this.id);
+            });
+            Blockly.bindEvent_(button, 'mouseout', button, function () {
+                this.setAttribute('class', 'blocklyDropDownButton');
+                contentDiv.removeAttribute('aria-activedescendant');
+            });
+            let buttonImg = document.createElement('img');
+            buttonImg.src = content.src;
+            //buttonImg.alt = icon.alt;
+            // Upon click/touch, we will be able to get the clicked element as e.target
+            // Store a data attribute on all possible click targets so we can match it to the icon.
+            button.setAttribute('data-value', value);
+            buttonImg.setAttribute('data-value', value);
+            button.appendChild(buttonImg);
+            contentDiv.appendChild(button);
+        }
+        contentDiv.style.width = this.width_ + 'px';
+        dropdownDiv.appendChild(contentDiv);
+
+        Blockly.DropDownDiv.setColour(this.sourceBlock_.getColour(), this.sourceBlock_.getColourTertiary());
+
+        // Calculate positioning based on the field position.
+        var scale = this.sourceBlock_.workspace.scale;
+        var bBox = { width: this.size_.width, height: this.size_.height };
+        bBox.width *= scale;
+        bBox.height *= scale;
+        var position = this.fieldGroup_.getBoundingClientRect();
+        var primaryX = position.left + bBox.width / 2;
+        var primaryY = position.top + bBox.height;
+        var secondaryX = primaryX;
+        var secondaryY = position.top;
+        // Set bounds to workspace; show the drop-down.
+        (Blockly.DropDownDiv as any).setBoundsElement(this.sourceBlock_.workspace.getParentSvg().parentNode);
+        (Blockly.DropDownDiv as any).show(this, primaryX, primaryY, secondaryX, secondaryY,
+            this.onHide_.bind(this));
+    }
+
+    /**
+     * Callback for when a button is clicked inside the drop-down.
+     * Should be bound to the FieldIconMenu.
+     * @param {Event} e DOM event for the click/touch
+     * @private
+     */
+    private buttonClick_ = function (e: any) {
+        let value = e.target.getAttribute('data-value');
+        this.setValue(value);
+        Blockly.DropDownDiv.hide();
+    };
+
+    /**
+     * Callback for when the drop-down is hidden.
+     */
+    private onHide_ = function () {
+        Blockly.DropDownDiv.content_.removeAttribute('role');
+        Blockly.DropDownDiv.content_.removeAttribute('aria-haspopup');
+        Blockly.DropDownDiv.content_.removeAttribute('aria-activedescendant');
+    };
+}

editor/field_speed.ts

@@ -0,0 +1,96 @@
+/// <reference path="../node_modules/pxt-core/localtypings/blockly.d.ts"/>
+/// <reference path="../node_modules/pxt-core/built/pxtsim.d.ts"/>
+
+export interface FieldSpeedOptions extends Blockly.FieldCustomOptions {
+    min?: string;
+    max?: string;
+    label?: string;
+}
+
+export class FieldSpeed extends Blockly.FieldSlider implements Blockly.FieldCustom {
+    public isFieldCustom_ = true;
+
+    private params: any;
+
+    private speedSVG: SVGElement;
+    private circleBar: SVGCircleElement;
+    private reporter: SVGTextElement;
+
+    /**
+     * Class for a color wheel field.
+     * @param {number|string} value The initial content of the field.
+     * @param {Function=} opt_validator An optional function that is called
+     *     to validate any constraints on what the user entered.  Takes the new
+     *     text as an argument and returns either the accepted text, a replacement
+     *     text, or null to abort the change.
+     * @extends {Blockly.FieldNumber}
+     * @constructor
+     */
+    constructor(value_: any, params: FieldSpeedOptions, opt_validator?: Function) {
+        super(String(value_), '-100', '100', null, '10', 'Speed', opt_validator);
+        this.params = params;
+        if (this.params['min']) this.min_ = parseFloat(this.params.min);
+        if (this.params['max']) this.max_ = parseFloat(this.params.max);
+        if (this.params['label']) this.labelText_ = this.params.label;
+
+        (this as any).sliderColor_ = '#a8aaa8';
+    }
+
+    createLabelDom_(labelText: string) {
+        var labelContainer = document.createElement('div');
+        this.speedSVG = document.createElementNS("http://www.w3.org/2000/svg", "svg") as SVGGElement;
+        pxsim.svg.hydrate(this.speedSVG, {
+            viewBox: "0 0 200 100"
+        });
+
+        labelContainer.appendChild(this.speedSVG);
+
+        const outerCircle = pxsim.svg.child(this.speedSVG, "circle", {
+            'stroke-dasharray': '565.48', 'stroke-dashoffset': '0',
+            'cx': 100, 'cy': 100, 'r': '90', 'style': `fill:transparent; transition: stroke-dashoffset 0.1s linear;`,
+            'stroke': '#a8aaa8', 'stroke-width': '1rem'
+        }) as SVGCircleElement;
+        this.circleBar = pxsim.svg.child(this.speedSVG, "circle", {
+            'stroke-dasharray': '565.48', 'stroke-dashoffset': '0',
+            'cx': 100, 'cy': 100, 'r': '90', 'style': `fill:transparent; transition: stroke-dashoffset 0.1s linear;`,
+            'stroke': '#f12a21', 'stroke-width': '1rem'
+        }) as SVGCircleElement;
+
+        this.reporter = pxsim.svg.child(this.speedSVG, "text", {
+            'x': 100, 'y': 80,
+            'text-anchor': 'middle', 'alignment-baseline': 'middle',
+            'style': 'font-size: 50px',
+            'class': 'sim-text inverted number'
+        }) as SVGTextElement;
+
+        // labelContainer.setAttribute('class', 'blocklyFieldSliderLabel');
+        var readout = document.createElement('span');
+        readout.setAttribute('class', 'blocklyFieldSliderReadout');
+        // var label = document.createElement('span');
+        // label.setAttribute('class', 'blocklyFieldSliderLabelText');
+        // label.innerHTML = labelText;
+        // labelContainer.appendChild(label);
+        // labelContainer.appendChild(readout);
+        return [labelContainer, readout];
+    };
+
+    setReadout_(readout: Element, value: string) {
+        this.updateSpeed(parseFloat(value));
+        // Update reporter
+        this.reporter.textContent = `${value}%`;
+    }
+
+    private updateSpeed(speed: number) {
+        let sign = this.sign(speed);
+        speed = (Math.abs(speed) / 100 * 50) + 50;
+        if (sign == -1) speed = 50 - speed;
+        let c = Math.PI * (90 * 2);
+        let pct = ((100 - speed) / 100) * c;
+        this.circleBar.setAttribute('stroke-dashoffset', `${pct}`);
+    }
+
+    // A re-implementation of Math.sign (since IE11 doesn't support it)
+    private sign(num: number) {
+        return num ? num < 0 ? -1 : 1 : 0;
+    }
+}

editor/field_turnratio.ts

@@ -0,0 +1,108 @@
+/// <reference path="../node_modules/pxt-core/localtypings/blockly.d.ts"/>
+/// <reference path="../node_modules/pxt-core/built/pxtsim.d.ts"/>
+
+export interface FieldTurnRatioOptions extends Blockly.FieldCustomOptions {
+}
+
+export class FieldTurnRatio extends Blockly.FieldSlider implements Blockly.FieldCustom {
+    public isFieldCustom_ = true;
+
+    private params: any;
+
+    private path_: SVGPathElement;
+    private reporter_: SVGTextElement;
+
+    /**
+     * Class for a color wheel field.
+     * @param {number|string} value The initial content of the field.
+     * @param {Function=} opt_validator An optional function that is called
+     *     to validate any constraints on what the user entered.  Takes the new
+     *     text as an argument and returns either the accepted text, a replacement
+     *     text, or null to abort the change.
+     * @extends {Blockly.FieldNumber}
+     * @constructor
+     */
+    constructor(value_: any, params: FieldTurnRatioOptions, opt_validator?: Function) {
+        super(String(value_), '-100', '100', null, '10', 'TurnRatio', opt_validator);
+        this.params = params;
+        (this as any).sliderColor_ = '#a8aaa8';
+    }
+
+    static HALF = 80;
+    static HANDLE_RADIUS = 30;
+    static RADIUS = FieldTurnRatio.HALF - FieldTurnRatio.HANDLE_RADIUS - 1;
+
+    createLabelDom_(labelText: string) {
+        let labelContainer = document.createElement('div');
+        let svg = Blockly.utils.createSvgElement('svg', {
+            'xmlns': 'http://www.w3.org/2000/svg',
+            'xmlns:html': 'http://www.w3.org/1999/xhtml',
+            'xmlns:xlink': 'http://www.w3.org/1999/xlink',
+            'version': '1.1',
+            'height': (FieldTurnRatio.HALF + FieldTurnRatio.HANDLE_RADIUS + 10) + 'px',
+            'width': (FieldTurnRatio.HALF * 2) + 'px'
+        }, labelContainer);
+        let defs = Blockly.utils.createSvgElement('defs', {}, svg);
+        let marker = Blockly.utils.createSvgElement('marker', {
+            'id': 'head',
+            'orient': "auto",
+            'markerWidth': '2',
+            'markerHeight': '4',
+            'refX': '0.1', 'refY': '1.5'
+        }, defs);
+        let markerPath = Blockly.utils.createSvgElement('path', {
+            'd': 'M0,0 V3 L1.5,1.5 Z',
+            'fill': '#f12a21'
+        }, marker);
+        this.reporter_ = pxsim.svg.child(svg, "text", {
+            'x': FieldTurnRatio.HALF, 'y': 96,
+            'text-anchor': 'middle', 'alignment-baseline': 'middle',
+            'style': 'font-size: 50px',
+            'class': 'sim-text inverted number'
+        }) as SVGTextElement;
+        this.path_ = Blockly.utils.createSvgElement('path', {
+            'x1': FieldTurnRatio.HALF,
+            'y1': FieldTurnRatio.HALF,
+            'marker-end': 'url(#head)',
+            'style': 'fill: none; stroke: #f12a21; stroke-width: 10'
+        }, svg);
+        this.updateGraph_();
+        let readout = document.createElement('span');
+        readout.setAttribute('class', 'blocklyFieldSliderReadout');
+        return [labelContainer, readout];
+    };
+
+    updateGraph_() {
+        if (!this.path_) {
+            return;
+        }
+        let v = goog.math.clamp(parseFloat(this.getText()), -100, 100);
+        if (isNaN(v)) {
+            v = 0;
+        }
+
+        const x = goog.math.clamp(parseFloat(this.getText()), -100, 100) / 100;
+        const theta = x * Math.PI / 2;
+        const cx = FieldTurnRatio.HALF;
+        const cy = FieldTurnRatio.HALF - 14;
+        const gamma = Math.PI - 2 * theta;
+        const r = FieldTurnRatio.RADIUS;
+        const alpha = 0.2 + Math.abs(x) * 0.5;
+        const x1 = 0;
+        const y1 = r * alpha;
+        const y2 = r * Math.sin(Math.PI / 2 - theta);
+        const x2 = r * Math.cos(Math.PI / 2 - theta);
+        const y3 = y2 - r * alpha * Math.cos(2 * theta);
+        const x3 = x2 - r * alpha * Math.sin(2 * theta);
+
+
+        const d = `M ${cx} ${cy} C ${cx} ${cy - y1} ${cx + x3} ${cy - y3} ${cx + x2} ${cy - y2}`;
+        this.path_.setAttribute('d', d);
+
+        this.reporter_.textContent = `${v}`;
+    }
+
+    setReadout_(readout: Element, value: string) {
+        this.updateGraph_();
+    }
+}

editor/tsconfig.json

@@ -1,12 +1,14 @@
 {
     "compilerOptions": {
         "target": "es5",
-        "noImplicitAny": true,
+        "noImplicitAny": false,
         "noImplicitReturns": true,
-        "declaration": true,
+        "module": "commonjs",
-        "out": "../built/editor.js",
+        "outDir": "../built/editor",
         "rootDir": ".",
         "newLine": "LF",
-        "sourceMap": false
+        "sourceMap": false,
+        "allowSyntheticDefaultImports": true,
+        "declaration": true
     }
 }