Draw widgets if present. Code more reliable.

apps/dragboard/lib.js

@@ -1,11 +1,5 @@
-//Keep banglejs screen on for 100 sec at 0.55 power level for development purposes
-//Bangle.setLCDTimeout(30);
-//Bangle.setLCDPower(1);
-
 exports.input = function(options) {
   "ram";
-  //Bangle.loadWidgets();
-  //Bangle.drawWidgets();
   options = options||{};
   var text = options.text;
   if ("string"!=typeof text) text="";
@@ -29,13 +23,16 @@ exports.input = function(options) {
 
   var rectHeight = 40;
 
-
   var delSpaceLast;
 
   function drawAbcRow() {
     g.clear();
+    try { // Draw widgets if they are present in the current app.
+      if (WIDGETS) Bangle.drawWidgets();
+    } catch (_) {}
     g.setFont(SMALLFONT);
     g.setColor(ABCCOLOR);
+    g.setFontAlign(-1, -1, 0);
     g.drawString(ABC, ABCPADDING, (R.y+R.h)/2);
     g.fillRect(0, (R.y+R.h)-26, (R.x+R.w), (R.y+R.h));
   }
@@ -43,6 +40,7 @@ exports.input = function(options) {
   function drawNumRow() {
     g.setFont(SMALLFONT);
     g.setColor(NUMCOLOR);
+    g.setFontAlign(-1, -1, 0);
     g.drawString(NUM, NUMPADDING, (R.y+R.h)/4);
 
     g.fillRect(NUMPADDING, (R.y+R.h)-rectHeight*4/3, (R.x+R.w)-NUMPADDING, (R.y+R.h)-rectHeight*2/3);
@@ -58,6 +56,7 @@ exports.input = function(options) {
     g.setColor(0.7,0,0);
     g.fillRect(rectLen+5,4+20,rectLen+10,13+20);
     g.setColor(1,1,1);
+    g.setFontAlign(-1, -1, 0);
     g.drawString(text.length<=27? text.substr(-27, 27) : '<- '+text.substr(-24,24), 5, 5+20);
   }
 
@@ -74,6 +73,7 @@ exports.input = function(options) {
     // Small character in list
     g.setColor(rowColor);
     g.setFont(SMALLFONT);
+    g.setFontAlign(-1, -1, 0);
     g.drawString(char, typePadding + HLPrev*6, (R.y+R.h)/heightDivisor);
     // Large character
     g.setColor(BGCOLOR);
@@ -86,6 +86,7 @@ exports.input = function(options) {
     // mark in the list
     g.setColor(HLCOLOR);
     g.setFont(SMALLFONT);
+    g.setFontAlign(-1, -1, 0);
     if (char != 'del' && char != 'space') g.drawString(char, typePadding + HL*6, (R.y+R.h)/heightDivisor);
     // show new large character
     g.setFont(BIGFONT);
@@ -93,12 +94,18 @@ exports.input = function(options) {
     g.setFont(SMALLFONT);
   }
 
+  function initDraw() {
+    //var R = Bangle.appRect; // To make sure it's properly updated. Not sure if this is needed.
     drawAbcRow();
     drawNumRow();
     updateTopString();
+  }
+  initDraw();
+  //setTimeout(initDraw, 0); // So Bangle.appRect reads the correct environment. It would draw off to the side sometimes otherwise.
 
   function changeCase(abcHL) {
     g.setColor(BGCOLOR);
+    g.setFontAlign(-1, -1, 0);
     g.drawString(ABC, ABCPADDING, (R.y+R.h)/2);
     if (ABC.charAt(abcHL) == ABC.charAt(abcHL).toUpperCase()) ABC = ABC.toLowerCase();
     else ABC = ABC.toUpperCase();
@@ -148,14 +155,6 @@ exports.input = function(options) {
           typePrev = 'abc';
         }
 
-      
-      
-      
-      
-      
-      
-      
-
         // 12345678901234567890
         // Choose number or puctuation by draging on green rectangle
         else if ((event.y < ( (R.y+R.h) - 12 )) && (event.y > ( (R.y+R.h) - 52 ))) {
@@ -210,13 +209,6 @@ exports.input = function(options) {
           typePrev = 'num';
         }
 
-      
-      
-      
-      
-      
-      
-      
         // Make a space or backspace by swiping right or left on screen above green rectangle
         else if (event.y > 20+4) {
           if (event.b == 0) {
@@ -252,14 +244,5 @@ exports.input = function(options) {
         }
       }
     });
-});
+  });
-/*  return new Promise((resolve,reject) => {
-    Bangle.setUI({mode:"custom", back:()=>{
-      Bangle.setUI();
-      g.clearRect(Bangle.appRect);
-      Bangle.setUI();
-      resolve(text);
-    }});
-  }); */
-
 };