Merge branch 'master' of github.com:espruino/BangleApps

apps.json

@@ -2793,8 +2793,8 @@
   "name": "Test User Input",
   "shortName":"Test User Input",
   "icon": "app.png",
-  "version":"0.03",
-  "description": "Basic app to test the bangle.js input interface. It displays the user action in text or an on/off switch image for swipe movement.",
+  "version":"0.04",
+  "description": "Basic app to test the bangle.js input interface. It displays the user action in text, an  option round element or an on/off switch image for swipe movements.",
   "readme": "README.md",
   "tags": "input,interface,buttons,touch",
   "storage": [
@@ -2855,5 +2855,30 @@
   "storage": [
     {"name":"widhrt.wid.js","url":"widget.js"}
   ]
+},
+{ "id": "countdowntimer",
+  "name" : "Countdown Timer",
+  "icon": "countdowntimer.png",
+  "version": "0.01",
+  "description": "A simple countdown timer with a focus on usability",
+  "tags": "timer, tool",
+  "readme": "README.md",
+  "storage": [
+    {"name": "countdowntimer.app.js", "url": "countdowntimer.js"},
+    {"name": "countdowntimer.img", "url": "countdowntimer-icon.js", "evaluate": true}
+  ]
+},
+{ "id": "helloworld",
+  "name": "hello,world!",
+  "shortName":"helloworld",
+  "icon": "app.png",
+  "version":"0.01",
+  "description": "A cross cultural hello world!/hola mundo! app with colors and languages",
+  "readme": "README.md",
+  "tags": "input,interface,buttons,touch",
+  "storage": [
+    {"name":"helloworld.app.js","url":"app.js"},
+    {"name":"helloworld.img","url":"app-icon.js","evaluate":true}
+  ]
 }
 ]

apps/countdowntimer/ChangeLog

@@ -0,0 +1 @@
+0.01: Initial version

apps/countdowntimer/README.md

@@ -0,0 +1,12 @@
+# countdown-timer
+
+A basic bangle.js timer with a focus on usability.
+
+* Start or Pause the timer with BTN1
+* Reset the timer with BTN2
+* Exit the application with BTN3
+* Touch the right side of the screen to increase the time amount by 1 second
+* Touch the left side of the scren to decrease the time amount by 1 second
+* Touching and holding the screen will increase or decrease the time amount by 60 seconds at a time.
+
+Icons made by [Freepik](https://www.freepik.com) from [Flaticon](https://www.flaticon.com/).

apps/countdowntimer/countdowntimer-icon.js

@@ -0,0 +1 @@
+require("heatshrink").decompress(atob("mEwwgMJhvd7tEogkSC4lAC6xWUgUgNysiC6hGBL58BiMQLoYXDMJkRAAIWEC4gYJFwIABCwgXFDBAWCpoXLMYwuCigUD6czmUSmQYKC4QuD6f//8xiUzmckJJIuECwQXEDAgXGFwc/C4XykYXCmZIJCwVPCwQABCwczmgwHXYXUCwgXFGBAXC74XLGAQXELowXIVgYXF6QWF+Z3EJAhGFUganHJAoXFRooXLMAQXCLwwXHMAQXUMAQXCRwQWFC9HSiMvC40iCocxiKoEC4cTC4sRiLBDC5MiF4wXFmQXHL4/zkRHEO6H/OwwXFX5IXfd5HfC5s0C4/TC5skRwZ4LLxAXHMAxeIC4hIJLxYXEJAxGMJAgwFFw4XGGAZhD+UjLoxGEC4owDmMSIoouGJAgYBGIIXDCwYuGGAoABIQMiaIQuKDA/dCoguJJIwXHCxQYGCyIYFCyRjELZYA="))

apps/countdowntimer/countdowntimer.js

@@ -0,0 +1,232 @@
+const heatshrinkDecompress = require("heatshrink").decompress;
+
+const playIcon = heatshrinkDecompress(atob("jEYwhC/gFwBZV3BhV3u4LLBhILCEpALCBhALDu9gBaojKHZZrVQZSbLAG4A="));
+const pauseIcon = heatshrinkDecompress(atob("jEYwhC/xGIAYoL/Bf4LfAHA="));
+const resetIcon = heatshrinkDecompress(atob("jEYwg30h3u93gAgIKHBgXuBYgIBoEEBoQWFAgQMCBYgrBE4giEBYYjGAgY+DBY4AHBZlABZQ7DLIpTFAo5ZJLYYDFTZKzLAGQA=="));
+const closeIcon = heatshrinkDecompress(atob("jEYwhC/4AEDhgKEhnMAofMCIgGECAoHFCwwIDCw4YDCxAYCCxALMEZY7KKZZrKQZibKAHIA="));
+
+const timerState = {
+    IDLE: 0,
+    RUNNING: 1
+};
+
+let currentState = timerState.IDLE;
+let remainingSeconds = 0;
+let countdownInterval = null;
+let increasingInterval = null;
+let decreasingInterval = null;
+let isDecreasingRemainingSeconds = false;
+let isIncreasingRemainingSeconds = false;
+
+function main() {
+    g.clear();
+    g.setFont("Vector", 40);
+    g.setFontAlign(0, 0);
+
+    registerInputHandlers();
+
+    draw();
+}
+
+function registerInputHandlers() {
+    setWatch(onPrimaryButtonPressed, BTN1, { repeat: true });
+    setWatch(onResetButtonPressed, BTN2, { repeat: true });
+    setWatch(onExitButtonPressed, BTN3, { repeat: true });
+    setWatch(onDecreaseRemainingSecondsPressed, BTN4, { repeat: true, edge: "rising" });
+    setWatch(onIncreaseRemainingSecondsPressed, BTN5, { repeat: true, edge: "rising" });
+    setWatch(onDecreaseRemainingSecondsReleased, BTN4, { repeat: true, edge: "falling" });
+    setWatch(onIncreaseRemainingSecondsReleased, BTN5, { repeat: true, edge: "falling" });
+}
+
+function draw() {
+    g.clearRect(200, 0, 240, 240);
+    g.clearRect(0, 0, 240, 80);
+
+    drawRemainingSecondsPanel();
+
+    g.drawImage(resetIcon, 216, 108);
+    g.drawImage(closeIcon, 216, 188);
+
+    if (currentState == timerState.IDLE) {
+        g.drawImage(playIcon, 216, 28);
+    } else {
+        g.drawImage(pauseIcon, 216, 28);
+    }
+
+    g.flip();
+}
+
+function drawRemainingSecondsPanel() {
+    g.clearRect(0, 100, 200, 140);
+    g.drawString(formatRemainingSeconds(), 105, 120);
+
+    if (currentState == timerState.IDLE) {
+        drawSubtractRemainingSeconds();
+        drawIncreaseRemainingSeconds();
+    } else {
+        g.setColor(0.4, 0.4, 0.4);
+        drawSubtractRemainingSeconds();
+        drawIncreaseRemainingSeconds();
+        g.setColor(-1);
+    }
+}
+
+function drawSubtractRemainingSeconds() {
+    if (isDecreasingRemainingSeconds) {
+        drawFilledCircle(22, 117, 15);
+    }
+
+    g.drawString("-", 25, 120);
+}
+
+function drawIncreaseRemainingSeconds() {
+    if (isIncreasingRemainingSeconds) {
+        drawFilledCircle(182, 117, 15);
+    }
+
+    g.drawString("+", 185, 120);
+}
+
+function drawFilledCircle(x, y, radians) {
+    g.setColor(0.1, 0.37, 0.87);
+    g.fillCircle(x, y, radians);
+    g.setColor(-1);
+}
+
+function formatRemainingSeconds() {
+    const minutes = Math.floor(remainingSeconds / 60);
+    const minutesTens = Math.floor(minutes / 10);
+    const minutesUnits = minutes % 10;
+
+    const seconds = remainingSeconds % 60;
+    const secondsTens = Math.floor(seconds / 10);
+    const secondsUnits = seconds % 10;
+
+    return `${minutesTens}${minutesUnits}:${secondsTens}${secondsUnits}`;
+}
+
+function onPrimaryButtonPressed() {
+    if (isIncreasingRemainingSeconds || isDecreasingRemainingSeconds) return;
+
+    if (currentState == timerState.IDLE) {
+        if (remainingSeconds == 0) return;
+        currentState = timerState.RUNNING;
+        beginCountdown();
+        draw();
+    } else {
+        currentState = timerState.IDLE;
+        stopCountdown();
+        draw();
+    }
+}
+
+function beginCountdown() {
+    countdownInterval = setInterval(countdown, 1000);
+}
+
+function countdown() {
+    --remainingSeconds;
+
+    if (remainingSeconds <= 0) {
+        remainingSeconds = 0;
+        stopCountdown();
+    }
+
+    drawRemainingSecondsPanel();
+
+    if (remainingSeconds <= 0) {
+        drawStopMessage();
+    }
+}
+
+function drawStopMessage() {
+    draw();
+    Bangle.buzz(800);
+    g.setFont("Vector", 30);
+    g.setColor(1.0, 0.91, 0);
+    g.drawString("Time's Up!", 105, 40);
+    g.setColor(-1);
+    g.setFont("Vector", 40);
+}
+
+function stopCountdown() {
+    clearInterval(countdownInterval);
+    countdownInterval = null;
+    currentState = timerState.IDLE;
+}
+
+function onResetButtonPressed() {
+    currentState = timerState.IDLE;
+    remainingSeconds = 0;
+    draw();
+}
+
+function onExitButtonPressed() {
+    Bangle.showLauncher();
+}
+
+function onIncreaseRemainingSecondsPressed() {
+    if (currentState == timerState.RUNNING) return;
+    incremementRemainingSeconds();
+
+    increasingInterval = setInterval(() => {
+        remainingSeconds += 60;
+
+        if (remainingSeconds >= 5999) {
+            remainingSeconds = 5999;
+        }
+
+        drawRemainingSecondsPanel();
+    }, 250);
+
+    isIncreasingRemainingSeconds = true;
+
+    drawRemainingSecondsPanel();
+}
+
+function incremementRemainingSeconds() {
+    if (remainingSeconds >= 5999) return;
+    ++remainingSeconds;
+}
+
+function onIncreaseRemainingSecondsReleased() {
+    if (currentState == timerState.RUNNING) return;
+    clearInterval(increasingInterval);
+    isIncreasingRemainingSeconds = false;
+    drawRemainingSecondsPanel();
+}
+
+function onDecreaseRemainingSecondsPressed() {
+    if (currentState == timerState.RUNNING) return;
+    decreaseRemainingSeconds();
+
+    decreasingInterval = setInterval(() => {
+        remainingSeconds -= 60;
+        
+        if (remainingSeconds < 0) {
+            remainingSeconds = 0;
+        }
+
+        drawRemainingSecondsPanel();
+    }, 250);
+
+    isDecreasingRemainingSeconds = true;
+
+    drawRemainingSecondsPanel();
+}
+
+function decreaseRemainingSeconds() {
+    if (remainingSeconds <= 0) return;
+    --remainingSeconds;
+}
+
+function onDecreaseRemainingSecondsReleased() {
+    if (currentState == timerState.RUNNING) return;
+
+    clearInterval(decreasingInterval);
+
+    isDecreasingRemainingSeconds = false;
+    draw();
+}
+
+main();

apps/helloworld/Changelog

@@ -0,0 +1 @@
+0.01: 1st version !

apps/helloworld/README.md

@@ -0,0 +1,47 @@
+# hello, world!
+
+A cross cultural hello world!/hola mundo! app
+The most common testing sentence in several languages ;)
+
+
+## Pictures:
+
+Launcher icon
+
+![](helloworld_icon.png)
+
+Screen - Spanish
+
+![](helloworld_es.png)
+
+Screen - English
+
+![](helloworld_en.png)
+
+Screen - Japanese
+
+![](helloworld_jp.png)
+
+
+
+## Usage
+
+Open and see a hello, World! in the screen 
+interact to change language, color or quit.
+
+## Features
+
+Colours, all inputs , graph, widgets loaded 
+Counter for Times Display
+
+
+## Controls
+
+finger swipe 
+button 1,2 and 3
+touch screen left, center or right
+
+
+## Creator
+
+Daniel Perez

apps/helloworld/app-icon.js

@@ -0,0 +1 @@
+require("heatshrink").decompress(atob("mEw4kA///t0up0upsutsuIm0RiIWUgIXBiAFDC58hC4MRkA0CDgQuOJAQ0FLpoSDDYYukC4YuSC4guSCQouRC4guSR4cSFySQGFyLAFD4Z5UDo4vNJqYuJGBouJGBoNEC6iTGC54MDC6IKFC6KDFC6TsFC9zXRC5a+NPJIWKC5DfFC6QAOC7UgC6wAIEBYXLDBYXMNRQXNbJMBGC8hC6w0NJBIX/C/4XTAEw"))

apps/helloworld/app.js

@@ -0,0 +1,142 @@
+//HolaMundo v2021
+// place your const, vars, functions or classes here
+{
+    var contador=1; 
+    var v_color_statictxt='#e56e06'; //orange RGB format rrggbb 
+    //white,Orange,DarkGreen,Yellow,Maroon,Blue,green,Purple,cyan,olive,DarkCyan,pink
+    var a_colors= Array(0xFFFF,0xFD20,0x03E0,0xFFE0,0x7800,0x001F,0x07E0,0x780F,0x07FF,0x7BE0,0x03EF,0xF81F);
+    var v_color_lines=0xFFFF; //White hex format
+    var v_font1size='32';
+    var v_font2size='12';
+    var v_font3size='12';
+    var v_arraypos=0;
+    var v_acolorpos=0;
+    var a_string1 = Array('hola', 'hello', 'saluton', 'ola','ciao', 'salut','czesc','konnichiwa');
+    var a_string2 = Array('mundo!', 'world!', 'mondo!','mundo!','mondo!','monde!','swiat!','sekai!');
+    var mem=process.memory();
+    }
+            
+    // special function to handle display switch on
+    Bangle.on('lcdPower', (on) => {
+      if (on) {
+          contador=contador+1;
+          PrintHelloWorld();      
+        // call your app function here
+        // If you clear the screen, do Bangle.drawWidgets();    
+      }
+    });
+    
+    //Clear/fill dynamic area except widget area, right and bottom status line
+    function ClearActiveArea(){
+        var colorbackg='#111111';//black 
+        g.setColor(colorbackg); 
+        g.fillRect(0,32,195,150); 
+        g.flip();
+      }
+    
+    //function Graphics.setColor(r, g, b) binary
+    // banglejs.com/reference#l_Graphics_setColor
+    
+    function PrintHelloWorld(){     
+        ClearActiveArea(); //except widgets and bottom
+        
+        console.log("drawing a "+a_string1[v_arraypos]+" "+a_string2[v_arraypos]);
+        
+        g.setColor(a_colors[v_acolorpos]); //dynamic color
+        g.setFont("Vector",35); 
+        g.drawString(a_string1[v_arraypos],2,55); 
+        //line below 2nd string
+        g.drawLine(10, 149, 150, 149);
+        g.flip();
+    
+        g.setColor(a_colors[v_acolorpos+1]); //dynamic color
+        g.drawString(a_string2[v_arraypos],5,85);   
+        g.flip();
+    
+        g.setFont("Vector",v_font3size);
+        g.setColor(0,0,1);  //blue
+        g.drawString("Display count: "+contador ,10,115); 
+        mem=process.memory();
+        //console.log("Mem free/total: "+mem.free+"/"+mem.total);    
+        g.drawString("Free mem: "+mem.free+"/"+mem.total,10,135); 
+        g.flip();    
+    }
+    
+    function PrintMainStaticArea(){ 
+        g.setColor(v_color_statictxt);  
+        g.setFont("Vector",v_font3size);    
+        g.drawString("#for #bangle.js",10,170); 
+        g.drawString("#javascript #espruino",10,185); 
+        
+        var img_obj_RedHi = {
+            width : 40, height : 40, bpp : 4,
+            transparent : 0,
+            buffer : require("heatshrink").decompress(atob("AFkM7vd4EAhoTNhvQhvcgHdAQIAL5oWCFIPdExo+CEoIZCABI0DhvADIZhJL4IXDHRkMEAQmOCYgmOAAIOBHwImNRQgmPHgYmCUIIXMJobfB3jgCWZJNDEga1JYQQQCMYZoJJAJNDBwgTICQPdCY7lDRQx4DVIwTIHYZzEHZATFBwblDCZRKEO5ITFWAbIJCYrHBAAImICYwEB5raKCYwAMCYXc5gADE5hLDAAgTIBJLkBBJAyKHw5hKBRJJKKJSuII5Q0IhqPKCbjRKCc4AgA=="))
+          }
+          g.drawImage(img_obj_RedHi,155,160);
+          g.flip();
+    }
+    
+    
+    //inc var postion for text array
+    function ChangeLang(){
+        if (v_arraypos<a_string1.length-1) v_arraypos++;
+         else v_arraypos=0;
+        //console.log("ChangeLang, Langpos: "+v_arraypos);        
+        PrintHelloWorld();
+    }
+    
+    //inc var postion for color array
+    function ChangeColor(){
+        //console.log("ChangeColor, colpos: "+v_acolorpos);
+        if (v_acolorpos<a_colors.length-2) v_acolorpos++;
+         else v_acolorpos=0;    
+        PrintHelloWorld();
+    }
+    
+    function UserInput(){   
+        Bangle.on('touch', function(button){ 
+            switch(button){
+                case 1:       
+                    ChangeLang();//left
+                         break;
+                case 2:
+                    ChangeColor();//right
+                         break;
+                case 3: 
+                    ChangeColor();
+                  //Bangle.showLauncher();//quit     
+                        break;
+            }  
+        });
+            
+        setWatch(ChangeLang, BTN1, { repeat: true });//func  to quit
+        setWatch(ChangeColor, BTN2, { repeat: true });
+        setWatch(Bangle.showLauncher, BTN3, { repeat: true });  
+        //touchscreen to quit
+        Bangle.on('swipe', dir => {  
+          if(dir == 1) ChangeLang(); //func load() to quit
+          else ChangeLang();
+        });
+    }
+    
+    console.log("**************************");
+    console.log("Log: *** hola mundo app");
+    g.clear();
+      Bangle.loadWidgets();
+      Bangle.drawWidgets();   
+      g.setColor(0,1,0);  //green
+        
+       // top or bottom 24px of the screen (reserved for Widgets) 
+        g.setFontVector(v_font2size).drawString("BTN1", 202,37);  
+        g.setFontVector(v_font2size).drawString("Lang", 202,51); 
+        g.setFontVector(v_font2size).drawString("Color<", 197,110);  
+        g.setFontVector(v_font2size).drawString("BTN2", 202,124);  
+        g.setFontVector(v_font2size).drawString("Swipe <- -> (Lang)", 15,223);  
+        g.setFontVector(v_font2size).drawString("Quit<", 200,209);  
+        g.setFontVector(v_font2size).drawString("BTN3", 201,223);  
+        g.flip();
+      UserInput();
+      PrintMainStaticArea();
+      PrintHelloWorld();
+    

apps/helloworld/helloworld.img

@@ -0,0 +1 @@
+00<EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>>>>><3E><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>>>>>>><3E><><EFBFBD><EFBFBD><EFBFBD><EFBFBD>>>><3E><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>>>>>>>>>><3E><><EFBFBD>>>>>><3E><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>>>>>>>>>><3E><><EFBFBD>>>>>>><3E><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>>>>>>>>>><3E><><EFBFBD>>>>>>><3E><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>>>>>>>>>><3E><><EFBFBD>>>>>>><3E><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>>>>>>>>><3E><><EFBFBD>>>>>>><3E><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>>>>>>>><3E><><EFBFBD>>>>>>><3E><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>>>>>>><3E><><EFBFBD>>>>>>><3E><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>>>>>>><3E><>>>>>>><3E><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>>>>>>>>>>>>><3E><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>>>>>>>>>>><3E><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>>>>>>>>><3E><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>>><3E><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>>>>>>><3E><><EFBFBD><EFBFBD><EFBFBD>>>>>>>>><3E><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>>>>>>><3E><><EFBFBD><EFBFBD><EFBFBD>>>>>>>>>>><3E><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>>>>>>><3E><><EFBFBD><EFBFBD><EFBFBD>>>>>>>>>>>>><3E><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>>>>>>><3E><><EFBFBD><EFBFBD><EFBFBD>>>>>>>>>>>>>>><3E><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>>>>>><3E><><EFBFBD><EFBFBD><EFBFBD><EFBFBD>>>>>>>>>>>>>>><3E><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>>>>><3E><><EFBFBD><EFBFBD><EFBFBD><EFBFBD>>>>>>>>>>>>>>>><3E><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>>>><3E><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>>>>>>>>>>>>>>>><3E><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>><3E><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>>>>>>>>>>>>>>>><3E><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>>><3E><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>>>>>>>>>>>>>>>><3E><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>>>>>>><3E><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>>>>>>>>>>>>>>><3E><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>>>>>>><3E><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>>>>>>>>>>>>>>><3E><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>>>>>>><3E><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>>>>>>>>>>>>><3E><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>>>>>>><3E><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>>>>>>>>>>>><3E><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>>>>>>><3E><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>>>>>>>>><3E><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>>>>>>><3E><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>>>>><3E><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>>>>>>><3E><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>>>>>>><3E><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>>>>>>>><3E><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>>>>>>>>>>>>>>>>>>>>>>>>>><3E><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>>>>>>>>>>>>>>>>>>>>>>>>>>>><3E><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>>>>>>>>>>>>>>>>>>>>>>>>>>>>><3E><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>>>>>>>>>>>>>>>>>>>>>>>>>>>>>><3E><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>>>>>>>>>>>>>>>>>>>>>>>>>>>>>><3E><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>>>>>>>>>>>>>>>>>>>>>>>>>>>>><3E><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>>>>>>>>>>>>>>>>>>>>><3E><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>>>>>>>>>>>>>>>>>>>>><3E><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>>>>>>>>>>>>>>>>>>>>><3E><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>>>>>>>>>>>>>>>>>>>>><3E><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>>>>>>>>>>>>>>>>>>>>><3E><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>>>>>>>>>>>>>>>>>>>>><3E><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>>>>>>>>>>>>>>>>>>>>><3E><><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>

apps/testuserinput/ChangeLog

@@ -1,3 +1,4 @@
 0.01: New App!
 0.02: Tweaks for app loader
 0.03: Fix app icon, add change of colors
+0.04: Improvements and new round check option elements

apps/testuserinput/README.md

@@ -4,12 +4,19 @@ This very basic app, allows to *test the bangle.js input interface*, and display
 
 
 Launcher icon
+
 ![](testUserInput_ss0.png)
+
 1st screen - Help/Intro
+
 ![](testUserInput_ss1.png)
+
 2nd screen - interface and a result
+
 ![](testUserInput_ss2.png)
+
 3rd screen - interface and a result
+
 ![](testUserInput_ss3.png)
 
 

apps/testuserinput/app-icon.js

@@ -1 +1 @@
-require("heatshrink").decompress(atob("MDDCAP//Bv7m/RF8AAAAAAAAAAAAAAAAAAAAAP/AAAAAAAAAAAAAD//8AAAAAAAAAAAAP///AAAAAAAAAAAA////wAAAAAAAAAAA////wAAAAAAAAAAD/9X/8AAAAAAAAAAD/1V/8AAAAAAAAAAD/1V/8AAAAAAAAAAD/1V/8AAAAAAAAAAD/1V/8AAAAAAAAAAA/1V/wAAAAAAAAAAA/1V/wAAAAAAAAAAAP1V/AAAAAAAAAAAAD1V8AAAAAAAAAAAAAFVAAAAAAAAAAAAAAFVAAAAAAAAAAAAAAFVAAAAAAAAAAAAAAFVAAAAAAAAAAAAAAFVlQAAAAAAAAAAAAFVlVVQAAAAAAAAAAFVVVVVUAAAAAAAAAFVVVVVVQAAAAAAAAFVVVVVVQAAAAFYAAFVVVVVVUAAAAFWAAFVVVVVVUAAAAFVgAFVVVVVVUAAAAFVaAlVVVVVVUAAAABVWqlVVVVVVUAAAAAVVqlVVVVVVUAAAAAFValVVVVVVYAAAAABVWlVVVVVVoAAAAAAVVlVVVVVWoAAAAAAFVVVVVVVaoAAAAAAFVVVVVVVqoAAAAAABVVVVVVWqoAAAAAAAVVVVVVqqoAAAAAAAFVVVVWqqoAAAAAAABVVVVaqqoAAAAAAAAVVVVqqqgAAAAAAAAFVVWqqqgAAAAAAAABVVaqqqAAAAAAAAAAFVqqqgAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA"))
+require("heatshrink").decompress(atob("mEwwgjgkUikAWVDCkCkUz+cykQuSkf///zGCUin4XB/8yC6ECFwM+90/GAIXS8fzC6cv//vAIQvS+YvBAIIXT93uC6UAiUzC4UyiAXQiMjC4UhC6MBiIXB8MRd6IwBC4QuRAAQXB8AWTC/4XK8gZUC4PtAQI0SCgYAEDJwXIDBwXRBIIXNBwihIC6YJDC6gKBhoXRhwKC9vdC6IwEC6YwEC6RzLC5gwDC6YwOC8JINC5IwNC5QwMC5QwMC5YwK8AXLGBQXNGBIWMDBIWOAH4AvA="))

apps/testuserinput/app.js

@@ -1,6 +1,5 @@
 /* Test  bangle.js input interface */
  var colbackg='#111111';//black 
- //var coldarkred='#CC3333';
  var colorange='#e56e06'; //RGB format rrggbb
  var v_color_lines=0xFFFF; //White hex format
  var v_color_b_area=colbackg;
@@ -8,76 +7,21 @@
  var v_clicks='0';
  console.log("*** Test input interface ***");
  
+ 
 function ClearActiveArea(){
   g.setColor(colbackg); 
   g.fillRect(0,32,239,239); //fill all screen except widget area
   g.flip();
 }
-function ChangeColorBannerArea(v_color){
- if (v_color=='#111111') v_color='#f3f3f1';
-  else if (v_color=='#f3f3f1') v_color='#51504f';
-    else if (v_color=='#51504f') v_color=0x7800;// Maroon
-      else if (v_color==0x7800) v_color='#111111';
-      return (v_color);  
-}
-function ClearBannerArea(){
-  g.setColor(v_color_b_area); 
-  g.fillRect(50,32,190,85); //fill an specific area
-  g.flip();
-}
- 
-function PrintUserInput(boton){
-  console.log("Pressed touch/BTN",boton);
-  if (v_clicks=='0') PrintAreas();
-  ClearBannerArea();
-  
-    if (boton=='  <---') {
-    var img_off = {
-      width : 48, height : 48, bpp : 2,
-      transparent : 0,
-      palette : new Uint16Array([65535,63968,40283,50781]),
-      buffer : E.toArrayBuffer(atob("AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA//AAAAAAAAAAAAA///9VVVVVVVQAAAD/qq/1VVVVVVVAAAP6qqv9VVVVVVVUAA/qqqv/VVVVVVVVAD+qqq//1VVVVVVVQP6qqq//1VVVVVVVQPqqqr//9VVVVVVVUvqqqr//9VVVVVVVU+qqqv/+uVVVVVVVV+qqqv+quVVVVVVVV+qqq+qqvVVVVVVVV+qqvqqqvVVVVVVVV+qv+qqquVVVVVVVV+r/+qqquVVVVVVVVv//6qqq9VVVVVVVUP//6qqq9VVVVVVVUP//qqqr1VVVVVVVQD//qqqv1VVVVVVVQA/+qqq/VVVVVVVVAAP+qqr9VVVVVVVUAAD/qq/1VVVVVVVAAAA///9VVVVVVVQAAAAA//AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA"))
-    };
-    g.drawImage(img_off,90,35);
-  }
-    else if (boton=='  --->')  {
-      var img_on = {
-      width : 48, height : 48, bpp : 2,
-      transparent : 0,
-      palette : new Uint16Array([65535,36361,27879,40283]),
-      buffer : E.toArrayBuffer(atob("AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA//AAAAABVVVVVqqf///AAAAVVVVVWqn////wAAFVVVVVWqf////8AAVVVVVVap//////ABVVVVVVqr//////wBVVVVVVqn//////8FVVVVVVqv//////8FVVVVVWqf///////VVVVVVWq////////VVVVVVWq////////VVVVVVWq////////VVVVVVWq////////VVVVVVWq////////VVVVVVWq////////FVVVVVWqf///////FVVVVVVqv//////8BVVVVVVqn//////8BVVVVVVar//////wAVVVVVVap//////AAFVVVVVWqf////8AAAVVVVVWqn////wAAABVVVVVqqf///AAAAAAAAAAAAA//AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA"))
-    };
-    g.drawImage(img_on,90,35);  
-  }
-    else  
-  {   //no swipe /slide
-    g.setColor(colorange); 
-    g.setFontVector(32).drawString(boton, 60, 65);
-  }
-  g.flip();    
-  v_clicks++;  
-}
-function PrintBtn1(boton){ 
- console.log("Pressed BTN1");
- if (v_clicks=='0') PrintAreas();
- PrintUserInput("Button1"); 
- v_clicks++;
-}
-
-function PrintBtn2(boton){ 
- console.log("Pressed BTN2");
- v_color_b_area=ChangeColorBannerArea(v_color_b_area);
- if (v_clicks=='0') PrintAreas();
- PrintUserInput("Button2"); 
- v_clicks++;
-}
 
 function PrintHelp(){  
   console.log("********************************");
   console.log("Log: *** Print help in screen");
   ClearActiveArea();     
+  g.setColor(colorange); 
+  g.setFontVector(18).drawString("To test the input, try :",25,90);
+  g.flip();
   g.setColor(0,1,0);  //green      
-  g.setFontVector(v_font1size).drawString("To test the input, try :", 30, 90);
   g.setFontVector(v_font1size).drawString("Swipe right -->", 30, 115);
   g.setFontVector(v_font1size).drawString("Swipe left <--", 30, 130);
   g.setFontVector(v_font1size).drawString("Click Left area", 30, 145);
@@ -89,15 +33,121 @@ function PrintHelp(){
   g.flip();    
 } 
 
+
+function ChangeColorBannerArea(v_color){
+ if (v_color=='#111111') v_color='#f3f3f1';
+  else if (v_color=='#f3f3f1') v_color='#51504f';
+    else if (v_color=='#51504f') v_color=0x7800;// Maroon
+     else if (v_color==0x7800) v_color='#CC3333';//coldarkred
+      else if (v_color=='#CC3333') v_color='#111111';
+      return (v_color);  
+}
+//Clean fill top area with a color
+function ClearBannerArea(){
+  g.setColor(v_color_b_area); 
+  g.fillRect(55,32,185,78); 
+  g.flip();
+}
+ 
+ function DrawRoundOption(area){
+  //draw a img from an Image object
+    var img_obj_check = {
+      width : 30, height : 30, bpp : 4,
+      transparent : 0,
+      palette : new Uint16Array([65535,28436,38872,4838,6951,34711,26355,24242,32630,36792,30517,32598,40953,26323,9129,7016]),
+      buffer : E.toArrayBuffer(atob("AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAADMwiKZmQAAAAAAAAAAAMzMIimZVVUAAAAAAAAADMzCIpmVVViAAAAAAAAAzMwiKZlVVYi7AAAAAAAMzMIimZVVWIu7oAAAAADMzCIpmVVViLu6qgAAAADMwiKZlVVYi7uqoQAAAAzMIimZVVWIu3eqERAAAAzCIpmVVViLtzNxERAAAAwiKZlVVYi7czRxEWAAAAIimZe1WIu3M0cRFmAAAAIpmePqiLtzNHERZmAAAAKZleM+q7czRxEWZtAAAAmZVV4z4XQ0cRFmbdAAAAmVVVjjPjNHERZm3XAAAAlVVYi+MzRxEWZt13AAAAlVWIu640cRFmbdd3AAAABViLu6p3ERZm3XdwAAAABYi7uqoREWZt13dwAAAAAIu7qqERFmbdd3cAAAAAAAu6qhERZm3Xd3AAAAAAAACqoREWZt13dwAAAAAAAAAKERFmbdd3cAAAAAAAAAAAARZm3XdwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA"))
+    };
+   var img_obj_uncheck = {
+      width : 30, height : 30, bpp : 4,
+      transparent : 0,
+      palette : new Uint16Array([65535,63422,9532,13789,59197,57084,34266,28220,63390,65503,61310,61277,57116,55003,61309,40604]),
+      buffer : E.toArrayBuffer(atob("AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAzMzMzMwAAAAAAAAAAADMzf//3MzMAAAAAAAAAAzPxmZkRrzMwAAAAAAAAM3mZmZmRiKczAAAAAAADP5mZmZmRiKpjMAAAAAAzeZmZmZkRiKq3MwAAAAAzGZmZmZkRiKq8MwAAAAM/mZmZmZkYiKtE8iAAAAMxmZmZmZEYiqtEUiAAAAN5mZmZmRGIiqtExyAAAAPxmZmZkRiIqrRMViAAAAPxEREREYiKq7RMViAAAAP4ERERiIiqq0TFViAAAAP4iIiIiIqqtETFViAAAAN6iIiIiqq7RExV1yAAAAM0qqqqqru0RMVd0iAAAAM/uqqru7RETFXdYiAAAAAzS7u7RERMxV3dIgAAAAAzdEREREzFVd3XIgAAAAADNkREzMVVXd1iIAAAAAAAM3VVVVVd3dciAAAAAAAAAzNtVd3d1iIgAAAAAAAAADMidmZnIiIAAAAAAAAAAAAiIiIiIgAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA"))
+    };
+     if (area=='Touch 1') {
+         g.drawImage(img_obj_check,20,80);
+         console.log("Draw option check left");
+        }
+         else g.drawImage(img_obj_uncheck,20,80);
+    if (area=='Touch 2')  {
+        g.drawImage(img_obj_check,190,80);
+        console.log("Draw option check right");
+       }
+        else g.drawImage(img_obj_uncheck,190,80);
+}
+
+function DrawSwitch(swipedir){
+if (swipedir=='  <---') {
+    console.log("Draw switch <--");
+    var img_off = {
+      width : 48, height : 48, bpp : 2,
+      transparent : 0,
+      palette : new Uint16Array([65535,63968,40283,50781]),
+      buffer : E.toArrayBuffer(atob("AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA//AAAAAAAAAAAAA///9VVVVVVVQAAAD/qq/1VVVVVVVAAAP6qqv9VVVVVVVUAA/qqqv/VVVVVVVVAD+qqq//1VVVVVVVQP6qqq//1VVVVVVVQPqqqr//9VVVVVVVUvqqqr//9VVVVVVVU+qqqv/+uVVVVVVVV+qqqv+quVVVVVVVV+qqq+qqvVVVVVVVV+qqvqqqvVVVVVVVV+qv+qqquVVVVVVVV+r/+qqquVVVVVVVVv//6qqq9VVVVVVVUP//6qqq9VVVVVVVUP//qqqr1VVVVVVVQD//qqqv1VVVVVVVQA/+qqq/VVVVVVVVAAP+qqr9VVVVVVVUAAD/qq/1VVVVVVVAAAA///9VVVVVVVQAAAAA//AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA"))
+    };
+    g.drawImage(img_off,99,33);
+  }
+    else if (swipedir=='  --->')  {
+      console.log("Draw switch -->");   
+      var img_on = {
+      width : 48, height : 48, bpp : 2,
+      transparent : 0,
+      palette : new Uint16Array([65535,36361,27879,40283]),
+      buffer : E.toArrayBuffer(atob("AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA//AAAAABVVVVVqqf///AAAAVVVVVWqn////wAAFVVVVVWqf////8AAVVVVVVap//////ABVVVVVVqr//////wBVVVVVVqn//////8FVVVVVVqv//////8FVVVVVWqf///////VVVVVVWq////////VVVVVVWq////////VVVVVVWq////////VVVVVVWq////////VVVVVVWq////////VVVVVVWq////////FVVVVVWqf///////FVVVVVVqv//////8BVVVVVVqn//////8BVVVVVVar//////wAVVVVVVap//////AAFVVVVVWqf////8AAAVVVVVWqn////wAAABVVVVVqqf///AAAAAAAAAAAAA//AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA"))
+    };
+    g.drawImage(img_on,99,33);  
+  }
+} 
+
+
+function PrintUserInput(boton){
+  console.log("Pressed touch/BTN",boton);
+  if (v_clicks=='0') {
+      PrintAreas();
+      v_clicks=1;
+  }
+  ClearBannerArea();
+  
+    if (boton=='  <---') DrawSwitch(boton);
+     else if (boton=='  --->') DrawSwitch(boton);
+      else  
+       {   //a BUTTON or AREA  AND NO swipe /slide
+         if (boton=='Touch 1'||boton=='Touch 2') DrawRoundOption(boton);
+         g.setColor(colorange); 
+         g.setFontVector(30).drawString(boton, 63, 55);
+       }
+  g.flip();       
+}
+
+function PrintBtn1(boton){ 
+ console.log("Pressed BTN1");
+ if (v_clicks=='0'){ 
+      PrintAreas();
+      v_clicks=1; 
+ }
+ PrintUserInput("Button1"); 
+ 
+}
+
+function PrintBtn2(boton){ 
+ console.log("Pressed BTN2");
+ v_color_b_area=ChangeColorBannerArea(v_color_b_area);
+ if (v_clicks=='0'){
+     PrintAreas();
+     v_clicks=1; 
+ }
+ PrintUserInput("Button2");  
+}
+
+
 function PrintAreas(){  
   console.log("********************************");
   console.log("Log: *** Print Areas in screen");
   ClearActiveArea();     
   g.setColor(v_color_lines);
-  g.drawLine(1, 140, 1, 200);//side border
-  g.drawLine(239, 140, 239, 200);//side border
-  g.drawLine(120, 100, 120, 135);//middle separation  top
-  g.drawLine(120, 170, 120, 200);//middle separation  bottom
+  g.drawLine(1, 140, 1, 200);//vline left border
+  g.drawLine(239, 140, 239, 200);//vlide right border
+  g.drawLine(120, 100, 120, 135);//vline middle separation  top
+  g.drawLine(120, 170, 120, 200);//vline middle separation  bottom
   
   //BTN1 
   g.setFontVector(v_font1size).drawString("Color<-", 130,125);