mirror of https://github.com/espruino/BangleApps
dragboard v0.03
thyttan
parent
ac3d0acedc
commit
9e78afb1b1
|
|
@ -1,2 +1,3 @@
|
|||
0.01: New App!
|
||||
0.02: Added some missing code.
|
||||
0.03: Made the code shorter and somewhat more readable by writing some functions. Also made it work as a library where it returns the text once finished. The keyboard is now made to exit correctly when the 'back' event is called. The keyboard now uses theme colors correctly, although it still looks best with dark theme. The numbers row is now solidly green - except for highlights.
|
||||
|
|
|
|||
|
|
@ -9,15 +9,10 @@ Swiping between the different fields is possible!
|
|||
The drag in Dragboard is a nod to the javascript 'drag' event, which is used to select the characters. Also, you can't help but feel somewhat glamorous and risque when this is your keyboard!
|
||||
|
||||
Known bugs:
|
||||
- Initially developed for use with dark theme set on Bangle.js 2 - looks aweful with other themes.
|
||||
- Keyboard is not exited correctly when trying to close the keyboard.
|
||||
- Text is drawn over system back button.
|
||||
- Initially developed for use with dark theme set on Bangle.js 2 - that is still the preferred way to view it although it now works with other themes.
|
||||
- Text does not wrap.
|
||||
|
||||
To do:
|
||||
- Make keyboard theme agnostic.
|
||||
- Keep number/punctuation color one color.
|
||||
- Handle system back button in some way.
|
||||
- Make text wrap and/or scroll up/sideways once available space runs out.
|
||||
- Optimize code. Further split it up in functions. Add 'ram' keyword where suitable.
|
||||
- Optimize code. Further split it up in functions.
|
||||
- Possibly provide a dragboard.settings.js file
|
||||
|
|
|
|||
|
|
@ -7,340 +7,260 @@ exports.input = function(options) {
|
|||
var text = options.text;
|
||||
if ("string"!=typeof text) text="";
|
||||
|
||||
//Draw the alphabet on the screen
|
||||
var BGCOLOR = g.theme.bg;
|
||||
var HLCOLOR = g.theme.fg;
|
||||
var ABCCOLOR = g.toColor(1,0,0);//'#FF0000';
|
||||
var NUMCOLOR = g.toColor(0,1,0);//'#00FF00';
|
||||
var BIGFONT = '6x8:3';
|
||||
var BIGFONTWIDTH = parseInt(BIGFONT.charAt(0)*parseInt(BIGFONT.charAt(-1)));
|
||||
var SMALLFONT = '6x8:1';
|
||||
var SMALLFONTWIDTH = parseInt(SMALLFONT.charAt(0)*parseInt(SMALLFONT.charAt(-1)));
|
||||
|
||||
var abc = 'abcdefghijklmnopqrstuvwxyz'.toUpperCase();
|
||||
var fontSize = "6x8";
|
||||
//var xStep = 6;
|
||||
var abcPadding = (g.getWidth()-6*abc.length)/2;
|
||||
var ABC = 'abcdefghijklmnopqrstuvwxyz'.toUpperCase();
|
||||
var ABCPADDING = (g.getWidth()-6*ABC.length)/2;
|
||||
|
||||
var numPunct = ' 1234567890!?,.- ';
|
||||
var numPunctHidden = ' 1234567890!?,.- ';
|
||||
var numPunctPadding = (g.getWidth()-6*numPunct.length)/2;
|
||||
var NUM = ' 1234567890!?,.- ';
|
||||
var NUMHIDDEN = ' 1234567890!?,.- ';
|
||||
var NUMPADDING = (g.getWidth()-6*NUM.length)/2;
|
||||
|
||||
var rectHeight = 40;
|
||||
|
||||
var bgColor = [0,0,0];
|
||||
var HLColor = [1,1,1];
|
||||
var abcColor = [1,0,0];
|
||||
var numPunctColor = [0,1,0];
|
||||
var delLast;
|
||||
var spaceLast;
|
||||
|
||||
function drawABC() {
|
||||
var delSpaceLast;
|
||||
|
||||
function drawAbcRow() {
|
||||
g.clear();
|
||||
g.setFont(fontSize);
|
||||
g.setColor(1,0,0);
|
||||
g.drawString(abc, abcPadding, g.getHeight()/2);
|
||||
g.setFont(SMALLFONT);
|
||||
g.setColor(ABCCOLOR);
|
||||
g.drawString(ABC, ABCPADDING, g.getHeight()/2);
|
||||
g.fillRect(0, g.getHeight()-26, g.getWidth(), g.getHeight());
|
||||
}
|
||||
|
||||
function drawNumPunct() {
|
||||
g.setFont(fontSize);
|
||||
g.setColor(0,1,1);
|
||||
g.drawString(numPunct, numPunctPadding, g.getHeight()/4);
|
||||
function drawNumRow() {
|
||||
g.setFont(SMALLFONT);
|
||||
g.setColor(NUMCOLOR);
|
||||
g.drawString(NUM, NUMPADDING, g.getHeight()/4);
|
||||
|
||||
g.fillRect(numPunctPadding, g.getHeight()-rectHeight*4/3, g.getWidth()-numPunctPadding, g.getHeight()-rectHeight*2/3);
|
||||
g.fillRect(NUMPADDING, g.getHeight()-rectHeight*4/3, g.getWidth()-NUMPADDING, g.getHeight()-rectHeight*2/3);
|
||||
}
|
||||
|
||||
function initMarker() {
|
||||
g.setColor(0.5,0,0);
|
||||
g.fillRect(5,5,11,13);
|
||||
g.setColor(1,1,1);
|
||||
g.fillRect(3,4+20,11,13+20);
|
||||
g.setColor(HLCOLOR);
|
||||
}
|
||||
|
||||
function updateTopString() {
|
||||
g.setColor(0,0,0);
|
||||
g.fillRect(0,5,176,13);
|
||||
"ram"
|
||||
g.setColor(BGCOLOR);
|
||||
g.fillRect(0,4+20,176,13+20);
|
||||
g.setColor(0.2,0,0);
|
||||
g.fillRect(5,5,5+text.length*6,13);
|
||||
g.fillRect(3,4+20,5+text.length*6,13+20);
|
||||
g.setColor(0.7,0,0);
|
||||
g.fillRect(text.length*6+5,5,10+text.length*6,13);
|
||||
g.fillRect(text.length*6+5,4+20,10+text.length*6,13+20);
|
||||
g.setColor(1,1,1);
|
||||
g.drawString(text, 5, 5);
|
||||
g.drawString(text, 5, 5+20);
|
||||
}
|
||||
|
||||
drawABC();
|
||||
drawNumPunct();
|
||||
drawAbcRow();
|
||||
drawNumRow();
|
||||
initMarker();
|
||||
|
||||
var charHL;
|
||||
var charHLPrev = -10;
|
||||
var numPunctHL;
|
||||
var numPunctHLPrev = -10;
|
||||
var abcHL;
|
||||
var abcHLPrev = -10;
|
||||
var numHL;
|
||||
var numHLPrev = -10;
|
||||
var type = '';
|
||||
var typePrev = '';
|
||||
var largeCharOffset = 6;
|
||||
var letterCase = 1;
|
||||
|
||||
|
||||
function resetChars(char, HLPrev, typePadding, heightDivisor, rowColor) {
|
||||
"ram"
|
||||
// Small character in list
|
||||
g.setColor(rowColor);
|
||||
g.setFont(SMALLFONT);
|
||||
g.drawString(char, typePadding + HLPrev*6, g.getHeight()/heightDivisor);
|
||||
// Large character
|
||||
g.setColor(BGCOLOR);
|
||||
g.fillRect(0,g.getHeight()/3,176,g.getHeight()/3+24);
|
||||
//g.drawString(charSet.charAt(HLPrev), typePadding + HLPrev*6 -largeCharOffset, g.getHeight()/3);; //Old implementation where I find the shape and place of letter to remove instead of just a rectangle.
|
||||
// mark in the list
|
||||
}
|
||||
function showChars(char, HL, typePadding, heightDivisor) {
|
||||
"ram"
|
||||
// mark in the list
|
||||
g.setColor(HLCOLOR);
|
||||
g.setFont(SMALLFONT);
|
||||
if (char != 'del' && char != 'space') g.drawString(char, typePadding + HL*6, g.getHeight()/heightDivisor);
|
||||
// show new large character
|
||||
g.setFont(BIGFONT);
|
||||
g.drawString(char, typePadding + HL*6 -largeCharOffset, g.getHeight()/3);
|
||||
g.setFont(SMALLFONT);
|
||||
}
|
||||
|
||||
function changeCase(abcHL) {
|
||||
g.setColor(BGCOLOR);
|
||||
g.drawString(ABC, ABCPADDING, g.getHeight()/2);
|
||||
if (ABC.charAt(abcHL) == ABC.charAt(abcHL).toUpperCase()) ABC = ABC.toLowerCase();
|
||||
else ABC = ABC.toUpperCase();
|
||||
g.setColor(ABCCOLOR);
|
||||
g.drawString(ABC, ABCPADDING, g.getHeight()/2);
|
||||
}
|
||||
return new Promise((resolve,reject) => {
|
||||
// Interpret touch input
|
||||
Bangle.on('drag', function(event) {
|
||||
g.setFont('6x8');
|
||||
Bangle.setUI({
|
||||
mode: 'custom',
|
||||
back: ()=>{
|
||||
Bangle.setUI();
|
||||
g.clearRect(Bangle.appRect);
|
||||
resolve(text);
|
||||
},
|
||||
drag: function(event) {
|
||||
|
||||
// hide delete sign
|
||||
if (delLast == 1) {
|
||||
g.setColor(0,0,0);
|
||||
g.setFont('6x8:3');
|
||||
g.drawString('del', g.getWidth()/2 -27, g.getHeight()/3);
|
||||
g.setFont('6x8');
|
||||
delLast = 0;
|
||||
}
|
||||
// ABCDEFGHIJKLMNOPQRSTUVWXYZ
|
||||
// Choose character by draging along red rectangle at bottom of screen
|
||||
if (event.y >= ( g.getHeight() - 12 )) {
|
||||
// Translate x-position to character
|
||||
if (event.x < ABCPADDING) { abcHL = 0; }
|
||||
else if (event.x >= 176-ABCPADDING) { abcHL = 25; }
|
||||
else { abcHL = Math.floor((event.x-ABCPADDING)/6); }
|
||||
|
||||
//hide space sign
|
||||
if (spaceLast == 1) {
|
||||
g.setColor(0,0,0);
|
||||
g.setFont('6x8:3');
|
||||
g.drawString('space', g.getWidth()/2 -6*3*5/2, g.getHeight()/3);
|
||||
g.setFont('6x8');
|
||||
spaceLast = 0;
|
||||
}
|
||||
// Datastream for development purposes
|
||||
//print(event.x, event.y, event.b, ABC.charAt(abcHL), ABC.charAt(abcHLPrev));
|
||||
|
||||
// Unmark previous character and mark the current one...
|
||||
// Handling switching between letters and numbers/punctuation
|
||||
if (typePrev != 'abc') resetChars(NUM.charAt(numHLPrev), numHLPrev, NUMPADDING, 4, NUMCOLOR);
|
||||
|
||||
// ABCDEFGHIJKLMNOPQRSTUVWXYZ
|
||||
// Choose character by draging along red rectangle at bottom of screen
|
||||
if (event.y >= ( g.getHeight() - 12 )) {
|
||||
// Translate x-position to character
|
||||
if (event.x < abcPadding) { charHL = 0; }
|
||||
else if (event.x >= 176-abcPadding) { charHL = 25; }
|
||||
else { charHL = Math.floor((event.x-abcPadding)/6); }
|
||||
|
||||
// Datastream for development purposes
|
||||
//print(event.x, event.y, event.b, abc.charAt(charHL), abc.charAt(charHLPrev));
|
||||
|
||||
// Unmark previous character and mark the current one...
|
||||
// Handling switching between letters and numbers/punctuation
|
||||
if (typePrev != 'abc') {
|
||||
// Small character in list
|
||||
g.setColor(0,1,0);
|
||||
g.drawString(numPunct.charAt(numPunctHLPrev), numPunctPadding + numPunctHLPrev*6, g.getHeight()/4);
|
||||
// Large character
|
||||
g.setColor(0,0,0);
|
||||
g.setFont('6x8:3');
|
||||
g.drawString(numPunct.charAt(numPunctHLPrev), numPunctPadding + numPunctHLPrev*6 -largeCharOffset, g.getHeight()/3);
|
||||
g.setFont('6x8');
|
||||
}
|
||||
|
||||
if (charHL != charHLPrev) {
|
||||
// unmark in the list
|
||||
g.setColor(1,0,0);
|
||||
g.drawString(abc.charAt(charHLPrev), abcPadding + charHLPrev*6, g.getHeight()/2);
|
||||
// hide previous large character
|
||||
g.setColor(0,0,0);
|
||||
g.fillRect(0,g.getHeight()/3,176,g.getHeight()/3+24);
|
||||
g.setColor([0,0,0]);
|
||||
g.setFont('6x8:3');
|
||||
g.drawString(abc.charAt(charHLPrev), abcPadding + charHLPrev*6 -largeCharOffset, g.getHeight()/3);
|
||||
g.setFont('6x8');
|
||||
// mark in the list
|
||||
g.setColor(1,1,1);
|
||||
g.setFont('6x8');
|
||||
g.drawString(abc.charAt(charHL), abcPadding + charHL*6, g.getHeight()/2);
|
||||
// show new large character
|
||||
//g.setColor(1,1,1);
|
||||
g.setFont('6x8:3');
|
||||
g.drawString(abc.charAt(charHL), abcPadding + charHL*6 -largeCharOffset, g.getHeight()/3);
|
||||
g.setFont('6x8');
|
||||
}
|
||||
// Print string at top of screen
|
||||
if (event.b == 0) {
|
||||
text = text + abc.charAt(charHL);
|
||||
updateTopString();
|
||||
|
||||
// Autoswitching letter case
|
||||
if (abc.charAt(charHL) == abc.charAt(charHL).toUpperCase()) {
|
||||
g.setColor(0,0,0);
|
||||
g.drawString(abc, abcPadding, g.getHeight()/2);
|
||||
abc = abc.toLowerCase();
|
||||
g.setColor(1,0,0);
|
||||
g.drawString(abc, abcPadding, g.getHeight()/2);
|
||||
letterCase = 0
|
||||
}
|
||||
//print(text);
|
||||
}
|
||||
// Update previous character to current one
|
||||
charHLPrev = charHL;
|
||||
typePrev = 'abc';
|
||||
}
|
||||
|
||||
// 12345678901234567890
|
||||
// Choose number or puctuation by draging on green rectangle
|
||||
else if ((event.y < ( g.getHeight() - 12 )) && (event.y > ( g.getHeight() - 52 ))) {
|
||||
// Translate x-position to character
|
||||
if (event.x < numPunctPadding) { numPunctHL = 0; }
|
||||
else if (event.x > 176-numPunctPadding) { numPunctHL = numPunct.length-1; }
|
||||
else { numPunctHL = Math.floor((event.x-numPunctPadding)/6); }
|
||||
|
||||
// Datastream for development purposes
|
||||
//print(event.x, event.y, event.b, numPunct.charAt(numPunctHL), numPunct.charAt(numPunctHLPrev));
|
||||
|
||||
// Unmark previous character and mark the current one...
|
||||
// Handling switching between letters and numbers/punctuation
|
||||
if (typePrev != 'numPunct') {
|
||||
// Small character in list
|
||||
g.setColor(1,0,0);
|
||||
g.drawString(abc.charAt(charHLPrev), abcPadding + charHLPrev*6, g.getHeight()/2);
|
||||
// Large character
|
||||
g.setColor(0,0,0);
|
||||
g.setFont('6x8:3');
|
||||
g.drawString(abc.charAt(charHLPrev), abcPadding + charHLPrev*6 -largeCharOffset, g.getHeight()/3);
|
||||
g.setFont('6x8');
|
||||
}
|
||||
if (numPunctHL != numPunctHLPrev) {
|
||||
// unmark in the list
|
||||
g.setColor(0,1,0);
|
||||
g.drawString(numPunct.charAt(numPunctHLPrev), numPunctPadding + numPunctHLPrev*6, g.getHeight()/4);
|
||||
// hide previous large character
|
||||
g.setColor(0,0,0);
|
||||
g.fillRect(0,g.getHeight()/3,176,g.getHeight()/3+24);
|
||||
g.setColor(0,0,0);
|
||||
g.setFont('6x8:3');
|
||||
g.drawString(numPunct.charAt(numPunctHLPrev), numPunctPadding + numPunctHLPrev*6 -largeCharOffset, g.getHeight()/3);
|
||||
g.setFont('6x8');
|
||||
// mark in the list
|
||||
g.setColor(1,1,1);
|
||||
g.setFont('6x8');
|
||||
g.drawString(numPunct.charAt(numPunctHL), numPunctPadding + numPunctHL*6, g.getHeight()/4);
|
||||
// show new large character
|
||||
//g.setColor(1,1,1);
|
||||
g.setFont('6x8:3');
|
||||
g.drawString(numPunct.charAt(numPunctHL), numPunctPadding + numPunctHL*6 -largeCharOffset, g.getHeight()/3);
|
||||
g.setFont('6x8');
|
||||
}
|
||||
// Print string at top of screen
|
||||
if (event.b == 0) {
|
||||
g.setColor(1,1,1);
|
||||
// Backspace if releasing before list of numbers/punctuation
|
||||
if (event.x < numPunctPadding) {
|
||||
// show delete sign
|
||||
g.setColor(1,1,1);
|
||||
g.setFont('6x8:3');
|
||||
g.drawString('del', g.getWidth()/2 -27, g.getHeight()/3);
|
||||
g.setFont('6x8');
|
||||
delLast = 1;
|
||||
|
||||
text = text.slice(0, -1);
|
||||
updateTopString();
|
||||
//print(text);
|
||||
}
|
||||
// Append space if releasing after list of numbers/punctuation
|
||||
else if (event.x > g.getWidth()-numPunctPadding) {
|
||||
//show space sign
|
||||
g.setColor(1,1,1);
|
||||
g.setFont('6x8:3');
|
||||
g.drawString('space', g.getWidth()/2 -6*3*5/2, g.getHeight()/3);
|
||||
g.setFont('6x8');
|
||||
spaceLast = 1;
|
||||
|
||||
text = text + ' ';
|
||||
updateTopString();
|
||||
//print(text);
|
||||
}
|
||||
// Append selected number/punctuation
|
||||
else {
|
||||
text = text + numPunctHidden.charAt(numPunctHL);
|
||||
if (abcHL != abcHLPrev) {
|
||||
resetChars(ABC.charAt(abcHLPrev), abcHLPrev, ABCPADDING, 2, ABCCOLOR);
|
||||
showChars(ABC.charAt(abcHL), abcHL, ABCPADDING, 2);
|
||||
}
|
||||
// Print string at top of screen
|
||||
if (event.b == 0) {
|
||||
text = text + ABC.charAt(abcHL);
|
||||
updateTopString();
|
||||
|
||||
// Autoswitching letter case
|
||||
if ((text.charAt(text.length-1) == '.') || (text.charAt(text.length-1) == '!')) {
|
||||
g.setColor(0,0,0);
|
||||
g.drawString(abc, abcPadding, g.getHeight()/2);
|
||||
abc = abc.toUpperCase();
|
||||
g.setColor(1,0,0);
|
||||
g.drawString(abc, abcPadding, g.getHeight()/2);
|
||||
letterCase = 1;
|
||||
|
||||
}
|
||||
//print(text);
|
||||
if (ABC.charAt(abcHL) == ABC.charAt(abcHL).toUpperCase()) changeCase(abcHL);
|
||||
}
|
||||
// Update previous character to current one
|
||||
abcHLPrev = abcHL;
|
||||
typePrev = 'abc';
|
||||
}
|
||||
// Update previous character to current one
|
||||
numPunctHLPrev = numPunctHL;
|
||||
typePrev = 'numPunct';
|
||||
}
|
||||
// Make a space or backspace by swiping right or left on screen above green rectangle
|
||||
else {
|
||||
if (event.b == 0) {
|
||||
g.setColor(1,1,1);
|
||||
if (event.x < g.getWidth()/2) {
|
||||
// unmark character in the list
|
||||
g.setColor(1,0,0);
|
||||
g.drawString(abc.charAt(charHLPrev), abcPadding + charHLPrev*6, g.getHeight()/2);
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
// unmark number/punctuation in the list
|
||||
g.setColor(0,1,0);
|
||||
g.drawString(numPunct.charAt(numPunctHLPrev), numPunctPadding + numPunctHLPrev*6, g.getHeight()/4);
|
||||
// 12345678901234567890
|
||||
// Choose number or puctuation by draging on green rectangle
|
||||
else if ((event.y < ( g.getHeight() - 12 )) && (event.y > ( g.getHeight() - 52 ))) {
|
||||
// Translate x-position to character
|
||||
if (event.x < NUMPADDING) { numHL = 0; }
|
||||
else if (event.x > 176-NUMPADDING) { numHL = NUM.length-1; }
|
||||
else { numHL = Math.floor((event.x-NUMPADDING)/6); }
|
||||
|
||||
// hide previous large character
|
||||
g.setColor([0,0,0]);
|
||||
g.setFont('6x8:3');
|
||||
g.drawString(abc.charAt(charHLPrev), abcPadding + charHLPrev*6 -largeCharOffset, g.getHeight()/3);
|
||||
// Datastream for development purposes
|
||||
//print(event.x, event.y, event.b, NUM.charAt(numHL), NUM.charAt(numHLPrev));
|
||||
|
||||
// hide previous large character
|
||||
g.setColor(0,0,0);
|
||||
g.setFont('6x8:3');
|
||||
g.drawString(numPunct.charAt(numPunctHLPrev), numPunctPadding + numPunctHLPrev*6 -largeCharOffset, g.getHeight()/3);
|
||||
|
||||
// show delete sign
|
||||
g.setColor(1,1,1);
|
||||
g.setFont('6x8:3');
|
||||
g.drawString('del', g.getWidth()/2 -27, g.getHeight()/3);
|
||||
g.setFont('6x8');
|
||||
delLast = 1;
|
||||
|
||||
// Backspace and draw string upper right corner
|
||||
text = text.slice(0, -1);
|
||||
updateTopString();
|
||||
if (text.length==0) {
|
||||
g.setColor(0,0,0);
|
||||
g.drawString(abc, abcPadding, g.getHeight()/2);
|
||||
abc = abc.toUpperCase();
|
||||
g.setColor(1,0,0);
|
||||
g.drawString(abc, abcPadding, g.getHeight()/2);
|
||||
letterCase = 1;
|
||||
// Unmark previous character and mark the current one...
|
||||
// Handling switching between letters and numbers/punctuation
|
||||
if (typePrev != 'num') resetChars(ABC.charAt(abcHLPrev), abcHLPrev, ABCPADDING, 2, ABCCOLOR);
|
||||
|
||||
if (numHL != numHLPrev) {
|
||||
resetChars(NUM.charAt(numHLPrev), numHLPrev, NUMPADDING, 4, NUMCOLOR);
|
||||
showChars(NUM.charAt(numHL), numHL, NUMPADDING, 4);
|
||||
}
|
||||
// Print string at top of screen
|
||||
if (event.b == 0) {
|
||||
g.setColor(HLCOLOR);
|
||||
// Backspace if releasing before list of numbers/punctuation
|
||||
if (event.x < NUMPADDING) {
|
||||
// show delete sign
|
||||
showChars('del', 0, g.getWidth()/2 +6 -27 , 4);
|
||||
delSpaceLast = 1;
|
||||
text = text.slice(0, -1);
|
||||
updateTopString();
|
||||
//print(text);
|
||||
}
|
||||
// Append space if releasing after list of numbers/punctuation
|
||||
else if (event.x > g.getWidth()-NUMPADDING) {
|
||||
//show space sign
|
||||
showChars('space', 0, g.getWidth()/2 +6 -6*3*5/2 , 4);
|
||||
delSpaceLast = 1;
|
||||
text = text + ' ';
|
||||
updateTopString();
|
||||
//print(text);
|
||||
}
|
||||
// Append selected number/punctuation
|
||||
else {
|
||||
text = text + NUMHIDDEN.charAt(numHL);
|
||||
updateTopString();
|
||||
|
||||
// Autoswitching letter case
|
||||
if ((text.charAt(text.length-1) == '.') || (text.charAt(text.length-1) == '!')) changeCase();
|
||||
}
|
||||
//print(text, 'undid');
|
||||
}
|
||||
else {
|
||||
// unmark character in the list
|
||||
g.setColor(1,0,0);
|
||||
g.drawString(abc.charAt(charHLPrev), abcPadding + charHLPrev*6, g.getHeight()/2);
|
||||
// Update previous character to current one
|
||||
numHLPrev = numHL;
|
||||
typePrev = 'num';
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
// Make a space or backspace by swiping right or left on screen above green rectangle
|
||||
else {
|
||||
if (event.b == 0) {
|
||||
g.setColor(HLCOLOR);
|
||||
if (event.x < g.getWidth()/2) {
|
||||
resetChars(ABC.charAt(abcHLPrev), abcHLPrev, ABCPADDING, 2, ABCCOLOR);
|
||||
resetChars(NUM.charAt(numHLPrev), numHLPrev, NUMPADDING, 4, NUMCOLOR);
|
||||
|
||||
// unmark number/punctuation in the list
|
||||
g.setColor(0,1,0);
|
||||
g.drawString(numPunct.charAt(numPunctHLPrev), numPunctPadding + numPunctHLPrev*6, g.getHeight()/4);
|
||||
// show delete sign
|
||||
showChars('del', 0, g.getWidth()/2 +6 -27 , 4);
|
||||
delSpaceLast = 1;
|
||||
|
||||
// hide previous large character
|
||||
g.setColor([0,0,0]);
|
||||
g.setFont('6x8:3');
|
||||
g.drawString(abc.charAt(charHLPrev), abcPadding + charHLPrev*6 -largeCharOffset, g.getHeight()/3);
|
||||
// Backspace and draw string upper right corner
|
||||
text = text.slice(0, -1);
|
||||
updateTopString();
|
||||
if (text.length==0) changeCase(abcHL);
|
||||
//print(text, 'undid');
|
||||
}
|
||||
else {
|
||||
resetChars(ABC.charAt(abcHLPrev), abcHLPrev, ABCPADDING, 2, ABCCOLOR);
|
||||
resetChars(NUM.charAt(numHLPrev), numHLPrev, NUMPADDING, 4, NUMCOLOR);
|
||||
|
||||
// hide previous large character
|
||||
g.setColor(0,0,0);
|
||||
g.setFont('6x8:3');
|
||||
g.drawString(numPunct.charAt(numPunctHLPrev), numPunctPadding + numPunctHLPrev*6 -largeCharOffset, g.getHeight()/3);
|
||||
//show space sign
|
||||
showChars('space', 0, g.getWidth()/2 +6 -6*3*5/2 , 4);
|
||||
delSpaceLast = 1;
|
||||
|
||||
//show space sign
|
||||
g.setColor(1,1,1);
|
||||
g.setFont('6x8:3');
|
||||
g.drawString('space', g.getWidth()/2 -6*3*5/2, g.getHeight()/3);
|
||||
g.setFont('6x8');
|
||||
spaceLast = 1;
|
||||
|
||||
// Append space and draw string upper right corner
|
||||
text = text + numPunctHidden.charAt(0);
|
||||
updateTopString();
|
||||
//print(text, 'made space');
|
||||
// Append space and draw string upper right corner
|
||||
text = text + NUMHIDDEN.charAt(0);
|
||||
updateTopString();
|
||||
//print(text, 'made space');
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
return new Promise((resolve,reject) => {
|
||||
});
|
||||
});
|
||||
/* return new Promise((resolve,reject) => {
|
||||
Bangle.setUI({mode:"custom", back:()=>{
|
||||
Bangle.setUI();
|
||||
g.clearRect(Bangle.appRect);
|
||||
Bangle.setUI();
|
||||
resolve(text);
|
||||
}});
|
||||
});
|
||||
}); */
|
||||
|
||||
};
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
{ "id": "dragboard",
|
||||
"name": "Dragboard",
|
||||
"version":"0.02",
|
||||
"version":"0.03",
|
||||
"description": "A library for text input via swiping keyboard",
|
||||
"icon": "app.png",
|
||||
"type":"textinput",
|
||||
|
|
|
|||
Binary file not shown.
|
Before Width: | Height: | Size: 2.2 KiB After Width: | Height: | Size: 2.4 KiB |
Loading…
Reference in New Issue