Use clock_info.addInteractive instead of a custom implementation

master
David Peer 2023-01-05 19:39:02 +01:00
parent 29a9687c57
commit 7b5f6e10c5
3 changed files with 69 additions and 203 deletions

View File

@ -24,4 +24,4 @@
0.24: Update clock_info to avoid a redraw 0.24: Update clock_info to avoid a redraw
0.25: Use Bangle.setUI({remove:...}) to allow loading the launcher without a full reset on fw2v16. 0.25: Use Bangle.setUI({remove:...}) to allow loading the launcher without a full reset on fw2v16.
ClockInfo Fix: Use .get instead of .show as .show is not implemented for weather etc. ClockInfo Fix: Use .get instead of .show as .show is not implemented for weather etc.
0.26: Use clkinfo.addInteractive instead of a custom implementation

View File

@ -31,6 +31,19 @@ for (const key in saved_settings) {
settings[key] = saved_settings[key]; settings[key] = saved_settings[key];
} }
let isFullscreen = function() {
var s = settings.screen.toLowerCase();
if(s == "dynamic"){
return Bangle.isLocked();
} else {
return s == "full";
}
};
let getLineY = function(){
return H/5*2 + (isFullscreen() ? 0 : 8);
}
/************************************************ /************************************************
* Assets * Assets
*/ */
@ -86,70 +99,47 @@ let imgLock = function() {
/************************************************ /************************************************
* Menu * Menu
*/ */
// Custom bwItems menu - therefore, its added here and not in a clkinfo.js file. let clockInfoItems = clock_info.load();
let bwItems = { let clockInfoMenu = clock_info.addInteractive(clockInfoItems, {
name: null, x : 0,
img: null, y: 135,
items: [ w: W,
{ name: "WeekOfYear", h: H-135,
get: () => ({ text: "Week " + weekOfYear(), img: null}), draw : (itm, info, options) => {
show: function() {}, g.setColor(g.theme.fg);
hide: function () {} g.fillRect(options.x, options.y, options.x+options.w, options.y+options.h);
},
]
};
let weekOfYear = function() { g.setFontAlign(0,0);
var date = new Date(); g.setColor(g.theme.bg);
date.setHours(0, 0, 0, 0);
// Thursday in current week decides the year.
date.setDate(date.getDate() + 3 - (date.getDay() + 6) % 7);
// January 4 is always in week 1.
var week1 = new Date(date.getFullYear(), 0, 4);
// Adjust to Thursday in week 1 and count number of weeks from date to week1.
return 1 + Math.round(((date.getTime() - week1.getTime()) / 86400000
- 3 + (week1.getDay() + 6) % 7) / 7);
};
if (options.focus){
// Load menu g.drawRect(options.x, options.y, options.x+options.w-2, options.y+options.h-1); // show if focused
let menu = clock_info.load(); g.drawRect(options.x+1, options.y+1, options.x+options.w-3, options.y+options.h-2); // show if focused
menu = menu.concat(bwItems);
// Ensure that our settings are still in range (e.g. app uninstall). Otherwise reset the position it.
if(settings.menuPosX >= menu.length || settings.menuPosY > menu[settings.menuPosX].items.length ){
settings.menuPosX = 0;
settings.menuPosY = 0;
} }
let canRunMenuItem = function() { // Set text and font
if(settings.menuPosY == 0){ var image = info.img;
return false; var text = String(info.text);
if(text.split('\n').length > 1){
g.setMiniFont();
} else {
g.setSmallFont();
} }
var menuEntry = menu[settings.menuPosX]; // Compute sizes
var item = menuEntry.items[settings.menuPosY-1]; var strWidth = g.stringWidth(text);
return item.run !== undefined; var imgWidth = image == null ? 0 : 24;
}; var midx = options.x+options.w/2;
// Draw
let runMenuItem = function() { if (image) {
if(settings.menuPosY == 0){ var scale = imgWidth / image.width;
return; g.drawImage(image, midx-16-parseInt(strWidth/2), options.y+8, {scale: scale});
} }
g.drawString(text, midx+imgWidth-6, options.y+20);
var menuEntry = menu[settings.menuPosX];
var item = menuEntry.items[settings.menuPosY-1];
try{
var ret = item.run();
if(ret){
Bangle.buzz(300, 0.6);
} }
} catch (ex) { });
// Simply ignore it...
}
};
/************************************************ /************************************************
@ -161,7 +151,7 @@ let draw = function() {
// Draw clock // Draw clock
drawDate(); drawDate();
drawMenuAndTime(); drawTime();
drawLock(); drawLock();
drawWidgets(); drawWidgets();
}; };
@ -169,7 +159,7 @@ let draw = function() {
let drawDate = function() { let drawDate = function() {
// Draw background // Draw background
var y = H/5*2 + (isFullscreen() ? 0 : 8); var y = getLineY()
g.reset().clearRect(0,0,W,y); g.reset().clearRect(0,0,W,y);
// Draw date // Draw date
@ -197,14 +187,12 @@ let drawDate = function() {
}; };
let drawTime = function(y, smallText) { let drawTime = function() {
// Draw background // Draw background
var y1 = getLineY();
var y = y1;
var date = new Date(); var date = new Date();
// Draw time
g.setColor(g.theme.bg);
g.setFontAlign(0,0);
var hours = String(date.getHours()); var hours = String(date.getHours());
var minutes = date.getMinutes(); var minutes = date.getMinutes();
minutes = minutes < 10 ? String("0") + minutes : minutes; minutes = minutes < 10 ? String("0") + minutes : minutes;
@ -212,67 +200,18 @@ let drawTime = function(y, smallText) {
var timeStr = hours + colon + minutes; var timeStr = hours + colon + minutes;
// Set y coordinates correctly // Set y coordinates correctly
y += parseInt((H - y)/2) + 5; y += parseInt((H - y)/2)-10;
// Clear region
g.setColor(g.theme.fg);
g.fillRect(0,y1,W,y+20);
// Show large or small time depending on info entry
if(smallText){
y -= 15;
g.setMediumFont(); g.setMediumFont();
} else { g.setColor(g.theme.bg);
g.setLargeFont(); g.setFontAlign(0,0);
}
g.drawString(timeStr, W/2, y); g.drawString(timeStr, W/2, y);
}; };
let drawMenuItem = function(text, image) {
// First clear the time region
var y = H/5*2 + (isFullscreen() ? 0 : 8);
g.setColor(g.theme.fg);
g.fillRect(0,y,W,H);
// Draw menu text
var hasText = (text != null && text != "");
if(hasText){
g.setFontAlign(0,0);
// For multiline text we show an even smaller font...
text = String(text);
if(text.split('\n').length > 1){
g.setMiniFont();
} else {
g.setSmallFont();
}
var imgWidth = image == null ? 0 : 24;
var strWidth = g.stringWidth(text);
g.setColor(g.theme.fg).fillRect(0, 149-14, W, H);
g.setColor(g.theme.bg).drawString(text, W/2 + imgWidth/2 + 2, 149+3);
if(image != null){
var scale = imgWidth / image.width;
g.drawImage(image, W/2 + -strWidth/2-4 - parseInt(imgWidth/2), 149 - parseInt(imgWidth/2), {scale: scale});
}
}
// Draw time
drawTime(y, hasText);
};
let drawMenuAndTime = function() {
var menuEntry = menu[settings.menuPosX];
// The first entry is the overview...
if(settings.menuPosY == 0){
drawMenuItem(menuEntry.name, menuEntry.img);
return;
}
// Draw item if needed
var item = menuEntry.items[settings.menuPosY-1].get();
drawMenuItem(item.text, item.img);
};
let drawLock = function() { let drawLock = function() {
if(settings.showLock && Bangle.isLocked()){ if(settings.showLock && Bangle.isLocked()){
@ -291,17 +230,6 @@ let drawWidgets = function() {
}; };
let isFullscreen = function() {
var s = settings.screen.toLowerCase();
if(s == "dynamic"){
return Bangle.isLocked();
} else {
return s == "full";
}
};
/************************************************ /************************************************
* Listener * Listener
*/ */
@ -343,74 +271,12 @@ let lockListenerBw = function(isLocked) {
}; };
Bangle.on('lock', lockListenerBw); Bangle.on('lock', lockListenerBw);
let chargingListenerBw = function(charging) {
if (drawTimeout) clearTimeout(drawTimeout);
drawTimeout = undefined;
// Jump to battery let kill = function(){
settings.menuPosX = 0; clockInfoMenu.remove();
settings.menuPosY = 1; delete clockInfoMenu;
draw();
}; };
Bangle.on('charging', chargingListenerBw); E.on("kill", kill);
let touchListenerBw = function(btn, e) {
var widget_size = isFullscreen() ? 0 : 20; // Its not exactly 24px -- empirically it seems that 20 worked better...
var left = parseInt(g.getWidth() * 0.22);
var right = g.getWidth() - left;
var upper = parseInt(g.getHeight() * 0.22) + widget_size;
var lower = g.getHeight() - upper;
var is_upper = e.y < upper;
var is_lower = e.y > lower;
var is_left = e.x < left && !is_upper && !is_lower;
var is_right = e.x > right && !is_upper && !is_lower;
var is_center = !is_upper && !is_lower && !is_left && !is_right;
if(is_lower){
Bangle.buzz(40, 0.6);
settings.menuPosY = (settings.menuPosY+1) % (menu[settings.menuPosX].items.length+1);
drawMenuAndTime();
}
if(is_upper){
if(e.y < widget_size){
return;
}
Bangle.buzz(40, 0.6);
settings.menuPosY = settings.menuPosY-1;
settings.menuPosY = settings.menuPosY < 0 ? menu[settings.menuPosX].items.length : settings.menuPosY;
drawMenuAndTime();
}
if(is_right){
Bangle.buzz(40, 0.6);
settings.menuPosX = (settings.menuPosX+1) % menu.length;
settings.menuPosY = 0;
drawMenuAndTime();
}
if(is_left){
Bangle.buzz(40, 0.6);
settings.menuPosY = 0;
settings.menuPosX = settings.menuPosX-1;
settings.menuPosX = settings.menuPosX < 0 ? menu.length-1 : settings.menuPosX;
drawMenuAndTime();
}
if(is_center){
if(canRunMenuItem()){
runMenuItem();
}
}
};
Bangle.on('touch', touchListenerBw);
let save = () => storage.write(SETTINGS_FILE, settings);
E.on("kill", save);
/************************************************ /************************************************
* Startup Clock * Startup Clock

View File

@ -1,7 +1,7 @@
{ {
"id": "bwclk", "id": "bwclk",
"name": "BW Clock", "name": "BW Clock",
"version": "0.25", "version": "0.26",
"description": "A very minimalistic clock to mainly show date and time.", "description": "A very minimalistic clock to mainly show date and time.",
"readme": "README.md", "readme": "README.md",
"icon": "app.png", "icon": "app.png",