Compare commits
21 Commits
Author | SHA1 | Date | |
---|---|---|---|
62e4b04931 | |||
17e33cc34f | |||
d4ad150cba | |||
52bfd4e535 | |||
f854dfd9c8 | |||
d905f24f9c | |||
81b8b1b69c | |||
efce4c3698 | |||
b5e4a36e9c | |||
04a60a5b47 | |||
29b28e7f0d | |||
979381eaef | |||
e4370f4e3c | |||
ba707f080d | |||
3816e01f87 | |||
548d215b48 | |||
43da58f214 | |||
f90d052538 | |||
13ff7cd0ec | |||
a3b34518b0 | |||
5a33dc8a81 |
5
.vscode/settings.json
vendored
Normal file
5
.vscode/settings.json
vendored
Normal file
@ -0,0 +1,5 @@
|
|||||||
|
// Place your settings in this file to overwrite default and user settings.
|
||||||
|
{
|
||||||
|
"tslint.enable": true,
|
||||||
|
"tslint.rulesDirectory": "node_modules/tslint-microsoft-contrib"
|
||||||
|
}
|
22
docs/_locales/pl/_theme.json
Normal file
22
docs/_locales/pl/_theme.json
Normal file
@ -0,0 +1,22 @@
|
|||||||
|
{
|
||||||
|
"name": "koduj z micro:bit",
|
||||||
|
"title": "koduj z micro:bit",
|
||||||
|
"docMenu": [
|
||||||
|
{
|
||||||
|
"name": "O nas",
|
||||||
|
"path": "/about"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "Lekcje",
|
||||||
|
"path": "/lessons"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "Instrukcja obsługi",
|
||||||
|
"path": "/reference"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"name": "Urządzenie",
|
||||||
|
"path": "/device"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
7
docs/_locales/pl/docs.md
Normal file
7
docs/_locales/pl/docs.md
Normal file
@ -0,0 +1,7 @@
|
|||||||
|
# Dokumentacja
|
||||||
|
|
||||||
|
Witamy na stronach dokumentacji!
|
||||||
|
|
||||||
|
* Przeglądnij [instrukcje obsługi](/reference)
|
||||||
|
* Dowiedz się więcej o [urządzeniu](/device)
|
||||||
|
* Wystartuj z [lekcjami](/lessons)
|
@ -2,6 +2,7 @@
|
|||||||
|
|
||||||
Welcome to the documentation.
|
Welcome to the documentation.
|
||||||
|
|
||||||
* Browse the [reference](/reference)
|
* Browse the [API reference](/reference)
|
||||||
* Learn more about the [device](/device)
|
* Learn more about the [device](/device)
|
||||||
* Get started with [lessons](/lessons)
|
* Get started with [lessons](/lessons)
|
||||||
|
* Learn about [libraries](/libraries) (possibly using C++)
|
||||||
|
14
docs/libraries.md
Normal file
14
docs/libraries.md
Normal file
@ -0,0 +1,14 @@
|
|||||||
|
# Extensions
|
||||||
|
|
||||||
|
You can publish libraries (also known as packages or extensions)
|
||||||
|
that users can then add to their scripts. These typically
|
||||||
|
provide a driver for a particular hardware device you can connect
|
||||||
|
to a microbit.
|
||||||
|
|
||||||
|
* [Sample C++ extension](https://github.com/Microsoft/pxt-microbit-cppsample)
|
||||||
|
* [Sample TypeScript extension](https://github.com/Microsoft/pxt-microbit/tree/master/libs/i2c-fram)
|
||||||
|
|
||||||
|
## Finding libraries
|
||||||
|
|
||||||
|
## Publishing libraries
|
||||||
|
|
23
docs/microbit-reference.md
Normal file
23
docs/microbit-reference.md
Normal file
@ -0,0 +1,23 @@
|
|||||||
|
# microbit Reference
|
||||||
|
|
||||||
|
```namespaces
|
||||||
|
basic.showNumber(0);
|
||||||
|
input.onButtonPressed(Button.A, () => {
|
||||||
|
|
||||||
|
});
|
||||||
|
led.plot(0, 0);
|
||||||
|
music.playTone(0, 0);
|
||||||
|
game.addScore(1);
|
||||||
|
images.createImage(`
|
||||||
|
. . . . .
|
||||||
|
. . . . .
|
||||||
|
. . # . .
|
||||||
|
. . . . .
|
||||||
|
. . . . .
|
||||||
|
`);
|
||||||
|
pins.digitalReadPin(DigitalPin.P0);
|
||||||
|
serial.writeValue(x, 0);
|
||||||
|
control.inBackground(() => {
|
||||||
|
|
||||||
|
});
|
||||||
|
```
|
@ -1,17 +1,27 @@
|
|||||||
# Reference
|
# Reference
|
||||||
|
|
||||||
```namespaces
|
```namespaces
|
||||||
basic.showString("Hello!");
|
|
||||||
input.onButtonPressed(Button.A, () => {});
|
|
||||||
for (let i = 0;i<5;++i) {}
|
for (let i = 0;i<5;++i) {}
|
||||||
if (true){}
|
if (true){}
|
||||||
let x = 0;
|
let x = 0;
|
||||||
Math.random(5);
|
Math.random(5);
|
||||||
|
basic.showNumber(0);
|
||||||
|
input.onButtonPressed(Button.A, () => {
|
||||||
|
|
||||||
|
});
|
||||||
led.plot(0, 0);
|
led.plot(0, 0);
|
||||||
radio.sendNumber(0);
|
music.playTone(0, 0);
|
||||||
music.playTone(music.noteFrequency(Note.C), music.beat(BeatFraction.Whole));
|
game.addScore(1);
|
||||||
game.createSprite(2,2);
|
images.createImage(`
|
||||||
|
. . . . .
|
||||||
|
. . . . .
|
||||||
|
. . # . .
|
||||||
|
. . . . .
|
||||||
|
. . . . .
|
||||||
|
`);
|
||||||
pins.digitalReadPin(DigitalPin.P0);
|
pins.digitalReadPin(DigitalPin.P0);
|
||||||
serial.writeLine("Hello!");
|
serial.writeValue(x, 0);
|
||||||
control.inBackground(() => {});
|
control.inBackground(() => {
|
||||||
```
|
|
||||||
|
});
|
||||||
|
|
||||||
|
@ -2,7 +2,6 @@
|
|||||||
|
|
||||||
Provides access to basic micro:bit functionality.
|
Provides access to basic micro:bit functionality.
|
||||||
|
|
||||||
|
|
||||||
```cards
|
```cards
|
||||||
basic.showNumber(0);
|
basic.showNumber(0);
|
||||||
basic.showLeds(`
|
basic.showLeds(`
|
||||||
|
@ -1,7 +1,6 @@
|
|||||||
# Control
|
# Control
|
||||||
|
|
||||||
|
Runtime and event utilities.
|
||||||
|
|
||||||
|
|
||||||
```cards
|
```cards
|
||||||
control.inBackground(() => {
|
control.inBackground(() => {
|
||||||
|
@ -1,7 +1,6 @@
|
|||||||
# Game
|
# Game
|
||||||
|
|
||||||
|
A single-LED sprite game engine
|
||||||
|
|
||||||
|
|
||||||
```cards
|
```cards
|
||||||
game.addScore(1);
|
game.addScore(1);
|
||||||
|
@ -1,7 +1,6 @@
|
|||||||
# Images
|
# Images
|
||||||
|
|
||||||
|
Creation, manipulation and display of LED images.
|
||||||
|
|
||||||
|
|
||||||
```cards
|
```cards
|
||||||
images.createImage(`
|
images.createImage(`
|
||||||
|
@ -1,7 +1,6 @@
|
|||||||
# Input
|
# Input
|
||||||
|
|
||||||
|
Events and data from sensors
|
||||||
|
|
||||||
|
|
||||||
```cards
|
```cards
|
||||||
input.onButtonPressed(Button.A, () => {
|
input.onButtonPressed(Button.A, () => {
|
||||||
|
@ -1,7 +1,6 @@
|
|||||||
# Led
|
# Led
|
||||||
|
|
||||||
|
Control of the LED screen.
|
||||||
|
|
||||||
|
|
||||||
```cards
|
```cards
|
||||||
led.plot(0, 0);
|
led.plot(0, 0);
|
||||||
@ -10,7 +9,7 @@ led.point(0, 0);
|
|||||||
led.brightness();
|
led.brightness();
|
||||||
led.setBrightness(255);
|
led.setBrightness(255);
|
||||||
led.stopAnimation();
|
led.stopAnimation();
|
||||||
led.plotBarGraph(0, 1023);
|
led.plotBarGraph(0, 0);
|
||||||
led.fadeIn();
|
led.fadeIn();
|
||||||
led.fadeOut();
|
led.fadeOut();
|
||||||
led.plotAll();
|
led.plotAll();
|
||||||
|
@ -1,14 +1,13 @@
|
|||||||
# Music
|
# Music
|
||||||
|
|
||||||
|
Generation of music tones through pin ``P0``.
|
||||||
|
|
||||||
|
|
||||||
```cards
|
```cards
|
||||||
music.playTone(0, 0);
|
music.playTone(0, 0);
|
||||||
music.ringTone(0);
|
music.ringTone(0);
|
||||||
music.rest(0);
|
music.rest(0);
|
||||||
music.noteFrequency(Note.C);
|
music.noteFrequency(Note.C);
|
||||||
music.beat();
|
music.beat(BeatFraction.Whole);
|
||||||
music.tempo();
|
music.tempo();
|
||||||
music.changeTempoBy(20);
|
music.changeTempoBy(20);
|
||||||
music.setTempo(120);
|
music.setTempo(120);
|
||||||
|
@ -1,7 +1,6 @@
|
|||||||
# Pins
|
# Pins
|
||||||
|
|
||||||
|
Control currents in Pins for analog/digital signals, servos, i2c, ...
|
||||||
|
|
||||||
|
|
||||||
```cards
|
```cards
|
||||||
pins.digitalReadPin(DigitalPin.P0);
|
pins.digitalReadPin(DigitalPin.P0);
|
||||||
|
@ -1,7 +1,6 @@
|
|||||||
# Radio
|
# Radio
|
||||||
|
|
||||||
|
Communicate data using radio packets
|
||||||
|
|
||||||
|
|
||||||
```cards
|
```cards
|
||||||
radio.sendNumber(0);
|
radio.sendNumber(0);
|
||||||
|
@ -1,8 +1,8 @@
|
|||||||
# Serial
|
# Serial
|
||||||
|
|
||||||
[Serial communication](/device/serial) between the BBC micro:bit and another computer.
|
Reading and writing data over a serial connection.
|
||||||
|
|
||||||
```cards
|
```cards
|
||||||
|
serial.writeValue(x, 0);
|
||||||
serial.writeLine("");
|
serial.writeLine("");
|
||||||
serial.writeValue("x", 0);
|
|
||||||
```
|
```
|
||||||
|
@ -6,5 +6,4 @@ basic.forever(() => { basic.showString("THANK YOU") })
|
|||||||
|
|
||||||
Thank you for participating in this survey.
|
Thank you for participating in this survey.
|
||||||
|
|
||||||
Please contact Michael Braun at WW PS Edu [v-braum@microsoft.com](mailto:v-braum@microsoft.com)
|
Please [contact us](mailto:microbitpilots@microsoft.com) with any information you think we might find useful.
|
||||||
or Claudine O’Leary at WW PS Edu [clolea@microsoft.com](clolea@microsoft.com) with any information you think we might find useful.
|
|
||||||
|
79
libs/microbit/_locales/microbit-strings.json
Normal file
79
libs/microbit/_locales/microbit-strings.json
Normal file
@ -0,0 +1,79 @@
|
|||||||
|
{
|
||||||
|
"A single-LED sprite game engine": "A single-LED sprite game engine",
|
||||||
|
"Adds points to the current score": "Adds points to the current score",
|
||||||
|
"Attaches code to run when the device is shaken.": "Attaches code to run when the device is shaken.",
|
||||||
|
"Attaches code to run when the logo is oriented downwards and the board is vertical.": "Attaches code to run when the logo is oriented downwards and the board is vertical.",
|
||||||
|
"Attaches code to run when the logo is oriented upwards and the board is vertical.": "Attaches code to run when the logo is oriented upwards and the board is vertical.",
|
||||||
|
"Attaches code to run when the screen is facing down.": "Attaches code to run when the screen is facing down.",
|
||||||
|
"Attaches code to run when the screen is facing up.": "Attaches code to run when the screen is facing up.",
|
||||||
|
"Cancels the current animation and clears other pending animations.": "Cancels the current animation and clears other pending animations.",
|
||||||
|
"Change the tempo by the specified amount": "Change the tempo by the specified amount",
|
||||||
|
"Configures the Pulse-width modulation (PWM) of the analog output to the given value in **microseconds** or `1/1000` milliseconds.\nIf this pin is not configured as an analog output (using `analog write pin`), the operation has no effect.": "Configures the Pulse-width modulation (PWM) of the analog output to the given value in **microseconds** or `1/1000` milliseconds.\nIf this pin is not configured as an analog output (using `analog write pin`), the operation has no effect.",
|
||||||
|
"Configures this IO pin as an analog/pwm output, configures the period to be 20 ms, and sets the pulse width, based on the value it is given **microseconds** or `1/1000` milliseconds.": "Configures this IO pin as an analog/pwm output, configures the period to be 20 ms, and sets the pulse width, based on the value it is given **microseconds** or `1/1000` milliseconds.",
|
||||||
|
"Control currents in Pins for analog/digital signals, servos, i2c, ...": "Control currents in Pins for analog/digital signals, servos, i2c, ...",
|
||||||
|
"Control of the LED screen.": "Control of the LED screen.",
|
||||||
|
"Creates an image that fits on the LED screen.": "Creates an image that fits on the LED screen.",
|
||||||
|
"Creates an image with 2 frames.": "Creates an image with 2 frames.",
|
||||||
|
"Creation, manipulation and display of LED images.": "Creation, manipulation and display of LED images.",
|
||||||
|
"Display text on the display, one character at a time. If the string fits on the screen (i.e. is one letter), does not scroll.": "Display text on the display, one character at a time. If the string fits on the screen (i.e. is one letter), does not scroll.",
|
||||||
|
"Displays a game over animation.": "Displays a game over animation.",
|
||||||
|
"Displays a vertical bar graph based on the `value` and `high` value.\nIf `high` is 0, the chart gets adjusted automatically.": "Displays a vertical bar graph based on the `value` and `high` value.\nIf `high` is 0, the chart gets adjusted automatically.",
|
||||||
|
"Do something when a button (``A``, ``B`` or both ``A+B``) is pressed": "Do something when a button (``A``, ``B`` or both ``A+B``) is pressed",
|
||||||
|
"Do something when a pin(``P0``, ``P1`` or both ``P2``) is pressed.": "Do something when a pin(``P0``, ``P1`` or both ``P2``) is pressed.",
|
||||||
|
"Draws an image on the LED screen.": "Draws an image on the LED screen.",
|
||||||
|
"Emits a Pulse-width modulation (PWM) signal to the current pitch pin. Use `analog set pitch pin` to define the pitch pin.": "Emits a Pulse-width modulation (PWM) signal to the current pitch pin. Use `analog set pitch pin` to define the pitch pin.",
|
||||||
|
"Events and data from sensors": "Events and data from sensors",
|
||||||
|
"Fades in the screen display.": "Fades in the screen display.",
|
||||||
|
"Fades out the screen brightness.": "Fades out the screen brightness.",
|
||||||
|
"Generation of music tones through pin ``P0``.": "Generation of music tones through pin ``P0``.",
|
||||||
|
"Get the acceleration value in milli-gravitys (when the board is laying flat with the screen up, x=0, y=0 and z=-1024)": "Get the acceleration value in milli-gravitys (when the board is laying flat with the screen up, x=0, y=0 and z=-1024)",
|
||||||
|
"Get the button state (pressed or not) for ``A`` and ``B``.": "Get the button state (pressed or not) for ``A`` and ``B``.",
|
||||||
|
"Get the current compass compass heading in degrees.": "Get the current compass compass heading in degrees.",
|
||||||
|
"Get the magnetic force value in ``micro-Teslas`` (``µT``). This function is not supported in the simulator.": "Get the magnetic force value in ``micro-Teslas`` (``µT``). This function is not supported in the simulator.",
|
||||||
|
"Get the on/off state of the specified LED using x, y coordinates. (0,0) is upper left.": "Get the on/off state of the specified LED using x, y coordinates. (0,0) is upper left.",
|
||||||
|
"Get the pin state (pressed or not). Requires to hold the ground to close the circuit.": "Get the pin state (pressed or not). Requires to hold the ground to close the circuit.",
|
||||||
|
"Get the screen brightness from 0 (off) to 255 (full bright).": "Get the screen brightness from 0 (off) to 255 (full bright).",
|
||||||
|
"Gets the current score": "Gets the current score",
|
||||||
|
"Gets the frequency of a note.": "Gets the frequency of a note.",
|
||||||
|
"Gets the number of milliseconds elapsed since power on.": "Gets the number of milliseconds elapsed since power on.",
|
||||||
|
"Gets the temperature in Celsius degrees (°C).": "Gets the temperature in Celsius degrees (°C).",
|
||||||
|
"Inverts the current LED display": "Inverts the current LED display",
|
||||||
|
"Obsolete, compass calibration is automatic.": "Obsolete, compass calibration is automatic.",
|
||||||
|
"Pause for the specified time in milliseconds": "Pause for the specified time in milliseconds",
|
||||||
|
"Plays a tone through pin ``P0`` for the given duration.": "Plays a tone through pin ``P0`` for the given duration.",
|
||||||
|
"Plays a tone through pin ``P0``.": "Plays a tone through pin ``P0``.",
|
||||||
|
"Prints a line of text to the serial": "Prints a line of text to the serial",
|
||||||
|
"Provides access to basic micro:bit functionality.": "Provides access to basic micro:bit functionality.",
|
||||||
|
"Re-maps a number from one range to another. That is, a value of ``from low`` would get mapped to ``to low``, a value of ``from high`` to ``to high``, values in-between to values in-between, etc.": "Re-maps a number from one range to another. That is, a value of ``from low`` would get mapped to ``to low``, a value of ``from high`` to ``to high``, values in-between to values in-between, etc.",
|
||||||
|
"Read the connector value as analog, that is, as a value comprised between 0 and 1023.": "Read the connector value as analog, that is, as a value comprised between 0 and 1023.",
|
||||||
|
"Read the specified pin or connector as either 0 or 1": "Read the specified pin or connector as either 0 or 1",
|
||||||
|
"Reading and writing data over a serial connection.": "Reading and writing data over a serial connection.",
|
||||||
|
"Reads the light level applied to the LED screen in a range from ``0`` (dark) to ``255`` bright.": "Reads the light level applied to the LED screen in a range from ``0`` (dark) to ``255`` bright.",
|
||||||
|
"Repeats the code forever in the background. On each iteration, allows other codes to run.": "Repeats the code forever in the background. On each iteration, allows other codes to run.",
|
||||||
|
"Resets the BBC micro:bit.": "Resets the BBC micro:bit.",
|
||||||
|
"Rests (plays nothing) for a specified time through pin ``P0``.": "Rests (plays nothing) for a specified time through pin ``P0``.",
|
||||||
|
"Returns the duration of a beat in milli-seconds": "Returns the duration of a beat in milli-seconds",
|
||||||
|
"Returns the tempo in beats per minute. Tempo is the speed (bpm = beats per minute) at which notes play. The larger the tempo value, the faster the notes will play.": "Returns the tempo in beats per minute. Tempo is the speed (bpm = beats per minute) at which notes play. The larger the tempo value, the faster the notes will play.",
|
||||||
|
"Runtime and event utilities.": "Runtime and event utilities.",
|
||||||
|
"Schedules code that run in the background.": "Schedules code that run in the background.",
|
||||||
|
"Scroll a number on the screen. If the number fits on the screen (i.e. is a single digit), do not scroll.": "Scroll a number on the screen. If the number fits on the screen (i.e. is a single digit), do not scroll.",
|
||||||
|
"Set a pin or connector value to either 0 or 1.": "Set a pin or connector value to either 0 or 1.",
|
||||||
|
"Set the connector value as analog. Value must be comprised between 0 and 1023.": "Set the connector value as analog. Value must be comprised between 0 and 1023.",
|
||||||
|
"Set the screen brightness from 0 (off) to 255 (full bright).": "Set the screen brightness from 0 (off) to 255 (full bright).",
|
||||||
|
"Sets the accelerometer sample range in gravities.": "Sets the accelerometer sample range in gravities.",
|
||||||
|
"Sets the current score value": "Sets the current score value",
|
||||||
|
"Sets the display mode between black and white and greyscale for rendering LEDs.": "Sets the display mode between black and white and greyscale for rendering LEDs.",
|
||||||
|
"Sets the pin used when using `pins->analog pitch`.": "Sets the pin used when using `pins->analog pitch`.",
|
||||||
|
"Sets the tempo to the specified amount": "Sets the tempo to the specified amount",
|
||||||
|
"Shows a sequence of LED screens as an animation.": "Shows a sequence of LED screens as an animation.",
|
||||||
|
"Starts a game countdown timer": "Starts a game countdown timer",
|
||||||
|
"Takes a screenshot of the LED screen and returns an image.": "Takes a screenshot of the LED screen and returns an image.",
|
||||||
|
"The pitch of the device, rotation along the ``x-axis``, in degrees.": "The pitch of the device, rotation along the ``x-axis``, in degrees.",
|
||||||
|
"Toggles a particular pixel": "Toggles a particular pixel",
|
||||||
|
"Turn off all LEDs": "Turn off all LEDs",
|
||||||
|
"Turn off the specified LED using x, y coordinates (x is horizontal, y is vertical). (0,0) is upper left.": "Turn off the specified LED using x, y coordinates (x is horizontal, y is vertical). (0,0) is upper left.",
|
||||||
|
"Turn on the specified LED using x, y coordinates (x is horizontal, y is vertical). (0,0) is upper left.": "Turn on the specified LED using x, y coordinates (x is horizontal, y is vertical). (0,0) is upper left.",
|
||||||
|
"Turns all LEDS on": "Turns all LEDS on",
|
||||||
|
"Writes a ``name: value`` pair line to the serial.": "Writes a ``name: value`` pair line to the serial.",
|
||||||
|
"Writes a value to the servo, controlling the shaft accordingly. On a standard servo, this will set the angle of the shaft (in degrees), moving the shaft to that orientation. On a continuous rotation servo, this will set the speed of the servo (with ``0`` being full-speed in one direction, ``180`` being full speed in the other, and a value near ``90`` being no movement).": "Writes a value to the servo, controlling the shaft accordingly. On a standard servo, this will set the angle of the shaft (in degrees), moving the shaft to that orientation. On a continuous rotation servo, this will set the speed of the servo (with ``0`` being full-speed in one direction, ``180`` being full speed in the other, and a value near ``90`` being no movement)."
|
||||||
|
}
|
@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "pxt-microbit",
|
"name": "pxt-microbit",
|
||||||
"version": "0.2.97",
|
"version": "0.2.101",
|
||||||
"description": "BBC micro:bit target for PXT",
|
"description": "BBC micro:bit target for PXT",
|
||||||
"keywords": [
|
"keywords": [
|
||||||
"JavaScript",
|
"JavaScript",
|
||||||
@ -29,6 +29,6 @@
|
|||||||
"typescript": "^1.8.7"
|
"typescript": "^1.8.7"
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"pxt-core": "0.2.107"
|
"pxt-core": "0.2.114"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -22,14 +22,12 @@
|
|||||||
"description": "",
|
"description": "",
|
||||||
"files": [
|
"files": [
|
||||||
"main.blocks",
|
"main.blocks",
|
||||||
"main.ts",
|
"main.ts"
|
||||||
"README.md"
|
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
"files": {
|
"files": {
|
||||||
"main.blocks": "<xml xmlns=\"http://www.w3.org/1999/xhtml\"><block type=\"device_print_message\"><value name=\"text\"><shadow type=\"text\"><field name=\"TEXT\">Hello!</field></shadow></value></block></xml>",
|
"main.blocks": "<xml xmlns=\"http://www.w3.org/1999/xhtml\"><block type=\"device_print_message\"><value name=\"text\"><shadow type=\"text\"><field name=\"TEXT\">Hello!</field></shadow></value></block></xml>",
|
||||||
"main.ts": "\n",
|
"main.ts": "\n"
|
||||||
"README.md": "Describe your project here!"
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"tsprj": {
|
"tsprj": {
|
||||||
@ -42,13 +40,11 @@
|
|||||||
},
|
},
|
||||||
"description": "",
|
"description": "",
|
||||||
"files": [
|
"files": [
|
||||||
"main.ts",
|
"main.ts"
|
||||||
"README.md"
|
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
"files": {
|
"files": {
|
||||||
"main.ts": "basic.showString('Hello!')\n",
|
"main.ts": "basic.showString('Hello!')\n"
|
||||||
"README.md": "Describe your project here!"
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"compile": {
|
"compile": {
|
||||||
@ -63,7 +59,8 @@
|
|||||||
"variablesBlocks": true
|
"variablesBlocks": true
|
||||||
},
|
},
|
||||||
"simulator": {
|
"simulator": {
|
||||||
"autoRun": true
|
"autoRun": true,
|
||||||
|
"aspectRatio": 1.22
|
||||||
},
|
},
|
||||||
"compileService": {
|
"compileService": {
|
||||||
"gittag": "v0.1.8",
|
"gittag": "v0.1.8",
|
||||||
|
@ -4,12 +4,12 @@
|
|||||||
|
|
||||||
namespace pxsim {
|
namespace pxsim {
|
||||||
pxsim.initCurrentRuntime = () => {
|
pxsim.initCurrentRuntime = () => {
|
||||||
U.assert(!runtime.board)
|
U.assert(!runtime.board);
|
||||||
runtime.board = new Board()
|
runtime.board = new Board();
|
||||||
}
|
}
|
||||||
|
|
||||||
export function board() {
|
export function board() {
|
||||||
return runtime.board as Board
|
return runtime.board as Board;
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface AnimationOptions {
|
export interface AnimationOptions {
|
||||||
@ -125,9 +125,9 @@ namespace pxsim {
|
|||||||
|
|
||||||
|
|
||||||
export namespace AudioContextManager {
|
export namespace AudioContextManager {
|
||||||
var _context: any; // AudioContext
|
let _context: any; // AudioContext
|
||||||
var _vco: any; //OscillatorNode;
|
let _vco: any; // OscillatorNode;
|
||||||
var _vca: any; // GainNode;
|
let _vca: any; // GainNode;
|
||||||
|
|
||||||
function context(): any {
|
function context(): any {
|
||||||
if (!_context) _context = freshContext();
|
if (!_context) _context = freshContext();
|
||||||
@ -152,7 +152,7 @@ namespace pxsim {
|
|||||||
|
|
||||||
export function tone(frequency: number, gain: number) {
|
export function tone(frequency: number, gain: number) {
|
||||||
if (frequency <= 0) return;
|
if (frequency <= 0) return;
|
||||||
var ctx = context();
|
let ctx = context();
|
||||||
if (!ctx) return;
|
if (!ctx) return;
|
||||||
|
|
||||||
gain = Math.max(0, Math.min(1, gain));
|
gain = Math.max(0, Math.min(1, gain));
|
||||||
@ -198,7 +198,7 @@ namespace pxsim.basic {
|
|||||||
pause(interval * 5);
|
pause(interval * 5);
|
||||||
} else {
|
} else {
|
||||||
if (s.length == 1) showLeds(createImageFromString(s), interval * 5)
|
if (s.length == 1) showLeds(createImageFromString(s), interval * 5)
|
||||||
else ImageMethods.scrollImage(createImageFromString(s + ' '), interval, 1);
|
else ImageMethods.scrollImage(createImageFromString(s + " "), interval, 1);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -231,14 +231,14 @@ namespace pxsim.control {
|
|||||||
let b = board();
|
let b = board();
|
||||||
return b && b.id
|
return b && b.id
|
||||||
? b.id.slice(0, 4)
|
? b.id.slice(0, 4)
|
||||||
: 'abcd';
|
: "abcd";
|
||||||
}
|
}
|
||||||
|
|
||||||
export function deviceSerialNumber(): number {
|
export function deviceSerialNumber(): number {
|
||||||
let b = board();
|
let b = board();
|
||||||
return parseInt(b && b.id
|
return parseInt(b && b.id
|
||||||
? b.id.slice(1)
|
? b.id.slice(1)
|
||||||
: '42');
|
: "42");
|
||||||
}
|
}
|
||||||
|
|
||||||
export function onEvent(id: number, evid: number, handler: RefAction) {
|
export function onEvent(id: number, evid: number, handler: RefAction) {
|
||||||
@ -306,7 +306,7 @@ namespace pxsim.input {
|
|||||||
|
|
||||||
|
|
||||||
export function compassHeading(): number {
|
export function compassHeading(): number {
|
||||||
var b = board();
|
let b = board();
|
||||||
if (!b.usesHeading) {
|
if (!b.usesHeading) {
|
||||||
b.usesHeading = true;
|
b.usesHeading = true;
|
||||||
runtime.queueDisplayUpdate();
|
runtime.queueDisplayUpdate();
|
||||||
@ -315,7 +315,7 @@ namespace pxsim.input {
|
|||||||
}
|
}
|
||||||
|
|
||||||
export function temperature(): number {
|
export function temperature(): number {
|
||||||
var b = board();
|
let b = board();
|
||||||
if (!b.usesTemperature) {
|
if (!b.usesTemperature) {
|
||||||
b.usesTemperature = true;
|
b.usesTemperature = true;
|
||||||
runtime.queueDisplayUpdate();
|
runtime.queueDisplayUpdate();
|
||||||
|
292
sim/simsvg.ts
292
sim/simsvg.ts
@ -1,5 +1,5 @@
|
|||||||
namespace pxsim.micro_bit {
|
namespace pxsim.micro_bit {
|
||||||
const Svg = pxsim.Svg;
|
const svg = pxsim.svg;
|
||||||
|
|
||||||
export interface IBoardTheme {
|
export interface IBoardTheme {
|
||||||
accent?: string;
|
accent?: string;
|
||||||
@ -35,7 +35,8 @@ namespace pxsim.micro_bit {
|
|||||||
virtualButtonUp: "#fff",
|
virtualButtonUp: "#fff",
|
||||||
lightLevelOn: "yellow",
|
lightLevelOn: "yellow",
|
||||||
lightLevelOff: "#555"
|
lightLevelOff: "#555"
|
||||||
}});
|
}
|
||||||
|
});
|
||||||
|
|
||||||
export function randomTheme(): IBoardTheme {
|
export function randomTheme(): IBoardTheme {
|
||||||
return themes[Math.floor(Math.random() * themes.length)];
|
return themes[Math.floor(Math.random() * themes.length)];
|
||||||
@ -59,8 +60,7 @@ namespace pxsim.micro_bit {
|
|||||||
leave: "mouseleave"
|
leave: "mouseleave"
|
||||||
};
|
};
|
||||||
|
|
||||||
export class MicrobitBoardSvg
|
export class MicrobitBoardSvg {
|
||||||
{
|
|
||||||
public element: SVGSVGElement;
|
public element: SVGSVGElement;
|
||||||
private style: SVGStyleElement;
|
private style: SVGStyleElement;
|
||||||
private defs: SVGDefsElement;
|
private defs: SVGDefsElement;
|
||||||
@ -102,20 +102,20 @@ namespace pxsim.micro_bit {
|
|||||||
private updateTheme() {
|
private updateTheme() {
|
||||||
let theme = this.props.theme;
|
let theme = this.props.theme;
|
||||||
|
|
||||||
Svg.fill(this.display, theme.display);
|
svg.fill(this.display, theme.display);
|
||||||
Svg.fills(this.leds, theme.ledOn);
|
svg.fills(this.leds, theme.ledOn);
|
||||||
Svg.fills(this.ledsOuter, theme.ledOff);
|
svg.fills(this.ledsOuter, theme.ledOff);
|
||||||
Svg.fills(this.buttonsOuter.slice(0, 2), theme.buttonOuter);
|
svg.fills(this.buttonsOuter.slice(0, 2), theme.buttonOuter);
|
||||||
Svg.fills(this.buttons.slice(0, 2), theme.buttonUp);
|
svg.fills(this.buttons.slice(0, 2), theme.buttonUp);
|
||||||
Svg.fill(this.buttonsOuter[2], theme.virtualButtonOuter);
|
svg.fill(this.buttonsOuter[2], theme.virtualButtonOuter);
|
||||||
Svg.fill(this.buttons[2], theme.virtualButtonUp);
|
svg.fill(this.buttons[2], theme.virtualButtonUp);
|
||||||
Svg.fills(this.logos, theme.accent);
|
svg.fills(this.logos, theme.accent);
|
||||||
if (this.shakeButton) Svg.fill(this.shakeButton, theme.virtualButtonUp);
|
if (this.shakeButton) svg.fill(this.shakeButton, theme.virtualButtonUp);
|
||||||
|
|
||||||
this.pinGradients.forEach(lg => Svg.setGradientColors(lg, theme.pin, theme.pinActive));
|
this.pinGradients.forEach(lg => svg.setGradientColors(lg, theme.pin, theme.pinActive));
|
||||||
Svg.setGradientColors(this.lightLevelGradient, theme.lightLevelOn, theme.lightLevelOff);
|
svg.setGradientColors(this.lightLevelGradient, theme.lightLevelOn, theme.lightLevelOff);
|
||||||
|
|
||||||
Svg.setGradientColors(this.thermometerGradient, theme.ledOff, theme.ledOn);
|
svg.setGradientColors(this.thermometerGradient, theme.ledOff, theme.ledOn);
|
||||||
}
|
}
|
||||||
|
|
||||||
public updateState() {
|
public updateState() {
|
||||||
@ -124,13 +124,13 @@ namespace pxsim.micro_bit {
|
|||||||
let theme = this.props.theme;
|
let theme = this.props.theme;
|
||||||
|
|
||||||
state.buttons.forEach((btn, index) => {
|
state.buttons.forEach((btn, index) => {
|
||||||
Svg.fill(this.buttons[index], btn.pressed ? theme.buttonDown : theme.buttonUp);
|
svg.fill(this.buttons[index], btn.pressed ? theme.buttonDown : theme.buttonUp);
|
||||||
});
|
});
|
||||||
|
|
||||||
var bw = state.displayMode == pxsim.DisplayMode.bw
|
let bw = state.displayMode == pxsim.DisplayMode.bw
|
||||||
var img = state.image;
|
let img = state.image;
|
||||||
this.leds.forEach((led, i) => {
|
this.leds.forEach((led, i) => {
|
||||||
var sel = (<SVGStylable><any>led)
|
let sel = (<SVGStylable><any>led)
|
||||||
sel.style.opacity = ((bw ? img.data[i] > 0 ? 255 : 0 : img.data[i]) / 255.0) + "";
|
sel.style.opacity = ((bw ? img.data[i] > 0 ? 255 : 0 : img.data[i]) / 255.0) + "";
|
||||||
})
|
})
|
||||||
this.updatePins();
|
this.updatePins();
|
||||||
@ -141,29 +141,29 @@ namespace pxsim.micro_bit {
|
|||||||
this.updateButtonAB();
|
this.updateButtonAB();
|
||||||
this.updateGestures();
|
this.updateGestures();
|
||||||
|
|
||||||
if (!runtime || runtime.dead) Svg.addClass(this.element, "grayscale");
|
if (!runtime || runtime.dead) svg.addClass(this.element, "grayscale");
|
||||||
else Svg.removeClass(this.element, "grayscale");
|
else svg.removeClass(this.element, "grayscale");
|
||||||
}
|
}
|
||||||
|
|
||||||
private updateGestures() {
|
private updateGestures() {
|
||||||
let state = this.board;
|
let state = this.board;
|
||||||
if (state.useShake && !this.shakeButton) {
|
if (state.useShake && !this.shakeButton) {
|
||||||
this.shakeButton = Svg.child(this.g, "circle", {cx:380, cy:100, r:16.5}) as SVGCircleElement;
|
this.shakeButton = svg.child(this.g, "circle", { cx: 380, cy: 100, r: 16.5 }) as SVGCircleElement;
|
||||||
Svg.fill(this.shakeButton, this.props.theme.virtualButtonUp)
|
svg.fill(this.shakeButton, this.props.theme.virtualButtonUp)
|
||||||
this.shakeButton.addEventListener(pointerEvents.down, ev => {
|
this.shakeButton.addEventListener(pointerEvents.down, ev => {
|
||||||
let state = this.board;
|
let state = this.board;
|
||||||
Svg.fill(this.shakeButton, this.props.theme.buttonDown);
|
svg.fill(this.shakeButton, this.props.theme.buttonDown);
|
||||||
})
|
})
|
||||||
this.shakeButton.addEventListener(pointerEvents.leave, ev => {
|
this.shakeButton.addEventListener(pointerEvents.leave, ev => {
|
||||||
let state = this.board;
|
let state = this.board;
|
||||||
Svg.fill(this.shakeButton, this.props.theme.virtualButtonUp);
|
svg.fill(this.shakeButton, this.props.theme.virtualButtonUp);
|
||||||
})
|
})
|
||||||
this.shakeButton.addEventListener(pointerEvents.up, ev => {
|
this.shakeButton.addEventListener(pointerEvents.up, ev => {
|
||||||
let state = this.board;
|
let state = this.board;
|
||||||
Svg.fill(this.shakeButton, this.props.theme.virtualButtonUp);
|
svg.fill(this.shakeButton, this.props.theme.virtualButtonUp);
|
||||||
this.board.bus.queue(DAL.MICROBIT_ID_GESTURE, 11); // GESTURE_SHAKE
|
this.board.bus.queue(DAL.MICROBIT_ID_GESTURE, 11); // GESTURE_SHAKE
|
||||||
})
|
})
|
||||||
this.shakeText = Svg.child(this.g, "text", {x:400, y:110, class:'sim-text'}) as SVGTextElement;
|
this.shakeText = svg.child(this.g, "text", { x: 400, y: 110, class: "sim-text" }) as SVGTextElement;
|
||||||
this.shakeText.textContent = "SHAKE"
|
this.shakeText.textContent = "SHAKE"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -171,9 +171,9 @@ namespace pxsim.micro_bit {
|
|||||||
private updateButtonAB() {
|
private updateButtonAB() {
|
||||||
let state = this.board;
|
let state = this.board;
|
||||||
if (state.usesButtonAB && !this.buttonABText) {
|
if (state.usesButtonAB && !this.buttonABText) {
|
||||||
(<any>this.buttonsOuter[2]).style.visibility = 'visible';
|
(<any>this.buttonsOuter[2]).style.visibility = "visible";
|
||||||
(<any>this.buttons[2]).style.visibility = 'visible';
|
(<any>this.buttons[2]).style.visibility = "visible";
|
||||||
this.buttonABText = Svg.child(this.g, "text", {class: 'sim-text', x:370, y:272 }) as SVGTextElement;
|
this.buttonABText = svg.child(this.g, "text", { class: "sim-text", x: 370, y: 272 }) as SVGTextElement;
|
||||||
this.buttonABText.textContent = "A+B";
|
this.buttonABText.textContent = "A+B";
|
||||||
this.updateTheme();
|
this.updateTheme();
|
||||||
}
|
}
|
||||||
@ -182,9 +182,9 @@ namespace pxsim.micro_bit {
|
|||||||
private updatePin(pin: Pin, index: number) {
|
private updatePin(pin: Pin, index: number) {
|
||||||
if (!pin) return;
|
if (!pin) return;
|
||||||
let text = this.pinTexts[index];
|
let text = this.pinTexts[index];
|
||||||
let v = '';
|
let v = "";
|
||||||
if (pin.mode & PinMode.Analog) {
|
if (pin.mode & PinMode.Analog) {
|
||||||
v = Math.floor(100 - (pin.value || 0) / 1023 * 100) + '%';
|
v = Math.floor(100 - (pin.value || 0) / 1023 * 100) + "%";
|
||||||
if (text) text.textContent = (pin.period ? "~" : "") + (pin.value || 0) + "";
|
if (text) text.textContent = (pin.period ? "~" : "") + (pin.value || 0) + "";
|
||||||
}
|
}
|
||||||
else if (pin.mode & PinMode.Digital) {
|
else if (pin.mode & PinMode.Digital) {
|
||||||
@ -198,7 +198,7 @@ namespace pxsim.micro_bit {
|
|||||||
v = '100%';
|
v = '100%';
|
||||||
if (text) text.textContent = '';
|
if (text) text.textContent = '';
|
||||||
}
|
}
|
||||||
if (v) Svg.setGradientValue(this.pinGradients[index], v);
|
if (v) svg.setGradientValue(this.pinGradients[index], v);
|
||||||
}
|
}
|
||||||
|
|
||||||
private updateTemperature() {
|
private updateTemperature() {
|
||||||
@ -209,8 +209,8 @@ namespace pxsim.micro_bit {
|
|||||||
let tmax = 50;
|
let tmax = 50;
|
||||||
if (!this.thermometer) {
|
if (!this.thermometer) {
|
||||||
let gid = "gradient-thermometer";
|
let gid = "gradient-thermometer";
|
||||||
this.thermometerGradient = Svg.linearGradient(this.defs, gid);
|
this.thermometerGradient = svg.linearGradient(this.defs, gid);
|
||||||
this.thermometer = <SVGRectElement> Svg.child(this.g, "rect", {
|
this.thermometer = <SVGRectElement>svg.child(this.g, "rect", {
|
||||||
class: "sim-thermometer",
|
class: "sim-thermometer",
|
||||||
x: 120,
|
x: 120,
|
||||||
y: 110,
|
y: 110,
|
||||||
@ -219,13 +219,13 @@ namespace pxsim.micro_bit {
|
|||||||
rx: 5, ry: 5,
|
rx: 5, ry: 5,
|
||||||
fill: `url(#${gid})`
|
fill: `url(#${gid})`
|
||||||
});
|
});
|
||||||
this.thermometerText = Svg.child(this.g, "text", { class:'sim-text', x:58, y:130}) as SVGTextElement;
|
this.thermometerText = svg.child(this.g, "text", { class: 'sim-text', x: 58, y: 130 }) as SVGTextElement;
|
||||||
this.updateTheme();
|
this.updateTheme();
|
||||||
|
|
||||||
let pt = this.element.createSVGPoint();
|
let pt = this.element.createSVGPoint();
|
||||||
Svg.buttonEvents(this.thermometer,
|
svg.buttonEvents(this.thermometer,
|
||||||
(ev) => {
|
(ev) => {
|
||||||
let cur = Svg.cursorPoint(pt, this.element, ev);
|
let cur = svg.cursorPoint(pt, this.element, ev);
|
||||||
let t = Math.max(0, Math.min(1, (260 - cur.y) / 140))
|
let t = Math.max(0, Math.min(1, (260 - cur.y) / 140))
|
||||||
state.temperature = Math.floor(tmin + t * (tmax - tmin));
|
state.temperature = Math.floor(tmin + t * (tmax - tmin));
|
||||||
this.updateTemperature();
|
this.updateTemperature();
|
||||||
@ -234,7 +234,7 @@ namespace pxsim.micro_bit {
|
|||||||
|
|
||||||
let t = Math.max(tmin, Math.min(tmax, state.temperature))
|
let t = Math.max(tmin, Math.min(tmax, state.temperature))
|
||||||
let per = Math.floor((state.temperature - tmin) / (tmax - tmin) * 100)
|
let per = Math.floor((state.temperature - tmin) / (tmax - tmin) * 100)
|
||||||
Svg.setGradientValue(this.thermometerGradient, 100 - per + '%');
|
svg.setGradientValue(this.thermometerGradient, 100 - per + '%');
|
||||||
this.thermometerText.textContent = t + '°C';
|
this.thermometerText.textContent = t + '°C';
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -247,10 +247,10 @@ namespace pxsim.micro_bit {
|
|||||||
let p = this.head.firstChild.nextSibling as SVGPathElement;
|
let p = this.head.firstChild.nextSibling as SVGPathElement;
|
||||||
p.setAttribute("d", "m269.9,50.134647l0,0l-39.5,0l0,0c-14.1,0.1 -24.6,10.7 -24.6,24.8c0,13.9 10.4,24.4 24.3,24.7l0,0l39.6,0c14.2,0 40.36034,-22.97069 40.36034,-24.85394c0,-1.88326 -26.06034,-24.54606 -40.16034,-24.64606m-0.2,39l0,0l-39.3,0c-7.7,-0.1 -14,-6.4 -14,-14.2c0,-7.8 6.4,-14.2 14.2,-14.2l39.1,0c7.8,0 14.2,6.4 14.2,14.2c0,7.9 -6.4,14.2 -14.2,14.2l0,0l0,0z");
|
p.setAttribute("d", "m269.9,50.134647l0,0l-39.5,0l0,0c-14.1,0.1 -24.6,10.7 -24.6,24.8c0,13.9 10.4,24.4 24.3,24.7l0,0l39.6,0c14.2,0 40.36034,-22.97069 40.36034,-24.85394c0,-1.88326 -26.06034,-24.54606 -40.16034,-24.64606m-0.2,39l0,0l-39.3,0c-7.7,-0.1 -14,-6.4 -14,-14.2c0,-7.8 6.4,-14.2 14.2,-14.2l39.1,0c7.8,0 14.2,6.4 14.2,14.2c0,7.9 -6.4,14.2 -14.2,14.2l0,0l0,0z");
|
||||||
let pt = this.element.createSVGPoint();
|
let pt = this.element.createSVGPoint();
|
||||||
Svg.buttonEvents(
|
svg.buttonEvents(
|
||||||
this.head,
|
this.head,
|
||||||
(ev: MouseEvent) => {
|
(ev: MouseEvent) => {
|
||||||
let cur = Svg.cursorPoint(pt, this.element, ev);
|
let cur = svg.cursorPoint(pt, this.element, ev);
|
||||||
state.heading = Math.floor(Math.atan2(cur.y - yc, cur.x - xc) * 180 / Math.PI + 90);
|
state.heading = Math.floor(Math.atan2(cur.y - yc, cur.x - xc) * 180 / Math.PI + 90);
|
||||||
if (state.heading < 0) state.heading += 360;
|
if (state.heading < 0) state.heading += 360;
|
||||||
console.log('heading: ' + state.heading)
|
console.log('heading: ' + state.heading)
|
||||||
@ -261,7 +261,7 @@ namespace pxsim.micro_bit {
|
|||||||
|
|
||||||
let txt = state.heading.toString() + '°';
|
let txt = state.heading.toString() + '°';
|
||||||
if (txt != this.headText.textContent) {
|
if (txt != this.headText.textContent) {
|
||||||
Svg.rotateElement(this.head, xc, yc, state.heading+180);
|
svg.rotateElement(this.head, xc, yc, state.heading + 180);
|
||||||
this.headText.textContent = txt;
|
this.headText.textContent = txt;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -269,11 +269,11 @@ namespace pxsim.micro_bit {
|
|||||||
private lastFlashTime: number = 0;
|
private lastFlashTime: number = 0;
|
||||||
public flashSystemLed() {
|
public flashSystemLed() {
|
||||||
if (!this.systemLed)
|
if (!this.systemLed)
|
||||||
this.systemLed = <SVGCircleElement>Svg.child(this.g, "circle", {class:"sim-systemled", cx:300, cy:20, r:5})
|
this.systemLed = <SVGCircleElement>svg.child(this.g, "circle", { class: "sim-systemled", cx: 300, cy: 20, r: 5 })
|
||||||
let now = Date.now();
|
let now = Date.now();
|
||||||
if (now - this.lastFlashTime > 150) {
|
if (now - this.lastFlashTime > 150) {
|
||||||
this.lastFlashTime = now;
|
this.lastFlashTime = now;
|
||||||
Svg.animate(this.systemLed, 'sim-flash')
|
svg.animate(this.systemLed, 'sim-flash')
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -284,12 +284,12 @@ namespace pxsim.micro_bit {
|
|||||||
let dax = 18;
|
let dax = 18;
|
||||||
let ayt = 10;
|
let ayt = 10;
|
||||||
let ayb = 40;
|
let ayb = 40;
|
||||||
this.antenna = <SVGPolylineElement>Svg.child(this.g, "polyline", { class:"sim-antenna", points: `${ax},${ayb} ${ax},${ayt} ${ax+=dax},${ayt} ${ax},${ayb} ${ax+=dax},${ayb} ${ax},${ayt} ${ax+=dax},${ayt} ${ax},${ayb} ${ax+=dax},${ayb} ${ax},${ayt} ${ax+=dax},${ayt}`})
|
this.antenna = <SVGPolylineElement>svg.child(this.g, "polyline", { class: "sim-antenna", points: `${ax},${ayb} ${ax},${ayt} ${ax += dax},${ayt} ${ax},${ayb} ${ax += dax},${ayb} ${ax},${ayt} ${ax += dax},${ayt} ${ax},${ayb} ${ax += dax},${ayb} ${ax},${ayt} ${ax += dax},${ayt}` })
|
||||||
}
|
}
|
||||||
let now = Date.now();
|
let now = Date.now();
|
||||||
if (now - this.lastAntennaFlash > 200) {
|
if (now - this.lastAntennaFlash > 200) {
|
||||||
this.lastAntennaFlash = now;
|
this.lastAntennaFlash = now;
|
||||||
Svg.animate(this.antenna, 'sim-flash-stroke')
|
svg.animate(this.antenna, 'sim-flash-stroke')
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -306,17 +306,18 @@ namespace pxsim.micro_bit {
|
|||||||
|
|
||||||
if (!this.lightLevelButton) {
|
if (!this.lightLevelButton) {
|
||||||
let gid = "gradient-light-level";
|
let gid = "gradient-light-level";
|
||||||
this.lightLevelGradient = Svg.linearGradient(this.defs, gid)
|
this.lightLevelGradient = svg.linearGradient(this.defs, gid)
|
||||||
let cy = 50;
|
let cy = 50;
|
||||||
let r = 35;
|
let r = 35;
|
||||||
this.lightLevelButton = Svg.child(this.g, "circle", {
|
this.lightLevelButton = svg.child(this.g, "circle", {
|
||||||
cx: `50px`, cy: `${cy}px`, r: `${r}px`,
|
cx: `50px`, cy: `${cy}px`, r: `${r}px`,
|
||||||
class: 'sim-light-level-button',
|
class: 'sim-light-level-button',
|
||||||
fill: `url(#${gid})` }) as SVGCircleElement;
|
fill: `url(#${gid})`
|
||||||
|
}) as SVGCircleElement;
|
||||||
let pt = this.element.createSVGPoint();
|
let pt = this.element.createSVGPoint();
|
||||||
Svg.buttonEvents(this.lightLevelButton,
|
svg.buttonEvents(this.lightLevelButton,
|
||||||
(ev) => {
|
(ev) => {
|
||||||
let pos = Svg.cursorPoint(pt, this.element, ev);
|
let pos = svg.cursorPoint(pt, this.element, ev);
|
||||||
let rs = r / 2;
|
let rs = r / 2;
|
||||||
let level = Math.max(0, Math.min(255, Math.floor((pos.y - (cy - rs)) / (2 * rs) * 255)));
|
let level = Math.max(0, Math.min(255, Math.floor((pos.y - (cy - rs)) / (2 * rs) * 255)));
|
||||||
if (level != this.board.lightLevel) {
|
if (level != this.board.lightLevel) {
|
||||||
@ -325,17 +326,17 @@ namespace pxsim.micro_bit {
|
|||||||
}
|
}
|
||||||
}, ev => { },
|
}, ev => { },
|
||||||
ev => { })
|
ev => { })
|
||||||
this.lightLevelText = Svg.child(this.g, "text", { x:85, y:cy+r-5, text:'', class:'sim-text'}) as SVGTextElement;
|
this.lightLevelText = svg.child(this.g, "text", { x: 85, y: cy + r - 5, text: '', class: 'sim-text' }) as SVGTextElement;
|
||||||
this.updateTheme();
|
this.updateTheme();
|
||||||
}
|
}
|
||||||
|
|
||||||
Svg.setGradientValue(this.lightLevelGradient, Math.min(100, Math.max(0, Math.floor(state.lightLevel * 100 / 255))) + '%')
|
svg.setGradientValue(this.lightLevelGradient, Math.min(100, Math.max(0, Math.floor(state.lightLevel * 100 / 255))) + '%')
|
||||||
this.lightLevelText.textContent = state.lightLevel.toString();
|
this.lightLevelText.textContent = state.lightLevel.toString();
|
||||||
}
|
}
|
||||||
|
|
||||||
private applyLightLevel() {
|
private applyLightLevel() {
|
||||||
let lv = this.board.lightLevel;
|
let lv = this.board.lightLevel;
|
||||||
Svg.setGradientValue(this.lightLevelGradient, Math.min(100, Math.max(0, Math.floor(lv * 100 / 255))) + '%')
|
svg.setGradientValue(this.lightLevelGradient, Math.min(100, Math.max(0, Math.floor(lv * 100 / 255))) + '%')
|
||||||
this.lightLevelText.textContent = lv.toString();
|
this.lightLevelText.textContent = lv.toString();
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -354,15 +355,16 @@ namespace pxsim.micro_bit {
|
|||||||
}
|
}
|
||||||
|
|
||||||
private buildDom() {
|
private buildDom() {
|
||||||
this.element = <SVGSVGElement>Svg.elt("svg")
|
this.element = <SVGSVGElement>svg.elt("svg")
|
||||||
Svg.hydrate(this.element, {
|
svg.hydrate(this.element, {
|
||||||
"version": "1.0",
|
"version": "1.0",
|
||||||
"viewBox": "0 0 498 406",
|
"viewBox": "0 0 498 406",
|
||||||
"enable-background": "new 0 0 498 406",
|
"enable-background": "new 0 0 498 406",
|
||||||
"class": "sim",
|
"class": "sim",
|
||||||
"x": "0px",
|
"x": "0px",
|
||||||
"y": "0px"});
|
"y": "0px"
|
||||||
this.style = <SVGStyleElement>Svg.child(this.element, "style", {});
|
});
|
||||||
|
this.style = <SVGStyleElement>svg.child(this.element, "style", {});
|
||||||
this.style.textContent = `
|
this.style.textContent = `
|
||||||
svg.sim {
|
svg.sim {
|
||||||
margin-bottom:1em;
|
margin-bottom:1em;
|
||||||
@ -459,50 +461,50 @@ svg.sim.grayscale {
|
|||||||
`;
|
`;
|
||||||
|
|
||||||
|
|
||||||
this.defs = <SVGDefsElement>Svg.child(this.element, "defs", {});
|
this.defs = <SVGDefsElement>svg.child(this.element, "defs", {});
|
||||||
this.g = Svg.elt("g");
|
this.g = svg.elt("g");
|
||||||
this.element.appendChild(this.g);
|
this.element.appendChild(this.g);
|
||||||
|
|
||||||
// filters
|
// filters
|
||||||
let glow = Svg.child(this.defs, "filter", {id:"filterglow", x:"-5%", y:"-5%", width:"120%", height:"120%"});
|
let glow = svg.child(this.defs, "filter", { id: "filterglow", x: "-5%", y: "-5%", width: "120%", height: "120%" });
|
||||||
Svg.child(glow, "feGaussianBlur", {stdDeviation:"5", result: "glow" });
|
svg.child(glow, "feGaussianBlur", { stdDeviation: "5", result: "glow" });
|
||||||
let merge = Svg.child(glow, "feMerge", {});
|
let merge = svg.child(glow, "feMerge", {});
|
||||||
for(let i=0;i<3;++i) Svg.child(merge, "feMergeNode", {in:"glow"})
|
for (let i = 0; i < 3; ++i) svg.child(merge, "feMergeNode", { in: "glow" })
|
||||||
|
|
||||||
// outline
|
// outline
|
||||||
Svg.path(this.g, "sim-board", "M498,31.9C498,14.3,483.7,0,466.1,0H31.9C14.3,0,0,14.3,0,31.9v342.2C0,391.7,14.3,406,31.9,406h434.2c17.6,0,31.9-14.3,31.9-31.9V31.9z M14.3,206.7c-2.7,0-4.8-2.2-4.8-4.8c0-2.7,2.2-4.8,4.8-4.8c2.7,0,4.8,2.2,4.8,4.8C19.2,204.6,17,206.7,14.3,206.7z M486.2,206.7c-2.7,0-4.8-2.2-4.8-4.8c0-2.72.2-4.8,4.8-4.8c2.7,0,4.8,2.2,4.8,4.8C491,204.6,488.8,206.7,486.2,206.7z");
|
svg.path(this.g, "sim-board", "M498,31.9C498,14.3,483.7,0,466.1,0H31.9C14.3,0,0,14.3,0,31.9v342.2C0,391.7,14.3,406,31.9,406h434.2c17.6,0,31.9-14.3,31.9-31.9V31.9z M14.3,206.7c-2.7,0-4.8-2.2-4.8-4.8c0-2.7,2.2-4.8,4.8-4.8c2.7,0,4.8,2.2,4.8,4.8C19.2,204.6,17,206.7,14.3,206.7z M486.2,206.7c-2.7,0-4.8-2.2-4.8-4.8c0-2.72.2-4.8,4.8-4.8c2.7,0,4.8,2.2,4.8,4.8C491,204.6,488.8,206.7,486.2,206.7z");
|
||||||
|
|
||||||
// script background
|
// script background
|
||||||
this.display = Svg.path(this.g, "sim-display", "M333.8,310.3H165.9c-8.3,0-15-6.7-15-15V127.5c0-8.3,6.7-15,15-15h167.8c8.3,0,15,6.7,15,15v167.8C348.8,303.6,342.1,310.3,333.8,310.3z");
|
this.display = svg.path(this.g, "sim-display", "M333.8,310.3H165.9c-8.3,0-15-6.7-15-15V127.5c0-8.3,6.7-15,15-15h167.8c8.3,0,15,6.7,15,15v167.8C348.8,303.6,342.1,310.3,333.8,310.3z");
|
||||||
|
|
||||||
this.logos = [];
|
this.logos = [];
|
||||||
this.logos.push(Svg.child(this.g, "polygon", {class:"sim-theme", points:"115,56.7 173.1,0 115,0"}));
|
this.logos.push(svg.child(this.g, "polygon", { class: "sim-theme", points: "115,56.7 173.1,0 115,0" }));
|
||||||
this.logos.push(Svg.path(this.g, "sim-theme", "M114.2,0H25.9C12.1,2.1,0,13.3,0,27.7v83.9L114.2,0z"));
|
this.logos.push(svg.path(this.g, "sim-theme", "M114.2,0H25.9C12.1,2.1,0,13.3,0,27.7v83.9L114.2,0z"));
|
||||||
this.logos.push(Svg.child(this.g, "polygon", {class:"sim-theme", points:"173,27.9 202.5,0 173,0"}));
|
this.logos.push(svg.child(this.g, "polygon", { class: "sim-theme", points: "173,27.9 202.5,0 173,0" }));
|
||||||
this.logos.push(Svg.child(this.g, "polygon", {class:"sim-theme", points:"54.1,242.4 54.1,274.1 22.4,274.1"}));
|
this.logos.push(svg.child(this.g, "polygon", { class: "sim-theme", points: "54.1,242.4 54.1,274.1 22.4,274.1" }));
|
||||||
this.logos.push(Svg.child(this.g, "polygon", {class:"sim-theme", points:"446.2,164.6 446.2,132.8 477.9,132.8"}));
|
this.logos.push(svg.child(this.g, "polygon", { class: "sim-theme", points: "446.2,164.6 446.2,132.8 477.9,132.8" }));
|
||||||
|
|
||||||
// leds
|
// leds
|
||||||
this.leds = [];
|
this.leds = [];
|
||||||
this.ledsOuter = [];
|
this.ledsOuter = [];
|
||||||
var left = 154, top = 113, ledoffw = 46, ledoffh = 44;
|
let left = 154, top = 113, ledoffw = 46, ledoffh = 44;
|
||||||
for (var i = 0; i < 5; ++i) {
|
for (let i = 0; i < 5; ++i) {
|
||||||
var ledtop = i * ledoffh + top;
|
let ledtop = i * ledoffh + top;
|
||||||
for (var j = 0; j < 5; ++j) {
|
for (let j = 0; j < 5; ++j) {
|
||||||
var ledleft = j * ledoffw + left;
|
let ledleft = j * ledoffw + left;
|
||||||
var k = i * 5 + j;
|
let k = i * 5 + j;
|
||||||
this.ledsOuter.push(Svg.child(this.g, "rect", { class:"sim-led-back", x:ledleft, y:ledtop, width:10, height:20, rx:2, ry:2 }));
|
this.ledsOuter.push(svg.child(this.g, "rect", { class: "sim-led-back", x: ledleft, y: ledtop, width: 10, height: 20, rx: 2, ry: 2 }));
|
||||||
this.leds.push(Svg.child(this.g, "rect", { class:"sim-led", x:ledleft-2, y:ledtop-2, width:14, height:24, rx:3, ry:3, title:`(${j},${i})`}));
|
this.leds.push(svg.child(this.g, "rect", { class: "sim-led", x: ledleft - 2, y: ledtop - 2, width: 14, height: 24, rx: 3, ry: 3, title: `(${j},${i})` }));
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// head
|
// head
|
||||||
this.head = <SVGGElement>Svg.child(this.g, "g", {});
|
this.head = <SVGGElement>svg.child(this.g, "g", {});
|
||||||
Svg.child(this.head, "circle", { cx: 258, cy: 75, r: 100, fill:'transparent'})
|
svg.child(this.head, "circle", { cx: 258, cy: 75, r: 100, fill: "transparent" })
|
||||||
this.logos.push(Svg.path(this.head, "sim-theme","M269.9,50.2L269.9,50.2l-39.5,0v0c-14.1,0.1-24.6,10.7-24.6,24.8c0,13.9,10.4,24.4,24.3,24.7v0h39.6c14.2,0,24.8-10.6,24.8-24.7C294.5,61,284,50.3,269.9,50.2 M269.7,89.2L269.7,89.2l-39.3,0c-7.7-0.1-14-6.4-14-14.2c0-7.8,6.4-14.2,14.2-14.2h39.1c7.8,0,14.2,6.4,14.2,14.2C283.9,82.9,277.5,89.2,269.7,89.2"));
|
this.logos.push(svg.path(this.head, "sim-theme", "M269.9,50.2L269.9,50.2l-39.5,0v0c-14.1,0.1-24.6,10.7-24.6,24.8c0,13.9,10.4,24.4,24.3,24.7v0h39.6c14.2,0,24.8-10.6,24.8-24.7C294.5,61,284,50.3,269.9,50.2 M269.7,89.2L269.7,89.2l-39.3,0c-7.7-0.1-14-6.4-14-14.2c0-7.8,6.4-14.2,14.2-14.2h39.1c7.8,0,14.2,6.4,14.2,14.2C283.9,82.9,277.5,89.2,269.7,89.2"));
|
||||||
this.logos.push(Svg.path(this.head, "sim-theme","M230.6,69.7c-2.9,0-5.3,2.4-5.3,5.3c0,2.9,2.4,5.3,5.3,5.3c2.9,0,5.3-2.4,5.3-5.3C235.9,72.1,233.5,69.7,230.6,69.7"));
|
this.logos.push(svg.path(this.head, "sim-theme", "M230.6,69.7c-2.9,0-5.3,2.4-5.3,5.3c0,2.9,2.4,5.3,5.3,5.3c2.9,0,5.3-2.4,5.3-5.3C235.9,72.1,233.5,69.7,230.6,69.7"));
|
||||||
this.logos.push(Svg.path(this.head, "sim-theme","M269.7,80.3c2.9,0,5.3-2.4,5.3-5.3c0-2.9-2.4-5.3-5.3-5.3c-2.9,0-5.3,2.4-5.3,5.3C264.4,77.9,266.8,80.3,269.7,80.3"));
|
this.logos.push(svg.path(this.head, "sim-theme", "M269.7,80.3c2.9,0,5.3-2.4,5.3-5.3c0-2.9-2.4-5.3-5.3-5.3c-2.9,0-5.3,2.4-5.3,5.3C264.4,77.9,266.8,80.3,269.7,80.3"));
|
||||||
this.headText = <SVGTextElement>Svg.child(this.g, "text", { x: 310, y: 100, class:'sim-text' })
|
this.headText = <SVGTextElement>svg.child(this.g, "text", { x: 310, y: 100, class: "sim-text" })
|
||||||
|
|
||||||
// https://www.microbit.co.uk/device/pins
|
// https://www.microbit.co.uk/device/pins
|
||||||
// P0, P1, P2
|
// P0, P1, P2
|
||||||
@ -510,69 +512,69 @@ svg.sim.grayscale {
|
|||||||
"M16.5,341.2c0,0.4-0.1,0.9-0.1,1.3v60.7c4.1,1.7,8.6,2.7,12.9,2.7h34.4v-64.7h0.3c0,0,0-0.1,0-0.1c0-13-10.6-23.6-23.7-23.6C27.2,317.6,16.5,328.1,16.5,341.2z M21.2,341.6c0-10.7,8.7-19.3,19.3-19.3c10.7,0,19.3,8.7,19.3,19.3c0,10.7-8.6,19.3-19.3,19.3C29.9,360.9,21.2,352.2,21.2,341.6z",
|
"M16.5,341.2c0,0.4-0.1,0.9-0.1,1.3v60.7c4.1,1.7,8.6,2.7,12.9,2.7h34.4v-64.7h0.3c0,0,0-0.1,0-0.1c0-13-10.6-23.6-23.7-23.6C27.2,317.6,16.5,328.1,16.5,341.2z M21.2,341.6c0-10.7,8.7-19.3,19.3-19.3c10.7,0,19.3,8.7,19.3,19.3c0,10.7-8.6,19.3-19.3,19.3C29.9,360.9,21.2,352.2,21.2,341.6z",
|
||||||
"M139.1,317.3c-12.8,0-22.1,10.3-23.1,23.1V406h46.2v-65.6C162.2,327.7,151.9,317.3,139.1,317.3zM139.3,360.1c-10.7,0-19.3-8.6-19.3-19.3c0-10.7,8.6-19.3,19.3-19.3c10.7,0,19.3,8.7,19.3,19.3C158.6,351.5,150,360.1,139.3,360.1z",
|
"M139.1,317.3c-12.8,0-22.1,10.3-23.1,23.1V406h46.2v-65.6C162.2,327.7,151.9,317.3,139.1,317.3zM139.3,360.1c-10.7,0-19.3-8.6-19.3-19.3c0-10.7,8.6-19.3,19.3-19.3c10.7,0,19.3,8.7,19.3,19.3C158.6,351.5,150,360.1,139.3,360.1z",
|
||||||
"M249,317.3c-12.8,0-22.1,10.3-23.1,23.1V406h46.2v-65.6C272.1,327.7,261.8,317.3,249,317.3z M249.4,360.1c-10.7,0-19.3-8.6-19.3-19.3c0-10.7,8.6-19.3,19.3-19.3c10.7,0,19.3,8.7,19.3,19.3C268.7,351.5,260.1,360.1,249.4,360.1z"
|
"M249,317.3c-12.8,0-22.1,10.3-23.1,23.1V406h46.2v-65.6C272.1,327.7,261.8,317.3,249,317.3z M249.4,360.1c-10.7,0-19.3-8.6-19.3-19.3c0-10.7,8.6-19.3,19.3-19.3c10.7,0,19.3,8.7,19.3,19.3C268.7,351.5,260.1,360.1,249.4,360.1z"
|
||||||
].map((p,pi) => Svg.path(this.g, "sim-pin sim-pin-touch", p, `P${pi}, ANALOG IN`));
|
].map((p, pi) => svg.path(this.g, "sim-pin sim-pin-touch", p, `P${pi}, ANALOG IN`));
|
||||||
|
|
||||||
// P3
|
// P3
|
||||||
this.pins.push(Svg.path(this.g, "sim-pin", "M0,357.7v19.2c0,10.8,6.2,20.2,14.4,25.2v-44.4H0z", "P3, ANALOG IN, LED Col 1"));
|
this.pins.push(svg.path(this.g, "sim-pin", "M0,357.7v19.2c0,10.8,6.2,20.2,14.4,25.2v-44.4H0z", "P3, ANALOG IN, LED Col 1"));
|
||||||
|
|
||||||
[66.7, 79.1, 91.4, 103.7, 164.3, 176.6, 188.9, 201.3, 213.6, 275.2, 287.5, 299.8, 312.1, 324.5, 385.1, 397.4, 409.7, 422].forEach(x => {
|
[66.7, 79.1, 91.4, 103.7, 164.3, 176.6, 188.9, 201.3, 213.6, 275.2, 287.5, 299.8, 312.1, 324.5, 385.1, 397.4, 409.7, 422].forEach(x => {
|
||||||
this.pins.push(Svg.child(this.g, "rect", {x:x, y:356.7, width:10, height:50, class:"sim-pin"}));
|
this.pins.push(svg.child(this.g, "rect", { x: x, y: 356.7, width: 10, height: 50, class: "sim-pin" }));
|
||||||
})
|
})
|
||||||
Svg.title(this.pins[4], "P4, ANALOG IN, LED Col 2")
|
svg.title(this.pins[4], "P4, ANALOG IN, LED Col 2")
|
||||||
Svg.title(this.pins[5], "P5, BUTTON A")
|
svg.title(this.pins[5], "P5, BUTTON A")
|
||||||
Svg.title(this.pins[6], "P6, LED Col 9")
|
svg.title(this.pins[6], "P6, LED Col 9")
|
||||||
Svg.title(this.pins[7], "P7, LED Col 8")
|
svg.title(this.pins[7], "P7, LED Col 8")
|
||||||
Svg.title(this.pins[8], "P8")
|
svg.title(this.pins[8], "P8")
|
||||||
Svg.title(this.pins[9], "P9, LED Col 7")
|
svg.title(this.pins[9], "P9, LED Col 7")
|
||||||
Svg.title(this.pins[10], "P10, ANALOG IN, LED Col 3")
|
svg.title(this.pins[10], "P10, ANALOG IN, LED Col 3")
|
||||||
Svg.title(this.pins[11], "P11, BUTTON B")
|
svg.title(this.pins[11], "P11, BUTTON B")
|
||||||
Svg.title(this.pins[12], "P12, RESERVED ACCESSIBILITY")
|
svg.title(this.pins[12], "P12, RESERVED ACCESSIBILITY")
|
||||||
Svg.title(this.pins[13], "P13, SPI - SCK")
|
svg.title(this.pins[13], "P13, SPI - SCK")
|
||||||
Svg.title(this.pins[14], "P14, SPI - MISO")
|
svg.title(this.pins[14], "P14, SPI - MISO")
|
||||||
Svg.title(this.pins[15], "P15, SPI - MOSI")
|
svg.title(this.pins[15], "P15, SPI - MOSI")
|
||||||
Svg.title(this.pins[16], "P16, SPI - Chip Select")
|
svg.title(this.pins[16], "P16, SPI - Chip Select")
|
||||||
Svg.title(this.pins[17], "P17, +3v3")
|
svg.title(this.pins[17], "P17, +3v3")
|
||||||
Svg.title(this.pins[18], "P18, +3v3")
|
svg.title(this.pins[18], "P18, +3v3")
|
||||||
Svg.title(this.pins[19], "P19, I2C - SCL")
|
svg.title(this.pins[19], "P19, I2C - SCL")
|
||||||
Svg.title(this.pins[20], "P20, I2C - SDA")
|
svg.title(this.pins[20], "P20, I2C - SDA")
|
||||||
Svg.title(this.pins[21], "GND")
|
svg.title(this.pins[21], "GND")
|
||||||
|
|
||||||
this.pins.push(Svg.path(this.g, "sim-pin", "M483.6,402c8.2-5,14.4-14.4,14.4-25.1v-19.2h-14.4V402z", "GND"));
|
this.pins.push(svg.path(this.g, "sim-pin", "M483.6,402c8.2-5,14.4-14.4,14.4-25.1v-19.2h-14.4V402z", "GND"));
|
||||||
|
|
||||||
this.pins.push(Svg.path(this.g, "sim-pin", "M359.9,317.3c-12.8,0-22.1,10.3-23.1,23.1V406H383v-65.6C383,327.7,372.7,317.3,359.9,317.3z M360,360.1c-10.7,0-19.3-8.6-19.3-19.3c0-10.7,8.6-19.3,19.3-19.3c10.7,0,19.3,8.7,19.3,19.3C379.3,351.5,370.7,360.1,360,360.1z", "+3v3"));
|
this.pins.push(svg.path(this.g, "sim-pin", "M359.9,317.3c-12.8,0-22.1,10.3-23.1,23.1V406H383v-65.6C383,327.7,372.7,317.3,359.9,317.3z M360,360.1c-10.7,0-19.3-8.6-19.3-19.3c0-10.7,8.6-19.3,19.3-19.3c10.7,0,19.3,8.7,19.3,19.3C379.3,351.5,370.7,360.1,360,360.1z", "+3v3"));
|
||||||
this.pins.push(Svg.path(this.g, "sim-pin", "M458,317.6c-13,0-23.6,10.6-23.6,23.6c0,0,0,0.1,0,0.1h0V406H469c4.3,0,8.4-1,12.6-2.7v-60.7c0-0.4,0-0.9,0-1.3C481.6,328.1,471,317.6,458,317.6z M457.8,360.9c-10.7,0-19.3-8.6-19.3-19.3c0-10.7,8.6-19.3,19.3-19.3c10.7,0,19.3,8.7,19.3,19.3C477.1,352.2,468.4,360.9,457.8,360.9z", "GND"));
|
this.pins.push(svg.path(this.g, "sim-pin", "M458,317.6c-13,0-23.6,10.6-23.6,23.6c0,0,0,0.1,0,0.1h0V406H469c4.3,0,8.4-1,12.6-2.7v-60.7c0-0.4,0-0.9,0-1.3C481.6,328.1,471,317.6,458,317.6z M457.8,360.9c-10.7,0-19.3-8.6-19.3-19.3c0-10.7,8.6-19.3,19.3-19.3c10.7,0,19.3,8.7,19.3,19.3C477.1,352.2,468.4,360.9,457.8,360.9z", "GND"));
|
||||||
|
|
||||||
|
|
||||||
this.pinGradients = this.pins.map((pin, i) => {
|
this.pinGradients = this.pins.map((pin, i) => {
|
||||||
let gid = "gradient-pin-" + i
|
let gid = "gradient-pin-" + i
|
||||||
let lg = Svg.linearGradient(this.defs, gid)
|
let lg = svg.linearGradient(this.defs, gid)
|
||||||
pin.setAttribute("fill", `url(#${gid})`);
|
pin.setAttribute("fill", `url(#${gid})`);
|
||||||
return lg;
|
return lg;
|
||||||
})
|
})
|
||||||
|
|
||||||
this.pinTexts = [67,165,275].map(x => <SVGTextElement>Svg.child(this.g, "text", { class:'sim-text-pin', x:x, y:345}));
|
this.pinTexts = [67, 165, 275].map(x => <SVGTextElement>svg.child(this.g, "text", { class: 'sim-text-pin', x: x, y: 345 }));
|
||||||
|
|
||||||
this.buttonsOuter = []; this.buttons = [];
|
this.buttonsOuter = []; this.buttons = [];
|
||||||
this.buttonsOuter.push(Svg.path(this.g, "sim-button-outer", "M82.1,232.6H25.9c-0.5,0-1-0.4-1-1v-56.2c0-0.5,0.4-1,1-1h56.2c0.5,0,1,0.4,1,1v56.2C83,232.2,82.6,232.6,82.1,232.6", "A"));
|
this.buttonsOuter.push(svg.path(this.g, "sim-button-outer", "M82.1,232.6H25.9c-0.5,0-1-0.4-1-1v-56.2c0-0.5,0.4-1,1-1h56.2c0.5,0,1,0.4,1,1v56.2C83,232.2,82.6,232.6,82.1,232.6", "A"));
|
||||||
this.buttons.push(Svg.path(this.g, "sim-button", "M69.7,203.5c0,8.7-7,15.7-15.7,15.7s-15.7-7-15.7-15.7c0-8.7,7-15.7,15.7-15.7S69.7,194.9,69.7,203.5"));
|
this.buttons.push(svg.path(this.g, "sim-button", "M69.7,203.5c0,8.7-7,15.7-15.7,15.7s-15.7-7-15.7-15.7c0-8.7,7-15.7,15.7-15.7S69.7,194.9,69.7,203.5"));
|
||||||
this.buttonsOuter.push(Svg.path(this.g, "sim-button-outer", "M474.3,232.6h-56.2c-0.5,0-1-0.4-1-1v-56.2c0-0.5,0.4-1,1-1h56.2c0.5,0,1,0.4,1,1v56.2C475.3,232.2,474.8,232.6,474.3,232.6", "B"));
|
this.buttonsOuter.push(svg.path(this.g, "sim-button-outer", "M474.3,232.6h-56.2c-0.5,0-1-0.4-1-1v-56.2c0-0.5,0.4-1,1-1h56.2c0.5,0,1,0.4,1,1v56.2C475.3,232.2,474.8,232.6,474.3,232.6", "B"));
|
||||||
this.buttons.push(Svg.path(this.g, "sim-button", "M461.9,203.5c0,8.7-7,15.7-15.7,15.7c-8.7,0-15.7-7-15.7-15.7c0-8.7,7-15.7,15.7-15.7C454.9,187.8,461.9,194.9,461.9,203.5"));
|
this.buttons.push(svg.path(this.g, "sim-button", "M461.9,203.5c0,8.7-7,15.7-15.7,15.7c-8.7,0-15.7-7-15.7-15.7c0-8.7,7-15.7,15.7-15.7C454.9,187.8,461.9,194.9,461.9,203.5"));
|
||||||
this.buttonsOuter.push(Svg.child(this.g, "rect", {class:"sim-button-outer", x:417, y:250, width:58, height:58, rx:1, ry:1, title:"A+B"}));
|
this.buttonsOuter.push(svg.child(this.g, "rect", { class: "sim-button-outer", x: 417, y: 250, width: 58, height: 58, rx: 1, ry: 1, title: "A+B" }));
|
||||||
this.buttons.push(Svg.child(this.g, "circle", {class:"sim-button", cx:446, cy:278, r:16.5}));
|
this.buttons.push(svg.child(this.g, "circle", { class: "sim-button", cx: 446, cy: 278, r: 16.5 }));
|
||||||
(<any>this.buttonsOuter[2]).style.visibility = 'hidden';
|
(<any>this.buttonsOuter[2]).style.visibility = 'hidden';
|
||||||
(<any>this.buttons[2]).style.visibility = 'hidden';
|
(<any>this.buttons[2]).style.visibility = 'hidden';
|
||||||
|
|
||||||
Svg.path(this.g, "sim-label", "M35.7,376.4c0-2.8,2.1-5.1,5.5-5.1c3.3,0,5.5,2.4,5.5,5.1v4.7c0,2.8-2.2,5.1-5.5,5.1c-3.3,0-5.5-2.4-5.5-5.1V376.4zM43.3,376.4c0-1.3-0.8-2.3-2.2-2.3c-1.3,0-2.1,1.1-2.1,2.3v4.7c0,1.2,0.8,2.3,2.1,2.3c1.3,0,2.2-1.1,2.2-2.3V376.4z");
|
svg.path(this.g, "sim-label", "M35.7,376.4c0-2.8,2.1-5.1,5.5-5.1c3.3,0,5.5,2.4,5.5,5.1v4.7c0,2.8-2.2,5.1-5.5,5.1c-3.3,0-5.5-2.4-5.5-5.1V376.4zM43.3,376.4c0-1.3-0.8-2.3-2.2-2.3c-1.3,0-2.1,1.1-2.1,2.3v4.7c0,1.2,0.8,2.3,2.1,2.3c1.3,0,2.2-1.1,2.2-2.3V376.4z");
|
||||||
Svg.path(this.g, "sim-label", "M136.2,374.1c2.8,0,3.4-0.8,3.4-2.5h2.9v14.3h-3.4v-9.5h-3V374.1z");
|
svg.path(this.g, "sim-label", "M136.2,374.1c2.8,0,3.4-0.8,3.4-2.5h2.9v14.3h-3.4v-9.5h-3V374.1z");
|
||||||
Svg.path(this.g, "sim-label", "M248.6,378.5c1.7-1,3-1.7,3-3.1c0-1.1-0.7-1.6-1.6-1.6c-1,0-1.8,0.6-1.8,2.1h-3.3c0-2.6,1.8-4.6,5.1-4.6c2.6,0,4.9,1.3,4.9,4.3c0,2.4-2.3,3.9-3.8,4.7c-2,1.3-2.5,1.8-2.5,2.9h6.1v2.7h-10C244.8,381.2,246.4,379.9,248.6,378.5z");
|
svg.path(this.g, "sim-label", "M248.6,378.5c1.7-1,3-1.7,3-3.1c0-1.1-0.7-1.6-1.6-1.6c-1,0-1.8,0.6-1.8,2.1h-3.3c0-2.6,1.8-4.6,5.1-4.6c2.6,0,4.9,1.3,4.9,4.3c0,2.4-2.3,3.9-3.8,4.7c-2,1.3-2.5,1.8-2.5,2.9h6.1v2.7h-10C244.8,381.2,246.4,379.9,248.6,378.5z");
|
||||||
Svg.path(this.g, "sim-label", "M48.1,270.9l-0.6-1.7h-5.1l-0.6,1.7h-3.5l5.1-14.3h3.1l5.2,14.3H48.1z M45,260.7l-1.8,5.9h3.5L45,260.7z");
|
svg.path(this.g, "sim-label", "M48.1,270.9l-0.6-1.7h-5.1l-0.6,1.7h-3.5l5.1-14.3h3.1l5.2,14.3H48.1z M45,260.7l-1.8,5.9h3.5L45,260.7z");
|
||||||
|
|
||||||
Svg.path(this.g, "sim-label", "M449.1,135.8h5.9c3.9,0,4.7,2.4,4.7,3.9c0,1.8-1.4,2.9-2.5,3.2c0.9,0,2.6,1.1,2.6,3.3c0,1.5-0.8,4-4.7,4h-6V135.8zM454.4,141.7c1.6,0,2-1,2-1.7c0-0.6-0.3-1.7-2-1.7h-2v3.4H454.4z M452.4,144.1v3.5h2.1c1.6,0,2-1,2-1.8c0-0.7-0.4-1.8-2-1.8H452.4z")
|
svg.path(this.g, "sim-label", "M449.1,135.8h5.9c3.9,0,4.7,2.4,4.7,3.9c0,1.8-1.4,2.9-2.5,3.2c0.9,0,2.6,1.1,2.6,3.3c0,1.5-0.8,4-4.7,4h-6V135.8zM454.4,141.7c1.6,0,2-1,2-1.7c0-0.6-0.3-1.7-2-1.7h-2v3.4H454.4z M452.4,144.1v3.5h2.1c1.6,0,2-1,2-1.8c0-0.7-0.4-1.8-2-1.8H452.4z")
|
||||||
Svg.path(this.g, "sim-label", "M352.1,381.1c0,1.6,0.9,2.5,2.2,2.5c1.2,0,1.9-0.9,1.9-1.9c0-1.2-0.6-2-2.1-2h-1.3v-2.6h1.3c1.5,0,1.9-0.7,1.9-1.8c0-1.1-0.7-1.6-1.6-1.6c-1.4,0-1.8,0.8-1.8,2.1h-3.3c0-2.4,1.5-4.6,5.1-4.6c2.6,0,5,1.3,5,4c0,1.6-1,2.8-2.1,3.2c1.3,0.5,2.3,1.6,2.3,3.5c0,2.7-2.4,4.3-5.2,4.3c-3.5,0-5.5-2.1-5.5-5.1H352.1z")
|
svg.path(this.g, "sim-label", "M352.1,381.1c0,1.6,0.9,2.5,2.2,2.5c1.2,0,1.9-0.9,1.9-1.9c0-1.2-0.6-2-2.1-2h-1.3v-2.6h1.3c1.5,0,1.9-0.7,1.9-1.8c0-1.1-0.7-1.6-1.6-1.6c-1.4,0-1.8,0.8-1.8,2.1h-3.3c0-2.4,1.5-4.6,5.1-4.6c2.6,0,5,1.3,5,4c0,1.6-1,2.8-2.1,3.2c1.3,0.5,2.3,1.6,2.3,3.5c0,2.7-2.4,4.3-5.2,4.3c-3.5,0-5.5-2.1-5.5-5.1H352.1z")
|
||||||
Svg.path(this.g, "sim-label", "M368.5,385.9h-3.1l-5.1-14.3h3.5l3.1,10.1l3.1-10.1h3.6L368.5,385.9z")
|
svg.path(this.g, "sim-label", "M368.5,385.9h-3.1l-5.1-14.3h3.5l3.1,10.1l3.1-10.1h3.6L368.5,385.9z")
|
||||||
Svg.path(this.g, "sim-label", "M444.4,378.3h7.4v2.5h-1.5c-0.6,3.3-3,5.5-7.1,5.5c-4.8,0-7.5-3.5-7.5-7.5c0-3.9,2.8-7.5,7.5-7.5c3.8,0,6.4,2.3,6.6,5h-3.5c-0.2-1.1-1.4-2.2-3.1-2.2c-2.7,0-4.1,2.3-4.1,4.7c0,2.5,1.4,4.7,4.4,4.7c2,0,3.2-1.2,3.4-2.7h-2.5V378.3z")
|
svg.path(this.g, "sim-label", "M444.4,378.3h7.4v2.5h-1.5c-0.6,3.3-3,5.5-7.1,5.5c-4.8,0-7.5-3.5-7.5-7.5c0-3.9,2.8-7.5,7.5-7.5c3.8,0,6.4,2.3,6.6,5h-3.5c-0.2-1.1-1.4-2.2-3.1-2.2c-2.7,0-4.1,2.3-4.1,4.7c0,2.5,1.4,4.7,4.4,4.7c2,0,3.2-1.2,3.4-2.7h-2.5V378.3z")
|
||||||
Svg.path(this.g, "sim-label", "M461.4,380.9v-9.3h3.3v14.3h-3.5l-5.2-9.2v9.2h-3.3v-14.3h3.5L461.4,380.9z")
|
svg.path(this.g, "sim-label", "M461.4,380.9v-9.3h3.3v14.3h-3.5l-5.2-9.2v9.2h-3.3v-14.3h3.5L461.4,380.9z")
|
||||||
Svg.path(this.g, "sim-label", "M472.7,371.6c4.8,0,7.5,3.5,7.5,7.2s-2.7,7.2-7.5,7.2h-5.3v-14.3H472.7z M470.8,374.4v8.6h1.8c2.7,0,4.2-2.1,4.2-4.3s-1.6-4.3-4.2-4.3H470.8z")
|
svg.path(this.g, "sim-label", "M472.7,371.6c4.8,0,7.5,3.5,7.5,7.2s-2.7,7.2-7.5,7.2h-5.3v-14.3H472.7z M470.8,374.4v8.6h1.8c2.7,0,4.2-2.1,4.2-4.3s-1.6-4.3-4.2-4.3H470.8z")
|
||||||
}
|
}
|
||||||
|
|
||||||
private attachEvents() {
|
private attachEvents() {
|
||||||
@ -630,14 +632,14 @@ svg.sim.grayscale {
|
|||||||
this.pins.forEach((pin, index) => {
|
this.pins.forEach((pin, index) => {
|
||||||
if (!this.board.pins[index]) return;
|
if (!this.board.pins[index]) return;
|
||||||
let pt = this.element.createSVGPoint();
|
let pt = this.element.createSVGPoint();
|
||||||
Svg.buttonEvents(pin,
|
svg.buttonEvents(pin,
|
||||||
// move
|
// move
|
||||||
ev => {
|
ev => {
|
||||||
let state = this.board;
|
let state = this.board;
|
||||||
let pin = state.pins[index];
|
let pin = state.pins[index];
|
||||||
let svgpin = this.pins[index];
|
let svgpin = this.pins[index];
|
||||||
if (pin.mode & PinMode.Input) {
|
if (pin.mode & PinMode.Input) {
|
||||||
let cursor = Svg.cursorPoint(pt, this.element, ev);
|
let cursor = svg.cursorPoint(pt, this.element, ev);
|
||||||
let v = (400 - cursor.y) / 40 * 1023
|
let v = (400 - cursor.y) / 40 * 1023
|
||||||
pin.value = Math.max(0, Math.min(1023, Math.floor(v)));
|
pin.value = Math.max(0, Math.min(1023, Math.floor(v)));
|
||||||
}
|
}
|
||||||
@ -648,9 +650,9 @@ svg.sim.grayscale {
|
|||||||
let state = this.board;
|
let state = this.board;
|
||||||
let pin = state.pins[index];
|
let pin = state.pins[index];
|
||||||
let svgpin = this.pins[index];
|
let svgpin = this.pins[index];
|
||||||
Svg.addClass(svgpin, 'touched');
|
svg.addClass(svgpin, "touched");
|
||||||
if (pin.mode & PinMode.Input) {
|
if (pin.mode & PinMode.Input) {
|
||||||
let cursor = Svg.cursorPoint(pt, this.element, ev);
|
let cursor = svg.cursorPoint(pt, this.element, ev);
|
||||||
let v = (400 - cursor.y) / 40 * 1023
|
let v = (400 - cursor.y) / 40 * 1023
|
||||||
pin.value = Math.max(0, Math.min(1023, Math.floor(v)));
|
pin.value = Math.max(0, Math.min(1023, Math.floor(v)));
|
||||||
}
|
}
|
||||||
@ -661,7 +663,7 @@ svg.sim.grayscale {
|
|||||||
let state = this.board;
|
let state = this.board;
|
||||||
let pin = state.pins[index];
|
let pin = state.pins[index];
|
||||||
let svgpin = this.pins[index];
|
let svgpin = this.pins[index];
|
||||||
Svg.removeClass(svgpin, 'touched');
|
svg.removeClass(svgpin, "touched");
|
||||||
this.updatePin(pin, index);
|
this.updatePin(pin, index);
|
||||||
return false;
|
return false;
|
||||||
});
|
});
|
||||||
@ -688,17 +690,17 @@ svg.sim.grayscale {
|
|||||||
btn.addEventListener(pointerEvents.down, ev => {
|
btn.addEventListener(pointerEvents.down, ev => {
|
||||||
let state = this.board;
|
let state = this.board;
|
||||||
state.buttons[index].pressed = true;
|
state.buttons[index].pressed = true;
|
||||||
Svg.fill(this.buttons[index], this.props.theme.buttonDown);
|
svg.fill(this.buttons[index], this.props.theme.buttonDown);
|
||||||
})
|
})
|
||||||
btn.addEventListener(pointerEvents.leave, ev => {
|
btn.addEventListener(pointerEvents.leave, ev => {
|
||||||
let state = this.board;
|
let state = this.board;
|
||||||
state.buttons[index].pressed = false;
|
state.buttons[index].pressed = false;
|
||||||
Svg.fill(this.buttons[index], this.props.theme.buttonUp);
|
svg.fill(this.buttons[index], this.props.theme.buttonUp);
|
||||||
})
|
})
|
||||||
btn.addEventListener(pointerEvents.up, ev => {
|
btn.addEventListener(pointerEvents.up, ev => {
|
||||||
let state = this.board;
|
let state = this.board;
|
||||||
state.buttons[index].pressed = false;
|
state.buttons[index].pressed = false;
|
||||||
Svg.fill(this.buttons[index], this.props.theme.buttonUp);
|
svg.fill(this.buttons[index], this.props.theme.buttonUp);
|
||||||
|
|
||||||
this.board.bus.queue(state.buttons[index].id, DAL.MICROBIT_BUTTON_EVT_CLICK);
|
this.board.bus.queue(state.buttons[index].id, DAL.MICROBIT_BUTTON_EVT_CLICK);
|
||||||
})
|
})
|
||||||
@ -708,27 +710,27 @@ svg.sim.grayscale {
|
|||||||
state.buttons[0].pressed = true;
|
state.buttons[0].pressed = true;
|
||||||
state.buttons[1].pressed = true;
|
state.buttons[1].pressed = true;
|
||||||
state.buttons[2].pressed = true;
|
state.buttons[2].pressed = true;
|
||||||
Svg.fill(this.buttons[0], this.props.theme.buttonDown);
|
svg.fill(this.buttons[0], this.props.theme.buttonDown);
|
||||||
Svg.fill(this.buttons[1], this.props.theme.buttonDown);
|
svg.fill(this.buttons[1], this.props.theme.buttonDown);
|
||||||
Svg.fill(this.buttons[2], this.props.theme.buttonDown);
|
svg.fill(this.buttons[2], this.props.theme.buttonDown);
|
||||||
})
|
})
|
||||||
this.buttonsOuter[2].addEventListener(pointerEvents.leave, ev => {
|
this.buttonsOuter[2].addEventListener(pointerEvents.leave, ev => {
|
||||||
let state = this.board;
|
let state = this.board;
|
||||||
state.buttons[0].pressed = false;
|
state.buttons[0].pressed = false;
|
||||||
state.buttons[1].pressed = false;
|
state.buttons[1].pressed = false;
|
||||||
state.buttons[2].pressed = false;
|
state.buttons[2].pressed = false;
|
||||||
Svg.fill(this.buttons[0], this.props.theme.buttonUp);
|
svg.fill(this.buttons[0], this.props.theme.buttonUp);
|
||||||
Svg.fill(this.buttons[1], this.props.theme.buttonUp);
|
svg.fill(this.buttons[1], this.props.theme.buttonUp);
|
||||||
Svg.fill(this.buttons[2], this.props.theme.virtualButtonUp);
|
svg.fill(this.buttons[2], this.props.theme.virtualButtonUp);
|
||||||
})
|
})
|
||||||
this.buttonsOuter[2].addEventListener(pointerEvents.up, ev => {
|
this.buttonsOuter[2].addEventListener(pointerEvents.up, ev => {
|
||||||
let state = this.board;
|
let state = this.board;
|
||||||
state.buttons[0].pressed = false;
|
state.buttons[0].pressed = false;
|
||||||
state.buttons[1].pressed = false;
|
state.buttons[1].pressed = false;
|
||||||
state.buttons[2].pressed = false;
|
state.buttons[2].pressed = false;
|
||||||
Svg.fill(this.buttons[0], this.props.theme.buttonUp);
|
svg.fill(this.buttons[0], this.props.theme.buttonUp);
|
||||||
Svg.fill(this.buttons[1], this.props.theme.buttonUp);
|
svg.fill(this.buttons[1], this.props.theme.buttonUp);
|
||||||
Svg.fill(this.buttons[2], this.props.theme.virtualButtonUp);
|
svg.fill(this.buttons[2], this.props.theme.virtualButtonUp);
|
||||||
|
|
||||||
this.board.bus.queue(state.buttons[2].id, DAL.MICROBIT_BUTTON_EVT_CLICK);
|
this.board.bus.queue(state.buttons[2].id, DAL.MICROBIT_BUTTON_EVT_CLICK);
|
||||||
})
|
})
|
||||||
|
56
tslint.json
Normal file
56
tslint.json
Normal file
@ -0,0 +1,56 @@
|
|||||||
|
{
|
||||||
|
"rules": {
|
||||||
|
"class-name": true,
|
||||||
|
"comment-format": [
|
||||||
|
true
|
||||||
|
],
|
||||||
|
"indent": [
|
||||||
|
true,
|
||||||
|
"spaces"
|
||||||
|
],
|
||||||
|
"no-duplicate-variable": true,
|
||||||
|
"no-eval": true,
|
||||||
|
"no-internal-module": true,
|
||||||
|
"no-trailing-whitespace": true,
|
||||||
|
"no-var-keyword": true,
|
||||||
|
"one-line": [
|
||||||
|
true,
|
||||||
|
"check-open-brace",
|
||||||
|
"check-whitespace"
|
||||||
|
],
|
||||||
|
"quotemark": [
|
||||||
|
true,
|
||||||
|
"double"
|
||||||
|
],
|
||||||
|
"semicolon": [
|
||||||
|
false,
|
||||||
|
"always"
|
||||||
|
],
|
||||||
|
"triple-equals": [
|
||||||
|
false,
|
||||||
|
"allow-null-check"
|
||||||
|
],
|
||||||
|
"typedef-whitespace": [
|
||||||
|
true,
|
||||||
|
{
|
||||||
|
"call-signature": "nospace",
|
||||||
|
"index-signature": "nospace",
|
||||||
|
"parameter": "nospace",
|
||||||
|
"property-declaration": "nospace",
|
||||||
|
"variable-declaration": "nospace"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"variable-name": [
|
||||||
|
true,
|
||||||
|
"ban-keywords"
|
||||||
|
],
|
||||||
|
"whitespace": [
|
||||||
|
true,
|
||||||
|
"check-branch",
|
||||||
|
"check-decl",
|
||||||
|
"check-operator",
|
||||||
|
"check-separator",
|
||||||
|
"check-type"
|
||||||
|
]
|
||||||
|
}
|
||||||
|
}
|
Reference in New Issue
Block a user