Bangle.js: Modify Bangle.drawWidgets to only clear the areas where widgets actually are, not the whole top&bottom bar (ref espruino/BangleApps#121)

Author: gfwilliams

ChangeLog

@@ -119,6 +119,7 @@
             Bangle.js: Modify handling of widgets to allow variable width widgets (requires new widget JS)
             Changed 6x8 builtin font to a modified Dina_r400-6 supporting non-ASCII characters
             Bangle.js: Modify E.showMessage/Prompt/Alert to clear the entire screen and redraw widgets (fix #1771)
+            Bangle.js: Modify Bangle.drawWidgets to only clear the areas where widgets actually are, not the whole top&bottom bar
 
      2v04 : Allow \1..\9 escape codes in RegExp
             ESP8266: reading storage is not working for boot from user2 (fix #1507)

libs/js/banglejs/Bangle_drawWidgets.js

@@ -1,18 +1,22 @@
 (function() {
   var w=g.getWidth(), h=g.getHeight();
   var pos = {
-	  tl:{x:32, y:0, r:0}, // if r==1, we're right->left
-	  tr:{x:w-32, y:0, r:1},
-	  bl:{x:32, y:h-24, r:0},
-	  br:{x:w-32, y:h-24, r:1}
+	  tl:{x:28, y:0, r:0}, // if r==1, we're right->left
+	  tr:{x:w-28, y:0, r:1},
+	  bl:{x:24, y:h-24, r:0},
+	  br:{x:w-24, y:h-24, r:1}
   };
-  g.reset().clearRect(0,0,w-1,23).clearRect(0,h-24,w-1,h-1);
-  if (global.WIDGETS) for (var wd of WIDGETS) {
+  if (global.WIDGETS) {
+    for (var wd of WIDGETS) {
 	  var p = pos[wd.area];
 	  if (!p) return;
 	  wd.x = p.x - p.r*wd.width;
 	  wd.y = p.y;
 	  p.x += wd.width*(1-2*p.r);
 	  wd.draw(wd);
+    }
+    g.reset().clearRect(0,0,pos.tl.x,23).clearRect(0,h-24,pos.bl.x,h-1); // left
+    g.clearRect(pos.tr.x,0,w-1,23).clearRect(pos.br.x,h-24,w-1,h-1); // right
+    for (wd of WIDGETS) wd.draw(wd);
   }
 })