Below is the (minimal) code to define an LED that just lets you use LED (or LED1 ) as is - which is a red round LED with size of 10 pixels in diameter in the left top corner of the display:
let LED = // LED as minimal and only definition (as instance / singleton)
{ isOn: false // status on / off, not needed if you don't need to ask for it
, set: function(v) { // turn on w/ no arg or truey, else off
g.setColor((this.isOn=(v===undefined||!!v))?1:0,0,0).fillCircle(4,4,5); }
, reset: function() { this.set(false); } // turn off
, write: function(v) { this.set(v); } // turn on w/ no arg or truey, else off
, toggle: function() { this.set( ! this.isOn); } // toggle the LED
}, LED1 = LED; // LED1 as 'synonym' for LED
This snipped shows the classical blink:
var ledIsOn = false;
setInterval(()=>{ if ((ledIsOn=!ledIsOn)) LED.reset(); else LED.set();},500);
Since the LED1 is smart and knows to toggle, for blink you get a way with this:
setInterval(()=>LED.toggle(),500);
Another option is to use LED's status yourself:
setInterval(()=>LED.set( ! LED.isOn),500);
If you need the LED to show some where else on Bangle.js' screen, just change the coordinates in line 4. Same goes for color and shape. Just lookup (Bangle.js') Graphics reference or Espruino's Graphics reference ( Note the difference: Because Bangle.js has a particular display with its own driver setup, .setColor(..) is unique ). For example you want to have a yellow triangle shaped LED blinking next to BTN3, use below lines for line 4 in definition.
var c=(this.isOn=(v===undefined||!!v))?[1,1,0]:[0,0,0];
g.setColor(c[0],c[1],c[2]).fillPoly([229,196,238,204,220,204],1); }
If you have to set the LED's status based on a variable, for example, whether the button BTN1 is pressed or not, you can use this condition digitalRead(BTN1) in the classical blink code. Checking the button only twice a second - every 500 milliseconds (ms) - is not not that suitable anymore. Increasing the frequency - lowering the timeout to 20ms - would make the LED more responsive but starts to eat away compute cycles and with that power. To avoid that, Espruino provides the global functionsetWatch(...). As the name says, it can watch something and act on changes of the watched thing, such as the event of a buttons press status change:
In other words: every time BTN1 changes its press status, LED reflects that (edge property in the watch options object can be omitted since trueis default ).
or as a constructor to create just any LED anywhere on the display of any color and any size.
One single LED with a fixed color, shape and size is a bit limited. Therefore you like to go with the definition of LEDs as a class / template / prototype - as used in object-oriented programming terms - with which you can define as many LEDs as you like.
// --- LED as constructor to create any number, colored, sized LEDs
let LED = function(x,y,s,c,f) { // constructor
this.isOn = false; // LED on / off
this.x = x || 0; // left of LED bounding box
this.y = y || 0; // top of LED bounding box
this.s = s || 10; // size (diameter) };
this.c = c || [1,0,0]; // color as RGB array with values 0..1
this.f = f || function(_) {
g.fillCircle(_.x+_.s/2,_.y+_.s/2,_.s/2); }; }; // fill shape
LED.prototype.set = function(v) { // set method
v = ((this.isOn = (v === undefined || !!v))
?g.setColor(this.c[0],this.c[1],this.c[2]):g.setColor(0,0,0));
this.f(this); }; // execute the function that fills the (default) shape
LED.prototype.reset = function() { this.set(false); }; // reset method
LED.prototype.write = function(v) { this.set(v); }; // like set method
LED.prototype.toggle = function() { this.set( ! this.isOn); };
If you want to use both definition methods simultaneously in your application, then you have to add this code for LED as singleton:
// --- LED definition as instance / singleton (alternative or in combo)
// var LED ={}: // uncomment this if you use this def without class above
LED.isOn = false; // status on / off, not needed if you don't need to ask for it
LED.set = function(v) { // turn on w/ no arg or truey, else off
g.setColor((this.isOn=(v===undefined||!!v))?1:0,0,0).fillCircle(4,4,5); };
LED.reset = function() { this.set(false); }; // turn off
LED.write = function(v) { this.set(v); }; // like set method
LED.toggle = function() { this.set( ! this.isOn); }; // toggle the LED
LED1 = LED; // LED1 as 'synonym' for LED
** Use of LED in both ways:** (includes both definitions for easy, single copy / paste into Espruino Web (Bangle emulator) IDE code pane -on the right):
// LEDs in Bangle.js context - by allObjects:
// --- LED as constructor to create any number, colored, sized LEDs
let LED = function(x,y,s,c,f) { // constructor
this.isOn = false; // LED on / off
this.x = x || 0; // left of LED bounding box
this.y = y || 0; // top of LED bounding box
this.s = s || 10; // size (diameter) };
this.c = c || [1,0,0]; // color as RGB array with values 0..1
this.f = f || function(_) {
g.fillCircle(_.x+_.s/2,_.y+_.s/2,_.s/2); }; }; // fill shape
LED.prototype.set = function(v) { // set method
v = ((this.isOn = (v === undefined || !!v))
?g.setColor(this.c[0],this.c[1],this.c[2]):g.setColor(0,0,0));
this.f(this); }; // execute the function that fills the (default) shape
LED.prototype.reset = function() { this.set(false); }; // reset method
LED.prototype.write = function(v) { this.set(v); }; // like set method
LED.prototype.toggle = function() { this.set( ! this.isOn); };
// --- LED definition as instance / singleton (alternative or in combo)
// var LED ={}: // uncomment this if you use this def without class above
LED.isOn = false; // status on / off, not needed if you don't need to ask for it
LED.set = function(v) { // turn on w/ no arg or truey, else off
g.setColor((this.isOn=(v===undefined||!!v))?1:0,0,0).fillCircle(4,4,5); };
LED.reset = function() { this.set(false); }; // turn off
LED.write = function(v) { this.set(v); }; // like set
LED.toggle = function() { this.set( ! this.isOn); }; // toggle the LED
LED1 = LED; // LED1 as 'synonym' for LED
// Use of both LED definitions / both ways
var redOn // status of red round LED
, redIId // interval id for red LED
, greenLED // green large LED
, greenIId // interval id for green LED
, triangle // fill triangle function
, yellowLED // yellow triangle LED
, yellowIId // interval id for yellow LED
;
function onInit() {
redOn = false;
redIId = setInterval(function(){ // use of LED as is and
LED.set(redOn=!redOn); // toggle every 333 milliseconds
}, 333); // (flash 3 times in 2 secs)
greenLED = new LED(15,0,30,[0,1,0]); // Use LED as contructor
greenIId = setInterval(function(){ // to create a green LED and
greenLED.set(!greenLED.isOn); // at 15//0 of size 30 and
},500); // flash once a second
triangle = function(_) { // fill triangle in x,y,x+s,y+s bounding box
g.fillPoly([_.x+_.s/2,_.y,_.x+_.s,_.y+_.s,_.x,_.y+_.s],1); };
yellowLED = new LED(221,190,19,[1,1,0],triangle); // next BTN3
yellowIId = setInterval(() => yellowLED.toggle(),1000);
}
setTimeout(onInit,999); // while dev'ing; remove before upload for save()
An example of a big, fat, color changing LED code you find in the 'nudging' conversation post #7 - screen shot a clip attached here as well.
Espruino is a JavaScript interpreter for low-power Microcontrollers. This site is both a support community for Espruino and a place to share what you are working on.
Below is the (minimal) code to define an LED that just lets you use
LED
(orLED1
) as is - which is a red round LED with size of 10 pixels in diameter in the left top corner of the display:This snipped shows the classical blink:
Since the LED1 is smart and knows to toggle, for blink you get a way with this:
Another option is to use LED's status yourself:
If you need the LED to show some where else on Bangle.js' screen, just change the coordinates in line
4
. Same goes for color and shape. Just lookup (Bangle.js') Graphics reference or Espruino's Graphics reference ( Note the difference: Because Bangle.js has a particular display with its own driver setup,.setColor(..)
is unique ). For example you want to have a yellow triangle shaped LED blinking next toBTN3
, use below lines for line4
in definition.If you have to set the LED's status based on a variable, for example, whether the button
BTN1
is pressed or not, you can use this conditiondigitalRead(BTN1)
in the classical blink code. Checking the button only twice a second - every 500 milliseconds (ms) - is not not that suitable anymore. Increasing the frequency - lowering the timeout to 20ms - would make the LED more responsive but starts to eat away compute cycles and with that power. To avoid that, Espruino provides the global functionsetWatch(...)
. As the name says, it can watch something and act on changes of the watched thing, such as the event of a buttons press status change:In other words: every time
BTN1
changes its press status,LED
reflects that (edge property in the watch options object can be omitted sincetrue
is default ).or as a constructor to create just any LED anywhere on the display of any color and any size.
One single LED with a fixed color, shape and size is a bit limited. Therefore you like to go with the definition of LEDs as a class / template / prototype - as used in object-oriented programming terms - with which you can define as many LEDs as you like.
If you want to use both definition methods simultaneously in your application, then you have to add this code for LED as singleton:
** Use of LED in both ways:** (includes both definitions for easy, single copy / paste into Espruino Web (Bangle emulator) IDE code pane -on the right):
An example of a big, fat, color changing LED code you find in the 'nudging' conversation post #7 - screen shot a clip attached here as well.
2 Attachments