tanner/bangle
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Apply my changes to messagegui app:

Browse Source 
- skip the entire message display UI, go directly to
  showMessageScroller()
- modify message scroller font and alignment
- remove extra lines and < Back button
- make tapping the header open message settings
This commit is contained in:
Tanner Collin 2024-09-09 12:38:17 -06:00
parent 6167de7456
commit 0ba99a590a
1 changed files with 128 additions and 118 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

246
messagegui/app.js
View File

@ -20,6 +20,9 @@ GB({t:"nav",src:"maps",title:"Navigation",instr:"High St",distance:"12km",action
GB({t:"nav",src:"maps",title:"Navigation",instr:"Main St / I-29 ALT / Centerpoint Dr",distance:12345,action:"left_slight",eta:"08:39"}) GB({t:"nav",src:"maps",title:"Navigation",instr:"Main St / I-29 ALT / Centerpoint Dr",distance:12345,action:"left_slight",eta:"08:39"})
// call // call
require("messages").pushMessage({"t":"add","id":"call","src":"Phone","title":"Bob","body":"12421312",positive:true,negative:true}) require("messages").pushMessage({"t":"add","id":"call","src":"Phone","title":"Bob","body":"12421312",positive:true,negative:true})
// tanner
require("messages").pushMessage({"t":"add","id":"1234","src":"Telegram","title":"testing","body":"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.",positive:true,negative:true})
*/ */
var Layout = require("Layout"); var Layout = require("Layout");
var layout; // global var containing the layout for the currently displayed message var layout; // global var containing the layout for the currently displayed message
@ -238,13 +241,14 @@ function showMusicMessage(msg) {
function showMessageScroller(msg) { function showMessageScroller(msg) {
cancelReloadTimeout(); cancelReloadTimeout();
active = "scroller"; active = "scroller";
var bodyFont = fontBig; var bodyFont = fontLarge;
g.setFont(bodyFont); g.setFont(bodyFont);
var lines = []; var lines = [];
if (msg.title) lines = g.wrapString(msg.title, g.getWidth()-10); if (msg.title) lines = g.wrapString(msg.title, g.getWidth()-10);
lines = [lines[0]];
var titleCnt = lines.length; var titleCnt = lines.length;
if (titleCnt) lines.push(""); // add blank line after title //if (titleCnt) lines.push(""); // add blank line after title
lines = lines.concat(g.wrapString(msg.body, g.getWidth()-10),["",/*LANG*/"< Back"]); lines = lines.concat(g.wrapString(msg.body, g.getWidth()-10)) //,["",/*LANG*/"< Back"]);
E.showScroller({ E.showScroller({
h : g.getFontHeight(), // height of each menu item in pixels h : g.getFontHeight(), // height of each menu item in pixels
c : lines.length, // number of menu items c : lines.length, // number of menu items
@ -254,12 +258,16 @@ function showMessageScroller(msg) {
g.setBgColor(idx<titleCnt ? g.theme.bg2 : g.theme.bg). g.setBgColor(idx<titleCnt ? g.theme.bg2 : g.theme.bg).
setColor(idx<titleCnt ? g.theme.fg2 : g.theme.fg). setColor(idx<titleCnt ? g.theme.fg2 : g.theme.fg).
clearRect(r.x,r.y,r.x+r.w, r.y+r.h); clearRect(r.x,r.y,r.x+r.w, r.y+r.h);
g.setFont(bodyFont).setFontAlign(0,-1).drawString(lines[idx], r.x+r.w/2, r.y); g.setFont(bodyFont).drawString(lines[idx], r.x, r.y);
}, select : function(idx) { }, select : function(idx) {
if (idx>=lines.length-2) if (idx==0) {
showMessage(msg.id, true); cancelReloadTimeout(); // don't auto-reload to clock now
showMessageSettings(msg);
} else {
load();
}
}, },
back : () => showMessage(msg.id, true) back : () => load()
}); });
} }
@ -345,118 +353,120 @@ function showMessage(msgid, persist) {
cancelReloadTimeout(); // don't auto-reload to clock now cancelReloadTimeout(); // don't auto-reload to clock now
return showMapMessage(msg); return showMapMessage(msg);
} }
active = "message"; // active = "message";
// Normal text message display // // Normal text message display
var title=msg.title, titleFont = fontLarge, lines; // var title=msg.title, titleFont = fontLarge, lines;
var body=msg.body, bodyFont = fontLarge; // var body=msg.body, bodyFont = fontLarge;
// If no body, use the title text instead... // // If no body, use the title text instead...
if (body===undefined) { // if (body===undefined) {
body = title; // body = title;
title = undefined; // title = undefined;
} // }
if (title) { // if (title) {
var w = g.getWidth()-48; // var w = g.getWidth()-48;
if (g.setFont(titleFont).stringWidth(title) > w) { // if (g.setFont(titleFont).stringWidth(title) > w) {
titleFont = fontBig; // titleFont = fontBig;
if (settings.fontSize!=1 && g.setFont(titleFont).stringWidth(title) > w) // if (settings.fontSize!=1 && g.setFont(titleFont).stringWidth(title) > w)
titleFont = fontMedium; // titleFont = fontMedium;
} // }
if (g.setFont(titleFont).stringWidth(title) > w) { // if (g.setFont(titleFont).stringWidth(title) > w) {
lines = g.wrapString(title, w); // lines = g.wrapString(title, w);
title = (lines.length>2) ? lines.slice(0,2).join("\n")+"..." : lines.join("\n"); // title = (lines.length>2) ? lines.slice(0,2).join("\n")+"..." : lines.join("\n");
} // }
} // }
if (body) { // Try and find a font that fits... // if (body) { // Try and find a font that fits...
var w = g.getWidth()-2, h = Bangle.appRect.h-60; // var w = g.getWidth()-2, h = Bangle.appRect.h-60;
if (g.setFont(bodyFont).wrapString(body, w).length*g.getFontHeight() > h) { // if (g.setFont(bodyFont).wrapString(body, w).length*g.getFontHeight() > h) {
bodyFont = fontBig; // bodyFont = fontBig;
if (settings.fontSize!=1 && g.setFont(bodyFont).wrapString(body, w).length*g.getFontHeight() > h) { // if (settings.fontSize!=1 && g.setFont(bodyFont).wrapString(body, w).length*g.getFontHeight() > h) {
bodyFont = fontMedium; // bodyFont = fontMedium;
} // }
} // }
// Now crop, given whatever font we have available // // Now crop, given whatever font we have available
lines = g.setFont(bodyFont).wrapString(body, w); // lines = g.setFont(bodyFont).wrapString(body, w);
var maxLines = Math.floor(h / g.getFontHeight()); // var maxLines = Math.floor(h / g.getFontHeight());
if (lines.length>maxLines) // if too long, wrap with a bit less spae so we have room for '...' // if (lines.length>maxLines) // if too long, wrap with a bit less spae so we have room for '...'
body = g.setFont(bodyFont).wrapString(body, w-10).slice(0,maxLines).join("\n")+"..."; // body = g.setFont(bodyFont).wrapString(body, w-10).slice(0,maxLines).join("\n")+"...";
else // else
body = lines.join("\n"); // body = lines.join("\n");
} // }
function goBack() { // function goBack() {
layout = undefined; // layout = undefined;
msg.new = false; // read mail // msg.new = false; // read mail
cancelReloadTimeout(); // don't auto-reload to clock now // cancelReloadTimeout(); // don't auto-reload to clock now
checkMessages({clockIfNoMsg:1,clockIfAllRead:0,showMsgIfUnread:0,openMusic:openMusic}); // checkMessages({clockIfNoMsg:1,clockIfAllRead:0,showMsgIfUnread:0,openMusic:openMusic});
} // }
var negHandler,posHandler,footer = [ ]; // var negHandler,posHandler,footer = [ ];
if (msg.negative) { // if (msg.negative) {
negHandler = ()=>{ // negHandler = ()=>{
msg.new = false; // msg.new = false;
cancelReloadTimeout(); // don't auto-reload to clock now // cancelReloadTimeout(); // don't auto-reload to clock now
Bangle.messageResponse(msg,false); // Bangle.messageResponse(msg,false);
checkMessages({clockIfNoMsg:1,clockIfAllRead:1,showMsgIfUnread:1,openMusic:openMusic}); // checkMessages({clockIfNoMsg:1,clockIfAllRead:1,showMsgIfUnread:1,openMusic:openMusic});
}; footer.push({type:"img",src:atob("PhAB4A8AAAAAAAPAfAMAAAAAD4PwHAAAAAA/H4DwAAAAAH78B8AAAAAA/+A/AAAAAAH/Af//////w/gP//////8P4D///////H/Af//////z/4D8AAAAAB+/AfAAAAAA/H4DwAAAAAPg/AcAAAAADwHwDAAAAAA4A8AAAAAAAA=="),col:"#f00",cb:negHandler}); // }; footer.push({type:"img",src:atob("PhAB4A8AAAAAAAPAfAMAAAAAD4PwHAAAAAA/H4DwAAAAAH78B8AAAAAA/+A/AAAAAAH/Af//////w/gP//////8P4D///////H/Af//////z/4D8AAAAAB+/AfAAAAAA/H4DwAAAAAPg/AcAAAAADwHwDAAAAAA4A8AAAAAAAA=="),col:"#f00",cb:negHandler});
} // }
footer.push({fillx:1}); // push images to left/right // footer.push({fillx:1}); // push images to left/right
if (msg.reply && reply) { // if (msg.reply && reply) {
posHandler = ()=>{ // posHandler = ()=>{
replying = true; // replying = true;
msg.new = false; // msg.new = false;
cancelReloadTimeout(); // don't auto-reload to clock now // cancelReloadTimeout(); // don't auto-reload to clock now
reply.reply({msg: msg}) // reply.reply({msg: msg})
.then(result => { // .then(result => {
Bluetooth.println(JSON.stringify(result)); // Bluetooth.println(JSON.stringify(result));
replying = false; // replying = false;
layout.render(); // layout.render();
checkMessages({clockIfNoMsg:1,clockIfAllRead:1,showMsgIfUnread:1,openMusic:openMusic}); // checkMessages({clockIfNoMsg:1,clockIfAllRead:1,showMsgIfUnread:1,openMusic:openMusic});
}) // })
.catch(() => { // .catch(() => {
replying = false; // replying = false;
layout.render(); // layout.render();
showMessage(msg.id); // showMessage(msg.id);
}); // });
}; footer.push({type:"img",src:atob("QRABAAAAAAAH//+AAAAABgP//8AAAAADgf//4AAAAAHg4ABwAAAAAPh8APgAAAAAfj+B////////geHv///////hf+f///////GPw///////8cGBwAAAAAPx/gDgAAAAAfD/gHAAAAAA8DngOAAAAABwDHP8AAAAADACGf4AAAAAAAAM/w=="),col:"#0f0", cb:posHandler}); // }; footer.push({type:"img",src:atob("QRABAAAAAAAH//+AAAAABgP//8AAAAADgf//4AAAAAHg4ABwAAAAAPh8APgAAAAAfj+B////////geHv///////hf+f///////GPw///////8cGBwAAAAAPx/gDgAAAAAfD/gHAAAAAA8DngOAAAAABwDHP8AAAAADACGf4AAAAAAAAM/w=="),col:"#0f0", cb:posHandler});
} // }
else if (msg.positive) { // else if (msg.positive) {
posHandler = ()=>{ // posHandler = ()=>{
msg.new = false; // msg.new = false;
cancelReloadTimeout(); // don't auto-reload to clock now // cancelReloadTimeout(); // don't auto-reload to clock now
Bangle.messageResponse(msg,true); // Bangle.messageResponse(msg,true);
checkMessages({clockIfNoMsg:1,clockIfAllRead:1,showMsgIfUnread:1,openMusic:openMusic}); // checkMessages({clockIfNoMsg:1,clockIfAllRead:1,showMsgIfUnread:1,openMusic:openMusic});
}; footer.push({type:"img",src:atob("QRABAAAAAAAAAAOAAAAABgAAA8AAAAADgAAD4AAAAAHgAAPgAAAAAPgAA+AAAAAAfgAD4///////gAPh///////gA+D///////AD4H//////8cPgAAAAAAPw8+AAAAAAAfB/4AAAAAAA8B/gAAAAAABwB+AAAAAAADAB4AAAAAAAAABgAA=="),col:"#0f0",cb:posHandler}); // }; footer.push({type:"img",src:atob("QRABAAAAAAAAAAOAAAAABgAAA8AAAAADgAAD4AAAAAHgAAPgAAAAAPgAA+AAAAAAfgAD4///////gAPh///////gA+D///////AD4H//////8cPgAAAAAAPw8+AAAAAAAfB/4AAAAAAA8B/gAAAAAABwB+AAAAAAADAB4AAAAAAAAABgAA=="),col:"#0f0",cb:posHandler});
} // }
//
// layout = new Layout({ type:"v", c: [
// {type:"h", fillx:1, bgCol:g.theme.bg2, col: g.theme.fg2, c: [
// { type:"v", fillx:1, c: [
// {type:"txt", font:fontSmall, label:msg.src||/*LANG*/"Message", bgCol:g.theme.bg2, col: g.theme.fg2, fillx:1, pad:2, halign:1 },
// title?{type:"txt", font:titleFont, label:title, bgCol:g.theme.bg2, col: g.theme.fg2, fillx:1, pad:2 }:{},
// ]},
// { type:"btn",
// src:require("messageicons").getImage(msg),
// col:require("messageicons").getColor(msg, {settings:settings, default:g.theme.fg2}),
// pad: 3, cb:()=>{
// cancelReloadTimeout(); // don't auto-reload to clock now
// showMessageSettings(msg);
// }
// },
// ]},
// {type:"txt", font:bodyFont, label:body, fillx:1, filly:1, pad:2, cb:()=>{
// // allow tapping to show a larger version
// showMessageScroller(msg);
// } },
// {type:"h",fillx:1, c: footer}
// ]},{back:goBack});
//
// Bangle.swipeHandler = (lr,ud) => {
// if (lr>0 && posHandler) posHandler();
// if (lr<0 && negHandler) negHandler();
// if (ud>0 && idx<MESSAGES.length-1) showMessage(MESSAGES[idx+1].id, true);
// if (ud<0 && idx>0) showMessage(MESSAGES[idx-1].id, true);
// };
// Bangle.on("swipe", Bangle.swipeHandler);
// g.reset().clearRect(Bangle.appRect);
// layout.render();
layout = new Layout({ type:"v", c: [ showMessageScroller(msg);
{type:"h", fillx:1, bgCol:g.theme.bg2, col: g.theme.fg2, c: [
{ type:"v", fillx:1, c: [
{type:"txt", font:fontSmall, label:msg.src||/*LANG*/"Message", bgCol:g.theme.bg2, col: g.theme.fg2, fillx:1, pad:2, halign:1 },
title?{type:"txt", font:titleFont, label:title, bgCol:g.theme.bg2, col: g.theme.fg2, fillx:1, pad:2 }:{},
]},
{ type:"btn",
src:require("messageicons").getImage(msg),
col:require("messageicons").getColor(msg, {settings:settings, default:g.theme.fg2}),
pad: 3, cb:()=>{
cancelReloadTimeout(); // don't auto-reload to clock now
showMessageSettings(msg);
}
},
]},
{type:"txt", font:bodyFont, label:body, fillx:1, filly:1, pad:2, cb:()=>{
// allow tapping to show a larger version
showMessageScroller(msg);
} },
{type:"h",fillx:1, c: footer}
]},{back:goBack});
Bangle.swipeHandler = (lr,ud) => {
if (lr>0 && posHandler) posHandler();
if (lr<0 && negHandler) negHandler();
if (ud>0 && idx<MESSAGES.length-1) showMessage(MESSAGES[idx+1].id, true);
if (ud<0 && idx>0) showMessage(MESSAGES[idx-1].id, true);
};
Bangle.on("swipe", Bangle.swipeHandler);
g.reset().clearRect(Bangle.appRect);
layout.render();
} }