Merge pull request #1741 from frigis1/tapkb2

New app - Tap Keyboard

apps/tapkb/ChangeLog

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

apps/tapkb/README.md

@@ -0,0 +1,7 @@
+# Tap Keyboard
+This was originally designed for the Noteify app. With the new keyboard system in place, it has become its own keyboard app.
+
+## Usage
+* Swipe left or right to cycle between the alphabet, numerals, and symbols.
+* Hitting "caps" once will capitalize one character only. Hitting "caps" twice activates caps lock, and all subsequent characters will be capitalized until you hit "caps" again.
+* "New line" is represented by a pilcrow (¶). When you hit the back button, these symbols will be converted into newline.

apps/tapkb/app-icon.js

@@ -0,0 +1 @@
+atob("MDCBAf////////////////AAAAAAD8AAAAAAA4AAAAAAAYAAAAAAAQf/////4A//////8A//////8A//////8A//////8A//////8A///8P/8A///8P/8A///8P/8A///8P/8A///8P/8A///8P/8A///8P//w///8P//w///8MP/w///8MP/w///8MMPw///8MMPw///8AMMA///8AAMA///8AAAA///8AAAA///8OAAA///8P+AA//wcP/8Af/AEP/8IA+AAP/8IA+AAP/8MA+DAP/8PA+BgP/8P//B4P/8P//g8P/8P//wfP/8P//4Pv/8P//8H//8P//8D//8P//+D//8P///B//4P///gAAAf///wAAAf///4AAA////8AADw==")

apps/tapkb/lib.js

@@ -0,0 +1,162 @@
+exports.input = function(options) {
+  options = options||{};
+  var text = options.text;
+  if ("string"!=typeof text) text="";
+
+var layer = 0;
+var caps = 0;
+
+class keyPad {
+  constructor(x1, y1, x2, y2, func) {
+    this.x1 = x1;
+    this.y1 = y1;
+    this.x2 = x2;
+    this.y2 = y2;
+    this.func = !func ? "" : func;
+  }
+
+  draw() {
+    g.setColor(g.theme.fg).drawRect(this.x1, this.y1, this.x2, this.y2).clearRect(this.x1+1, this.y1+1, this.x2-1, this.y2-1).setFont("6x8",2).setFontAlign(0, 0, 0).drawString(this.func, (((this.x2-this.x1)/2)+this.x1), (((this.y2-this.y1)/2)+this.y1));
+  }
+
+  onTouch(xy) {
+    if (this.func == "space") text += " ";
+    else if (this.func == "<-") text = text.slice(0, -1);
+    else if (this.func == "new\nline") text += String.fromCharCode(182);
+    else if (this.func == "caps") {
+      caps = 1;
+      renderKeys();
+    }
+    else if (this.func == "Caps") {
+      caps = 2;
+      renderKeys();
+    }
+    else if (this.func == "CAPS") {
+      caps = 0;
+      renderKeys();
+    }
+    else {
+      text += this.func;
+      if (caps == 1) caps = 0;
+    }
+    g.clearRect(25, 0, g.getWidth(), 25).setFontAlign(-1, -1).drawString(text.substring(text.length-12, text.length)+"_", 25, 7);
+  }
+}
+
+function renderKeys() {
+  var a;
+  var i;
+  if (layer == 0) {
+    if (caps == 0) {
+      a = ["a", "b", "c", "d", "e", "f", "g", "h", "i", "caps", "space", "<-"];
+    }
+    else a = ["A", "B", "C", "D", "E", "F", "G", "H", "I", "Caps", "space", "<-"];
+    if (caps == 2) a[9] = "CAPS";
+    for (i = 0; i < a.length; i++) {
+      pad[i].func = a[i];
+    }
+  }
+  else if (layer == 1) {
+    if (caps == 0) {
+      a = ["j", "k", "l", "m", "n", "o", "p", "q", "r", "caps", "space", "<-"];
+    }
+    else a = ["J", "K", "L", "M", "N", "O", "P", "Q", "R", "Caps", "space", "<-"];
+    if (caps == 2) a[9] = "CAPS";
+    for (i = 0; i < a.length; i++) {
+      pad[i].func = a[i];
+    }
+  }
+  else if (layer == 2) {
+    if (caps == 0) {
+      a = ["s", "t", "u", "v", "w", "x", "y", "z", "0", "caps", "space", "<-"];
+    }
+    else a = ["S", "T", "U", "V", "W", "X", "Y", "Z", "0", "Caps", "space", "<-"];
+    if (caps == 2) a[9] = "CAPS";
+    for (i = 0; i < a.length; i++) {
+      pad[i].func = a[i];
+    }
+  }
+  else if (layer == 3) {
+    if (caps == 0) {
+      a = ["1", "2", "3", "4", "5", "6", "7", "8", "9", "caps", "space", "<-"];
+    }
+    else a = ["1", "2", "3", "4", "5", "6", "7", "8", "9", "Caps", "space", "<-"];
+    if (caps == 2) a[9] = "CAPS";
+    for (i = 0; i < a.length; i++) {
+      pad[i].func = a[i];
+    }
+  }
+  else if (layer == 4) {
+    if (caps == 0) {
+      a = [".", ",", "?", "!", "(", ")", "-", "\'", "new\nline", "caps", "space", "<-"];
+    }
+    else a = ["-", "+", "/", "*", ":", "#", "$", "%", "new\nline", "Caps", "space", "<-"];
+    if (caps == 2) a[9] = "CAPS";
+    for (i = 0; i < a.length; i++) {
+      pad[i].func = a[i];
+    }
+  }
+
+  for (var j = 0; j < pad.length; j++) {
+    pad[j].draw();
+  }
+}
+
+var pad = [];
+pad[0] = new keyPad(0, 29, 57, 64);
+pad[1] = new keyPad(59, 29, 116, 64);
+pad[2] = new keyPad(118, 29, 175, 64);
+pad[3] = new keyPad(0, 66, 57, 101);
+pad[4] = new keyPad(59, 66, 116, 101);
+pad[5] = new keyPad(118, 66, 175, 101);
+pad[6] = new keyPad(0, 103, 57, 138);
+pad[7] = new keyPad(59, 103, 116, 138);
+pad[8] = new keyPad(118, 103, 175, 138);
+pad[9] = new keyPad(0, 140, 57, 175);
+pad[10] = new keyPad(59, 140, 116, 175);
+pad[11] = new keyPad(118, 140, 175, 175);
+g.clear();
+renderKeys();
+
+var drag;
+var e;
+
+return new Promise((resolve,reject) => {
+
+  Bangle.setUI({mode:"custom", drag:e=>{
+  if (!drag) { // start dragging
+    drag = {x: e.x, y: e.y};
+  } 
+  else if (!e.b) { // released
+    const dx = e.x-drag.x, dy = e.y-drag.y;
+    drag = null;
+    //horizontal swipes
+    if (Math.abs(dx)>Math.abs(dy)+10) {
+      //swipe left
+      if (dx<0) layer == 4 ? layer = 0 : layer++;
+      //swipe right
+      if (dx>0) layer == 0 ? layer = 4 : layer--;
+    }
+  }
+  renderKeys();
+  },touch:(button, xy)=>{
+    for (var i = 0; i < pad.length; i++) {
+      if ((xy.x >= pad[i].x1) && (xy.x <= pad[i].x2) && (xy.y >= pad[i].y1) && (xy.y <= pad[i].y2)) {
+        pad[i].onTouch(xy);
+        i = pad.length;
+      }
+    }
+  },back:()=>{
+    Bangle.setUI();
+    g.clear();
+    resolve(text.replace(new RegExp(String.fromCharCode(182), 'g'), '\n'));
+  }});
+  g.clearRect(25, 0, g.getWidth(), 25).setColor(g.theme.fg).setFont("6x8", 2);
+  if (text == "") g.setFontAlign(0, -1).drawString("<-Swipe->", g.getWidth()/2, 7);
+  else {
+    text = text.replace(/\n/g, String.fromCharCode(182));
+    g.setFontAlign(-1, -1).drawString(text.substring(text.length-12, text.length)+"_", 25, 7);
+  }
+});
+
+};

apps/tapkb/metadata.json

@@ -0,0 +1,15 @@
+{
+  "id": "tapkb",
+  "name": "Tap keyboard",
+  "version":"0.01",
+  "description": "An onscreen tap keyboard.",
+  "icon": "app.png",
+  "type":"textinput",
+  "tags": "keyboard",
+  "supports" : ["BANGLEJS2"],
+  "readme": "README.md",
+  "screenshots": [{"url":"screenshot.png"}],
+  "storage": [
+    {"name":"textinput","url":"lib.js"}
+  ]
+}