diff --git a/apps.json b/apps.json index 69e12de86..20f41b072 100644 --- a/apps.json +++ b/apps.json @@ -5102,6 +5102,24 @@ {"name":"ltherm.img","url":"icon.js","evaluate":true} ] }, + { + "id": "touchtimer", + "name": "Touch Timer", + "shortName": "Touch Timer", + "version": "0.02", + "description": "Quickly and easily create a timer with touch-only input. The time can be easily set with a number pad.", + "icon": "app.png", + "tags": "tools", + "supports": ["BANGLEJS2"], + "readme": "README.md", + "screenshots": [{"url":"0_light_timer_edit.png"},{"url":"1_light_timer_ready.png"},{"url":"2_light_timer_running.png"},{"url":"3_light_timer_finished.png"}], + "storage": [ + { "name": "touchtimer.app.js", "url": "app.js" }, + { "name":"touchtimer.settings.js", "url":"settings.js"}, + { "name": "touchtimer.img", "url": "app-icon.js", "evaluate": true } + ], + "data": [{"name":"touchtimer.data.json"}] + }, { "id": "teatimer", "name": "Tea Timer", diff --git a/apps/touchtimer/0_dark_timer_edit.png b/apps/touchtimer/0_dark_timer_edit.png new file mode 100644 index 000000000..2160ef38d Binary files /dev/null and b/apps/touchtimer/0_dark_timer_edit.png differ diff --git a/apps/touchtimer/0_light_timer_edit.png b/apps/touchtimer/0_light_timer_edit.png new file mode 100644 index 000000000..361223af9 Binary files /dev/null and b/apps/touchtimer/0_light_timer_edit.png differ diff --git a/apps/touchtimer/1_dark_timer_ready.png b/apps/touchtimer/1_dark_timer_ready.png new file mode 100644 index 000000000..236aef7f9 Binary files /dev/null and b/apps/touchtimer/1_dark_timer_ready.png differ diff --git a/apps/touchtimer/1_light_timer_ready.png b/apps/touchtimer/1_light_timer_ready.png new file mode 100644 index 000000000..5e2ca3c9d Binary files /dev/null and b/apps/touchtimer/1_light_timer_ready.png differ diff --git a/apps/touchtimer/2_dark_timer_running.png b/apps/touchtimer/2_dark_timer_running.png new file mode 100644 index 000000000..4de00cc61 Binary files /dev/null and b/apps/touchtimer/2_dark_timer_running.png differ diff --git a/apps/touchtimer/2_light_timer_running.png b/apps/touchtimer/2_light_timer_running.png new file mode 100644 index 000000000..2a0d314f4 Binary files /dev/null and b/apps/touchtimer/2_light_timer_running.png differ diff --git a/apps/touchtimer/3_dark_timer_finished.png b/apps/touchtimer/3_dark_timer_finished.png new file mode 100644 index 000000000..c6dd77b82 Binary files /dev/null and b/apps/touchtimer/3_dark_timer_finished.png differ diff --git a/apps/touchtimer/3_light_timer_finished.png b/apps/touchtimer/3_light_timer_finished.png new file mode 100644 index 000000000..18ee015e3 Binary files /dev/null and b/apps/touchtimer/3_light_timer_finished.png differ diff --git a/apps/touchtimer/ChangeLog b/apps/touchtimer/ChangeLog new file mode 100644 index 000000000..01904c6ea --- /dev/null +++ b/apps/touchtimer/ChangeLog @@ -0,0 +1,2 @@ +0.01: Initial creation of the touch timer app +0.02: Add settings menu \ No newline at end of file diff --git a/apps/touchtimer/README.md b/apps/touchtimer/README.md new file mode 100644 index 000000000..39afba8e5 --- /dev/null +++ b/apps/touchtimer/README.md @@ -0,0 +1,29 @@ +# Touch Timer + +Quickly and easily create a timer with touch-only input. The time can be easily set with a number pad. + +## How to + +- First input the timer time via the input buttons +- If you need to correct the time, press "<-". +- If the timer time is correct, press "OK". +- If you have accidentially pressed "OK", press "STOP" to go cancel. +- Press "START" to start the timer, if the time is correct. +- The timer will run the time until 0. Once it hits zero the watch will buzz for 1 second every 1 seconds for a total of 3 times, or until you press "STOP" +- -> The number of buzzes, the buzz duration, and the pause between buzzes is configurable in the settings app + +## Screenshots + +### Light Theme + +![](0_light_timer_edit.png) +![](1_light_timer_ready.png) +![](2_light_timer_running.png) +![](3_light_timer_finished.png) + +### Dark Theme + +![](0_dark_timer_edit.png) +![](1_dark_timer_ready.png) +![](2_dark_timer_running.png) +![](3_dark_timer_finished.png) \ No newline at end of file diff --git a/apps/touchtimer/app-icon.js b/apps/touchtimer/app-icon.js new file mode 100644 index 000000000..d58446bcc --- /dev/null +++ b/apps/touchtimer/app-icon.js @@ -0,0 +1 @@ +require("heatshrink").decompress(atob("mEwwkE/4A3mUQIAMRkYWQkBaFiQWQgMjn8zGYUDCxkxFA3zD4MfCxXygECMAURiReCDAM/IpUBFIJ2CAAIeB+ZJKBYI8BCwMBiABBDARSBC5EwFwMwEwUwh5FCEIJhJiEfGIIXC+IQBSwQeBNYR1Gn4xB+MDDYITBiEzFoIOCC4vwEAIxBAwQzBAoQtCBgaNEh4iEAwMwRQXxHgRnBLwsvFQJdCFoIGBl55DH4QAEEIK/BC4KjBC4RECiED+RnBXooxCn4uBKwPwgIiB+fxgQQCRwgeBLwRbBkAXBh5yCBwoACEAoVBC4fwJ4I+DC5EjJQQXDBYP/kJWDC4qmBBYYXFfIQXKiQvUL6AXGR5LzBR4YXIBAS/BC4UCeAQOFC4rvDN4LvCFYMgd4IXJmEABgMxC4bWBiADDC45EBZIRHBMYINCBQQXIIgIkB//wgIFDmBKBC5QNB+UDboU/kEzgCRBC5QTBNwUxLoZRDC5J5EmAqBkEAiYMCC5XzFIMRkECAgILDC5YYDAAUBIoQXNDAMhiMRkYJEC5oAKC7qKBACDfCK4IWRPwjqBkczAB0yGAcQGgYAOmByCfAYAP+MBC4QWR//yC4ciACMhC4YATC4T9BACUSLiQAdA=")) \ No newline at end of file diff --git a/apps/touchtimer/app.js b/apps/touchtimer/app.js new file mode 100644 index 000000000..ffa1af80a --- /dev/null +++ b/apps/touchtimer/app.js @@ -0,0 +1,456 @@ +var DEBUG = false; +var FILE = "touchtimer.data.json"; + +var main = () => { + var settings = readSettings(); + + var button1 = new Button({ x1: 1, y1: 35, x2: 58, y2: 70 }, 1); + var button2 = new Button({ x1: 60, y1: 35, x2: 116, y2: 70 }, 2); + var button3 = new Button({ x1: 118, y1: 35, x2: 174, y2: 70 }, 3); + + var button4 = new Button({ x1: 1, y1: 72, x2: 58, y2: 105 }, 4); + var button5 = new Button({ x1: 60, y1: 72, x2: 116, y2: 105 }, 5); + var button6 = new Button({ x1: 118, y1: 72, x2: 174, y2: 105 }, 6); + + var button7 = new Button({ x1: 1, y1: 107, x2: 58, y2: 140 }, 7); + var button8 = new Button({ x1: 60, y1: 107, x2: 116, y2: 140 }, 8); + var button9 = new Button({ x1: 118, y1: 107, x2: 174, y2: 140 }, 9); + + var buttonOK = new Button({ x1: 1, y1: 142, x2: 58, y2: 174 }, "OK"); + var button0 = new Button({ x1: 60, y1: 142, x2: 116, y2: 174 }, 0); + var buttonDelete = new Button({ x1: 118, y1: 142, x2: 174, y2: 174 }, "<-"); + + var timerNumberButtons = [ + button1, + button2, + button3, + button4, + button5, + button6, + button7, + button8, + button9, + button0, + ]; + + var timerInputButtons = [ + button1, + button2, + button3, + button4, + button5, + button6, + button7, + button8, + button9, + buttonOK, + button0, + buttonDelete, + ]; + + var buttonStartPause = new Button( + { x1: 1, y1: 35, x2: 174, y2: 105 }, + "START" + ); + var buttonStop = new Button({ x1: 1, y1: 107, x2: 174, y2: 174 }, "STOP"); + + var timerRunningButtons = [buttonStartPause, buttonStop]; + + var timerEdit = new TimerEdit(); + timerNumberButtons.forEach((numberButton) => { + numberButton.setOnClick((number) => { + log("number button clicked"); + log(number); + timerEdit.appendNumber(number); + timerEdit.draw(); + }); + }); + + buttonDelete.setOnClick(() => { + log("delete button clicked"); + timerEdit.removeNumber(); + timerEdit.draw(); + }); + + buttonOK.setOnClick(() => { + if (timerEdit.timeStr.length === 0) { + return; + } + + g.clear(); + timerEdit.draw(); + + timerInputButtons.forEach((button) => button.disable()); + + timerRunningButtons.forEach((button) => { + button.enable(); + button.draw(); + }); + }); + + var timerIntervalId = undefined; + var buzzIntervalId = undefined; + var timerCountDown = undefined; + buttonStartPause.setOnClick(() => { + if (buttonStartPause.value === "PAUSE") { + if (timerCountDown) { + timerCountDown.pause(); + } + + buttonStartPause.value = "START"; + buttonStartPause.draw(); + + if (timerIntervalId) { + clearInterval(timerIntervalId); + timerIntervalId = undefined; + } + + if (buzzIntervalId) { + clearInterval(buzzIntervalId); + buzzIntervalId = undefined; + } + + return; + } + + if (buttonStartPause.value === "START") { + if (!timerCountDown) { + timerCountDown = new TimerCountDown(timerEdit.timeStr); + } else { + timerCountDown.unpause(); + } + + buttonStartPause.value = "PAUSE"; + buttonStartPause.draw(); + + timerIntervalId = setInterval(() => { + timerCountDown.draw(); + + if (timerCountDown.isFinished()) { + buttonStartPause.value = "FINISHED!"; + buttonStartPause.draw(); + + if (timerIntervalId) { + clearInterval(timerIntervalId); + timerIntervalId = undefined; + } + + var buzzCount = 1; + Bangle.buzz(settings.buzzDuration * 1000, 1); + buzzIntervalId = setInterval(() => { + if (buzzCount >= settings.buzzCount) { + clearInterval(buzzIntervalId); + buzzIntervalId = undefined; + return; + } else { + Bangle.buzz(settings.buzzDuration * 1000, 1); + buzzCount++; + } + }, settings.buzzDuration * 1000 + settings.pauseBetween * 1000); + } + }, 1000); + + return; + } + }); + + buttonStop.setOnClick(() => { + if (timerCountDown) { + timerCountDown = undefined; + } + + if (timerIntervalId) { + clearInterval(timerIntervalId); + timerIntervalId = undefined; + } + + if (buzzIntervalId) { + clearInterval(buzzIntervalId); + buzzIntervalId = undefined; + } + + buttonStartPause.value = "START"; + buttonStartPause.draw(); + + g.clear(); + timerEdit.reset(); + timerEdit.draw(); + + timerRunningButtons.forEach((button) => button.disable()); + + timerInputButtons.forEach((button) => { + button.enable(); + button.draw(); + }); + }); + + // initalize + g.clear(); + timerEdit.draw(); + timerInputButtons.forEach((button) => { + button.enable(); + button.draw(); + }); +}; + +// lib functions + +var log = (message) => { + if (DEBUG) { + console.log(JSON.stringify(message)); + } +}; + +var touchHandlers = []; + +Bangle.on("touch", (_button, xy) => { + log("touch"); + log(xy); + + var x = Math.min(Math.max(xy.x, 1), 174); + var y = Math.min(Math.max(xy.y, 1), 174); + + touchHandlers.forEach((touchHandler) => { + touchHandler(x, y); + }); +}); + +var BUTTON_BORDER_WITH = 2; + +class Button { + constructor(position, value) { + this.position = position; + this.value = value; + + this.touchHandler = undefined; + this.highlightTimeoutId = undefined; + } + + draw(highlight) { + g.setColor(g.theme.fg); + g.fillRect( + this.position.x1, + this.position.y1, + this.position.x2, + this.position.y2 + ); + + if (highlight) { + g.setColor(g.theme.bgH); + } else { + g.setColor(g.theme.bg); + } + g.fillRect( + this.position.x1 + BUTTON_BORDER_WITH, + this.position.y1 + BUTTON_BORDER_WITH, + this.position.x2 - BUTTON_BORDER_WITH, + this.position.y2 - BUTTON_BORDER_WITH + ); + + g.setColor(g.theme.fg); + g.setFontAlign(0, 0); + g.setFont("Vector", 35); + g.drawString( + this.value, + this.position.x1 + (this.position.x2 - this.position.x1) / 2 + 2, + this.position.y1 + (this.position.y2 - this.position.y1) / 2 + 2 + ); + } + + setOnClick(callback) { + this.touchHandler = (x, y) => { + if ( + x >= this.position.x1 && + x <= this.position.x2 && + y >= this.position.y1 && + y <= this.position.y2 + ) { + this.draw(true); + this.highlightTimeoutId = setTimeout(() => { + this.draw(); + this.highlightTimeoutId = undefined; + }, 100); + setTimeout(() => callback(this.value), 25); + } + }; + } + + disable() { + log("disable button"); + log(this.value); + var touchHandlerIndex = touchHandlers.indexOf(this.touchHandler); + if (touchHandlerIndex > -1) { + log("clearing touch handler"); + touchHandlers.splice(touchHandlerIndex, 1); + } + + if (this.highlightTimeoutId) { + log("clearing higlight timeout"); + clearTimeout(this.highlightTimeoutId); + this.highlightTimeoutId = undefined; + } + } + + enable() { + if (this.touchHandler) { + touchHandlers.push(this.touchHandler); + } + } +} + +class TimerEdit { + constructor() { + this.timeStr = ""; + } + + appendNumber(number) { + if (number === 0 && this.timeStr.length === 0) { + return; + } + + if (this.timeStr.length <= 6) { + this.timeStr = this.timeStr + number; + } + } + + removeNumber() { + if (this.timeStr.length > 0) { + this.timeStr = this.timeStr.slice(0, -1); + } + } + + reset() { + this.timeStr = ""; + } + + draw() { + log("drawing timer edit"); + var timeStrPadded = this.timeStr.padStart(6, "0"); + var timeStrDisplay = + "" + + timeStrPadded.slice(0, 2) + + "h " + + timeStrPadded.slice(2, 4) + + "m " + + timeStrPadded.slice(4, 6) + + "s"; + log(timeStrPadded); + log(timeStrDisplay); + + g.clearRect(0, 0, 176, 34); + g.setColor(g.theme.fg); + g.setFontAlign(-1, -1); + g.setFont("Vector:26x40"); + g.drawString(timeStrDisplay, 2, 0); + } +} + +class TimerCountDown { + constructor(timeStr) { + log("creating timer"); + this.timeStr = timeStr; + log(this.timeStr); + this.start = Math.floor(Date.now() / 1000); + log(this.start); + this.pausedTime = undefined; + } + + getAdjustedTime() { + var elapsedTime = Math.floor(Date.now() / 1000) - this.start; + + var timeStrPadded = this.timeStr.padStart(6, "0"); + var timeStrHours = parseInt(timeStrPadded.slice(0, 2), 10); + var timeStrMinutes = parseInt(timeStrPadded.slice(2, 4), 10); + var timeStrSeconds = parseInt(timeStrPadded.slice(4, 6), 10); + + var hours = timeStrHours; + var minutes = timeStrMinutes; + var seconds = timeStrSeconds - elapsedTime; + + if (seconds < 0) { + var neededMinutes = Math.ceil(Math.abs(seconds) / 60); + + seconds = seconds + neededMinutes * 60; + minutes = minutes - neededMinutes; + + if (minutes < 0) { + var neededHours = Math.ceil(Math.abs(minutes) / 60); + + minutes = minutes + neededHours * 60; + hours = hours - neededHours; + } + } + + if (hours < 0 || minutes < 0 || seconds < 0) { + hours = 0; + minutes = 0; + seconds = 0; + } + + return { hours: hours, minutes: minutes, seconds: seconds }; + } + + pause() { + this.pausedTime = Math.floor(Date.now() / 1000); + } + + unpause() { + if (this.pausedTime) { + this.start += Math.floor(Date.now() / 1000) - this.pausedTime; + } + + this.pausedTime = undefined; + } + + draw() { + log("drawing timer count down"); + var adjustedTime = this.getAdjustedTime(); + var hours = adjustedTime.hours; + var minutes = adjustedTime.minutes; + var seconds = adjustedTime.seconds; + + var timeStrDisplay = + "" + + hours.toString().padStart(2, "0") + + "h " + + minutes.toString().padStart(2, "0") + + "m " + + seconds.toString().padStart(2, "0") + + "s"; + log(timeStrDisplay); + + g.clearRect(0, 0, 176, 34); + g.setColor(g.theme.fg); + g.setFontAlign(-1, -1); + g.setFont("Vector:26x40"); + g.drawString(timeStrDisplay, 2, 0); + } + + isFinished() { + var adjustedTime = this.getAdjustedTime(); + var hours = adjustedTime.hours; + var minutes = adjustedTime.minutes; + var seconds = adjustedTime.seconds; + + if (hours <= 0 && minutes <= 0 && seconds <= 0) { + return true; + } else { + return false; + } + } +} + +var readSettings = () => { + log("reading settings"); + var settings = require("Storage").readJSON(FILE, 1) || { + buzzCount: 3, + buzzDuration: 1, + pauseBetween: 1, + }; + log(settings); + return settings; +}; + +// start main function + +main(); diff --git a/apps/touchtimer/app.png b/apps/touchtimer/app.png new file mode 100644 index 000000000..8ccdb17f0 Binary files /dev/null and b/apps/touchtimer/app.png differ diff --git a/apps/touchtimer/settings.js b/apps/touchtimer/settings.js new file mode 100644 index 000000000..885670f57 --- /dev/null +++ b/apps/touchtimer/settings.js @@ -0,0 +1,77 @@ +(function (back) { + var DEBUG = false; + var FILE = "touchtimer.data.json"; + + var settings = {}; + + var showMainMenu = () => { + log("Loading main menu"); + + E.showMenu({ + "": { title: "Touch Timer" }, + "< Back": () => back(), + "Buzz Count": { + value: settings.buzzCount, + min: 1, + max: 3, + step: 1, + onchange: (value) => { + settings.buzzCount = value; + writeSettings(settings); + }, + }, + "Buzz Duration": { + value: settings.buzzDuration, + min: 1, + max: 10, + step: 0.5, + format: (value) => value + "s", + onchange: (value) => { + settings.buzzDuration = value; + writeSettings(settings); + }, + }, + "Pause Between": { + value: settings.pauseBetween, + min: 1, + max: 5, + step: 1, + format: (value) => value + "s", + onchange: (value) => { + settings.pauseBetween = value; + writeSettings(settings); + }, + }, + }); + }; + + // lib functions + + var log = (message) => { + if (DEBUG) { + console.log(JSON.stringify(message)); + } + }; + + var readSettings = () => { + log("reading settings"); + var settings = require("Storage").readJSON(FILE, 1) || { + buzzCount: 3, + buzzDuration: 1, + pauseBetween: 1, + }; + log(settings); + return settings; + }; + + var writeSettings = (settings) => { + log("writing settings"); + log(settings); + require("Storage").writeJSON(FILE, settings); + }; + + // start main function + + settings = readSettings(); + showMainMenu(); +});