Misc battery widget tweaks, and make icon = the actual widget's icon

apps.json

@@ -716,7 +716,7 @@
   {
     "id": "widbat",
     "name": "Battery Level Widget",
-    "version": "0.08",
+    "version": "0.09",
     "description": "Show the current battery level and charging status in the top right of the clock",
     "icon": "widget.png",
     "type": "widget",
@@ -726,6 +726,19 @@
       {"name":"widbat.wid.js","url":"widget.js"}
     ]
   },
+  {
+    "id": "widbatv",
+    "name": "Battery Level Widget (Vertical)",
+    "version": "0.01",
+    "description": "Slim, vertical battery widget that only takes up 14px",
+    "icon": "widget.png",
+    "type": "widget",
+    "tags": "widget,battery",
+    "supports": ["BANGLEJS","BANGLEJS2"],
+    "storage": [
+      {"name":"widbatv.wid.js","url":"widget.js"}
+    ]
+  },
   {
     "id": "widlock",
     "name": "Lock Widget",
@@ -1617,12 +1630,12 @@
   {
     "id": "widtbat",
     "name": "Tiny Battery Widget",
-    "version": "0.01",
+    "version": "0.02",
     "description": "Tiny blueish battery widget, vibs and changes level color when charging",
     "icon": "widget.png",
     "type": "widget",
     "tags": "widget,tool,system",
-    "supports": ["BANGLEJS"],
+    "supports": ["BANGLEJS","BANGLEJS2"],
     "storage": [
       {"name":"widtbat.wid.js","url":"widget.js"}
     ]

apps/widbat/ChangeLog

@@ -5,3 +5,4 @@
 0.06: Use 'g.theme' (requires bootloader 0.23)
 0.07: Move CHARGING variable to more readable string
 0.08: Ensure battery updates every 60s even if LCD was on at boot and stays on
+0.09: Misc speed/memory tweaks

apps/widbat/widget.js

@@ -1,26 +1,11 @@
 (function(){
-
   function setWidth() {
     WIDGETS["bat"].width = 40 + (Bangle.isCharging()?16:0);
   }
-  function draw() {
-    var s = 39;
-    var x = this.x, y = this.y;
-    g.reset();
-    if (Bangle.isCharging()) {
-      g.setColor("#0f0").drawImage(atob("DhgBHOBzgc4HOP////////////////////3/4HgB4AeAHgB4AeAHgB4AeAHg"),x,y);
-      x+=16;
-    }
-    g.setColor(g.theme.fg);
-    g.fillRect(x,y+2,x+s-4,y+21);
-    g.clearRect(x+2,y+4,x+s-6,y+19);
-    g.fillRect(x+s-3,y+10,x+s,y+14);
-    g.setColor("#0f0").fillRect(x+4,y+6,x+4+E.getBattery()*(s-12)/100,y+17);
-  }
   Bangle.on('charging',function(charging) {
     if(charging) Bangle.buzz();
     setWidth();
-    Bangle.drawWidgets(); // relayout widgets
+    Bangle.drawWidgets(); // re-layout widgets
     g.flip();
   });
   var batteryInterval = Bangle.isLCDOn() ? setInterval(()=>WIDGETS["bat"].draw(), 60000) : undefined;
@@ -37,6 +22,16 @@
       }
     }
   });
-  WIDGETS["bat"]={area:"tr",width:40,draw:draw};
+  WIDGETS["bat"]={area:"tr",width:40,draw:function() {
+    var s = 39;
+    var x = this.x, y = this.y;
+    g.reset();
+    if (Bangle.isCharging()) {
+      g.setColor("#0f0").drawImage(atob("DhgBHOBzgc4HOP////////////////////3/4HgB4AeAHgB4AeAHgB4AeAHg"),x,y);
+      x+=16;
+    }
+    g.setColor(g.theme.fg).fillRect(x,y+2,x+s-4,y+21).clearRect(x+2,y+4,x+s-6,y+19).fillRect(x+s-3,y+10,x+s,y+14);
+    g.setColor("#0f0").fillRect(x+4,y+6,x+4+E.getBattery()*(s-12)/100,y+17);
+  }};
   setWidth();
 })()

apps/widbatv/ChangeLog

@@ -0,0 +1 @@
+0.01: New widget

apps/widbatv/widget.js

@@ -0,0 +1,19 @@
+Bangle.on('charging',function(charging) {
+  if(charging) Bangle.buzz();
+  WIDGETS["batv"].draw();
+});
+setInterval(()=>WIDGETS["batv"].draw(), 60000);
+Bangle.on('lcdPower', function(on) {
+  if (on) WIDGETS["batv"].draw(); // refresh at power on
+});
+WIDGETS["batv"]={area:"tr",width:14,draw:function() {
+  var x = this.x, y = this.y;
+  g.reset();
+  if (Bangle.isCharging()) {
+    g.setColor("#0f0").drawImage(atob("DhgBHOBzgc4HOP////////////////////3/4HgB4AeAHgB4AeAHgB4AeAHg"),x,y);
+  } else {
+    g.clearRect(x,y,x+14,y+24);
+    g.setColor(g.theme.fg).fillRect(x+2,y+2,x+12,y+22).clearRect(x+4,y+4,x+10,y+20).fillRect(x+5,y+1,x+9,y+2);
+    g.setColor("#0f0").fillRect(x+4,y+20-(E.getBattery()*16/100),x+10,y+20);
+  }
+}};

apps/widtbat/ChangeLog

@@ -1 +1,2 @@
 0.01: New Widget!
+0.02: Theme support, memory savings

apps/widtbat/widget.js

@@ -1,17 +1,11 @@
-/* jshint esversion: 6 */
-(() => {
-  const CBS = 0x41f, CBC = 0x07E0;
-  var xo = 6, xl = 22, yo = 9, h = 17;
-
-  function draw() {
-    g.reset().setColor(CBS).drawImage(require("heatshrink").decompress(atob("j0TwIHEv///kD////EfAYPwuEAgPB4EAg/HCgMfzgDBvwOC/IOC84ONDoUcFgc/AYOAHYRDE")), this.x + 1, this.y + 4);
-    g.setColor(0).fillRect(this.x + xo, this.y + yo, this.x + xl, this.y + h);
-    var cbc = (Bangle.isCharging()) ? CBC : CBS;
-    g.setColor(cbc).fillRect(this.x + xo, this.y + yo, this.x + (xl - xo) / 100 * E.getBattery() + xo, this.y + h);
-  }
 Bangle.on('charging', function(charging) {
   if (charging) Bangle.buzz();
-    Bangle.drawWidgets();
+  WIDGETS["widtbat"].draw();
 });
-  WIDGETS["widtbat"] = { area:"tr", width:32, draw: draw };
-})();
+WIDGETS["widtbat"] = { area:"tr", width:32, draw: function() {
+  const xo = 6, xl = 22, yo = 9, h = 17;
+  g.reset().setColor("#08f").drawImage(require("heatshrink").decompress(atob("j0TwIHEv///kD////EfAYPwuEAgPB4EAg/HCgMfzgDBvwOC/IOC84ONDoUcFgc/AYOAHYRDE")), this.x + 1, this.y + 4);
+  g.clearRect(this.x + xo, this.y + yo, this.x + xl, this.y + h);
+  var cbc = (Bangle.isCharging()) ? "#0f0" : "#08f";
+  g.setColor(cbc).fillRect(this.x + xo, this.y + yo, this.x + (xl - xo) / 100 * E.getBattery() + xo, this.y + h);
+} };