bryan
/
banglejs-multi-timer
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Some testing

main
Devin Leamy 2023-10-28 14:13:55 -04:00
parent d2d6ad7ec1
commit 98974f3fe7
2 changed files with 205 additions and 100 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

144
src/app.js
View File

@ -71,17 +71,14 @@ var TimerApp = /** @class */ (function () {
this.timers = [];
this.displayedTimerIndex = 0;
this.timeTextY = this.height * (2.0 / 5.0);
this.lastTickTimeMS = Date.now();
this.loadStateOrDefault();
this.initializeButtons();
this.initializeScreen();
this.initApp();
}
TimerApp.prototype.run = function () {
this.draw();
var self = this;
this.updateInterval = setInterval(function () {
self.draw();
}, UPDATE_DELAY_MS);
this.startTimer();
};
TimerApp.prototype.initApp = function () {
var self = this;
@ -90,28 +87,18 @@ var TimerApp = /** @class */ (function () {
mode: "custom",
btn: function () { return load(); },
touch: function (button, point) {
var x = point.x;
var y = point.y;
// adjust for outside the dimension of the screen
// http://forum.espruino.com/conversations/371867/#comment16406025
if (y > self.height)
y = self.height;
if (y < 0)
y = 0;
if (x > self.width)
x = self.width;
if (x < 0)
x = 0;
// not running, and reset
var timer = self.displayedTimer();
var x = Math.min(self.width, Math.max(0, point.x));
var y = Math.min(self.height, Math.max(0, point.y));
if (self.displayedTimerIsRunning()) {
self.largeButton.onClick(x, y);
// if (!running && tCurrent == tTotal && bigPlayPauseBtn.check(x, y)) return;
// // paused and hit play
// if (!running && tCurrent != tTotal && smallPlayPauseBtn.check(x, y)) return;
// // paused and press reset
// if (!running && tCurrent != tTotal && resetBtn.check(x, y)) return;
// // must be running
// if (running && bigPlayPauseBtn.check(x, y)) return;
}
else if (!self.displayedTimerIsRunning() && !self.displayedTimerHasStarted()) {
self.largeButton.onClick(x, y);
}
else {
self.leftButton.onClick(x, y);
self.rightButton.onClick(x, y);
}
},
remove: function () {
self.pauseTimer();
@ -121,34 +108,89 @@ var TimerApp = /** @class */ (function () {
});
};
TimerApp.prototype.initializeScreen = function () {
Bangle.loadWidgets();
Bangle.drawWidgets();
g.setTheme({ bg: "#000", fg: "#fff", dark: true }).clear();
g.setColor(BLACK_COLOR);
g.fillRect(0, 0, this.width, this.height);
Bangle.loadWidgets();
Bangle.drawWidgets();
};
TimerApp.prototype.initializeButtons = function () {
function largeButtonClick() {
console.log("BIG BUTTON");
var self = this;
function startOrPauseTimer() {
if (self.displayedTimerIsRunning()) {
self.pauseDisplayedTimer();
}
function leftButtonClick() {
console.log("LEFT BUTTON");
else {
self.playDisplayedTimer();
}
function rightButtonClick() {
console.log("RIGHT BUTTON");
}
this.largeButton = new Button(0.0, (3.0 / 4.0) * this.height, this.width, this.height / 4.0, BLUE_COLOR, largeButtonClick, PLAY_IMG);
this.leftButton = new Button(0.0, (3.0 / 4.0) * this.height, this.width / 2.0, this.height / 4.0, BLUE_COLOR, leftButtonClick, PLAY_IMG);
this.rightButton = new Button(this.width / 2.0, (3.0 / 4.0) * this.height, this.width / 2.0, this.height / 4.0, BLUE_COLOR, rightButtonClick, PAUSE_IMG);
function resetTimer() {
self.resetDisplayedTimer();
}
function resumeTimer() {
self.resumeDisplayedTimer();
}
this.largeButton = new Button(0.0, (3.0 / 4.0) * this.height, this.width, this.height / 4.0, BLUE_COLOR, startOrPauseTimer, PLAY_IMG);
this.leftButton = new Button(0.0, (3.0 / 4.0) * this.height, this.width / 2.0, this.height / 4.0, YELLOW_COLOR, resetTimer, PLAY_IMG);
this.rightButton = new Button(this.width / 2.0, (3.0 / 4.0) * this.height, this.width / 2.0, this.height / 4.0, BLUE_COLOR, resumeTimer, PAUSE_IMG);
};
TimerApp.prototype.resumeTimer = function () {
TimerApp.prototype.startTimer = function () {
var self = this;
this.updateInterval = setInterval(function () {
self.draw();
var now = Date.now();
var dt = now - self.lastTickTimeMS;
self.lastTickTimeMS = now;
self.update(dt);
}, UPDATE_DELAY_MS);
};
TimerApp.prototype.displayedTimer = function () {
return this.timers[this.displayedTimerIndex];
};
TimerApp.prototype.update = function (dt) {
this.updateTimers(dt);
this.updateButtons();
this.draw();
this.save();
};
TimerApp.prototype.updateTimers = function (dt) {
for (var _i = 0, _a = this.timers; _i < _a.length; _i++) {
var timer = _a[_i];
if (timer.running) {
timer.elapsedTime += dt;
}
}
};
TimerApp.prototype.updateButtons = function () {
if (this.displayedTimerIsRunning()) {
this.largeButton.setImage(PAUSE_IMG);
this.leftButton.setImage(RESET_IMG);
this.rightButton.setImage(PLAY_IMG);
}
else {
this.largeButton.setImage(PLAY_IMG);
this.leftButton.setImage(RESET_IMG);
this.rightButton.setImage(PLAY_IMG);
}
};
TimerApp.prototype.pauseDisplayedTimer = function () {
this.displayedTimer().running = false;
};
TimerApp.prototype.resetDisplayedTimer = function () {
this.displayedTimer().elapsedTime = 0.0;
this.displayedTimer().running = false;
};
TimerApp.prototype.resumeDisplayedTimer = function () {
this.displayedTimer().running = true;
};
TimerApp.prototype.playDisplayedTimer = function () {
this.displayedTimer().running = true;
};
TimerApp.prototype.displayedTimerIsRunning = function () {
return this.displayedTimer().running;
};
TimerApp.prototype.displayedTimerHasStarted = function () {
return this.displayedTimer().elapsedTime > 0.0;
};
TimerApp.prototype.save = function () {
require("Storage").writeJSON(STORAGE_FILE, {
displayedTimerIndex: this.displayedTimerIndex,
@ -158,17 +200,26 @@ var TimerApp = /** @class */ (function () {
TimerApp.prototype.loadStateOrDefault = function () {
this.timers = [
{
startTime: 0.0,
currentTime: 3000.0,
totalTime: 5000.0,
running: true
elapsedTime: 0.0,
running: false
},
{
elapsedTime: 0.0,
running: false
},
{
elapsedTime: 0.0,
running: false
},
{
elapsedTime: 0.0,
running: false
},
];
};
TimerApp.prototype.drawButtons = function () {
console.log("DRAW BUTTONS", JSON.stringify(this.timers));
var timer = this.displayedTimer();
if (timer.running) {
if (this.displayedTimerIsRunning() || !this.displayedTimerHasStarted()) {
this.largeButton.draw();
}
else {
@ -178,8 +229,7 @@ var TimerApp = /** @class */ (function () {
};
TimerApp.prototype.drawTime = function () {
var timer = this.displayedTimer();
var totalTime = Date.now();
var timeText = convertTimeToText(totalTime);
var timeText = convertTimeToText(timer.elapsedTime);
g.setFont("Vector", 38);
g.setFontAlign(0, 0);
g.clearRect(0, this.timeTextY - 21, this.width, this.timeTextY + 21);

157
src/app.ts
View File

@ -32,9 +32,7 @@ function convertTimeToText(time: number): string {
}
interface TimerState {
totalTime: number
startTime: number
currentTime: number
elapsedTime: number
running: boolean
}
@ -118,6 +116,7 @@ class TimerApp {
leftButton!: Button
rightButton!: Button
updateInterval: undefined | any
lastTickTimeMS: number
constructor() {
this.width = g.getWidth()
@ -125,6 +124,7 @@ class TimerApp {
this.timers = []
this.displayedTimerIndex = 0
this.timeTextY = this.height * (2.0 / 5.0)
this.lastTickTimeMS = Date.now()
this.loadStateOrDefault()
this.initializeButtons()
this.initializeScreen()
@ -132,11 +132,7 @@ class TimerApp {
}
run() {
this.draw()
const self = this
this.updateInterval = setInterval(function () {
self.draw()
}, UPDATE_DELAY_MS)
this.startTimer()
}
initApp() {
@ -147,29 +143,17 @@ class TimerApp {
mode: "custom",
btn: () => load(),
touch: (button, point) => {
let x = point.x
let y = point.y
const x = Math.min(self.width, Math.max(0, point.x))
const y = Math.min(self.height, Math.max(0, point.y))
// adjust for outside the dimension of the screen
// http://forum.espruino.com/conversations/371867/#comment16406025
if (y > self.height) y = self.height
if (y < 0) y = 0
if (x > self.width) x = self.width
if (x < 0) x = 0
// not running, and reset
const timer = self.displayedTimer()
if (self.displayedTimerIsRunning()) {
self.largeButton.onClick(x, y)
// if (!running && tCurrent == tTotal && bigPlayPauseBtn.check(x, y)) return;
// // paused and hit play
// if (!running && tCurrent != tTotal && smallPlayPauseBtn.check(x, y)) return;
// // paused and press reset
// if (!running && tCurrent != tTotal && resetBtn.check(x, y)) return;
// // must be running
// if (running && bigPlayPauseBtn.check(x, y)) return;
} else if (!self.displayedTimerIsRunning() && !self.displayedTimerHasStarted()) {
self.largeButton.onClick(x, y)
} else {
self.leftButton.onClick(x, y)
self.rightButton.onClick(x, y)
}
},
remove: () => {
self.pauseTimer()
@ -180,21 +164,29 @@ class TimerApp {
}
initializeScreen() {
Bangle.loadWidgets()
Bangle.drawWidgets()
g.setTheme({ bg: "#000", fg: "#fff", dark: true }).clear()
g.setColor(BLACK_COLOR)
g.fillRect(0, 0, this.width, this.height)
Bangle.loadWidgets()
Bangle.drawWidgets()
}
initializeButtons() {
function largeButtonClick() {
console.log("BIG BUTTON")
const self = this
function startOrPauseTimer() {
if (self.displayedTimerIsRunning()) {
self.pauseDisplayedTimer()
} else {
self.playDisplayedTimer()
}
function leftButtonClick() {
console.log("LEFT BUTTON")
}
function rightButtonClick() {
console.log("RIGHT BUTTON")
function resetTimer() {
self.resetDisplayedTimer()
}
function resumeTimer() {
self.resumeDisplayedTimer()
}
this.largeButton = new Button(
@ -203,7 +195,7 @@ class TimerApp {
this.width,
this.height / 4.0,
BLUE_COLOR,
largeButtonClick,
startOrPauseTimer,
PLAY_IMG
)
@ -212,8 +204,8 @@ class TimerApp {
(3.0 / 4.0) * this.height,
this.width / 2.0,
this.height / 4.0,
BLUE_COLOR,
leftButtonClick,
YELLOW_COLOR,
resetTimer,
PLAY_IMG
)
@ -223,15 +215,18 @@ class TimerApp {
this.width / 2.0,
this.height / 4.0,
BLUE_COLOR,
rightButtonClick,
resumeTimer,
PAUSE_IMG
)
}
resumeTimer() {
startTimer() {
const self = this
this.updateInterval = setInterval(function () {
self.draw()
const now = Date.now()
const dt = now - self.lastTickTimeMS
self.lastTickTimeMS = now
self.update(dt)
}, UPDATE_DELAY_MS)
}
@ -239,6 +234,58 @@ class TimerApp {
return this.timers[this.displayedTimerIndex]
}
update(dt: number) {
this.updateTimers(dt)
this.updateButtons()
this.draw()
this.save()
}
updateTimers(dt: number) {
for (let timer of this.timers) {
if (timer.running) {
timer.elapsedTime += dt
}
}
}
updateButtons() {
if (this.displayedTimerIsRunning()) {
this.largeButton.setImage(PAUSE_IMG)
this.leftButton.setImage(RESET_IMG)
this.rightButton.setImage(PLAY_IMG)
} else {
this.largeButton.setImage(PLAY_IMG)
this.leftButton.setImage(RESET_IMG)
this.rightButton.setImage(PLAY_IMG)
}
}
pauseDisplayedTimer() {
this.displayedTimer().running = false
}
resetDisplayedTimer() {
this.displayedTimer().elapsedTime = 0.0
this.displayedTimer().running = false
}
resumeDisplayedTimer() {
this.displayedTimer().running = true
}
playDisplayedTimer() {
this.displayedTimer().running = true
}
displayedTimerIsRunning(): boolean {
return this.displayedTimer().running
}
displayedTimerHasStarted(): boolean {
return this.displayedTimer().elapsedTime > 0.0
}
save() {
require("Storage").writeJSON(STORAGE_FILE, {
displayedTimerIndex: this.displayedTimerIndex,
@ -249,18 +296,27 @@ class TimerApp {
loadStateOrDefault() {
this.timers = [
{
startTime: 0.0,
currentTime: 3000.0,
totalTime: 5000.0,
running: true,
elapsedTime: 0.0,
running: false,
},
{
elapsedTime: 0.0,
running: false,
},
{
elapsedTime: 0.0,
running: false,
},
{
elapsedTime: 0.0,
running: false,
},
]
}
drawButtons() {
console.log("DRAW BUTTONS", JSON.stringify(this.timers))
const timer = this.displayedTimer()
if (timer.running) {
if (this.displayedTimerIsRunning() || !this.displayedTimerHasStarted()) {
this.largeButton.draw()
} else {
this.leftButton.draw()
@ -270,8 +326,7 @@ class TimerApp {
drawTime() {
const timer = this.displayedTimer()
const totalTime = Date.now()
const timeText = convertTimeToText(totalTime)
const timeText = convertTimeToText(timer.elapsedTime)
g.setFont("Vector", 38)
g.setFontAlign(0, 0)