bryan
/
Bangle_MessageCenter
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

start building SwipeBox

master
Bryan 2024-08-06 08:25:58 -06:00
parent cac70f8e3d
commit 110d93f9da
3 changed files with 72 additions and 38 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

68
messagebox.lib.js
View File

@ -10,11 +10,11 @@ let options = {
fh: 20, // footer height - leave this much space for a footer
};
exports.setOptions = function(opts) {
setOptions = function(opts) {
options = Object.assign(options, opts);
};
exports.setClipRect = function (x, y, x2, y2) {
setClipRect = function (x, y, x2, y2) {
if (y < Bangle.appRect.y) y = Bangle.appRect.y;
if (y2 < Bangle.appRect.y) y2 = Bangle.appRect.y;
if (y > Bangle.appRect.y2 - 10) y = Bangle.appRect.y2 - options.fh - 1;
@ -97,7 +97,7 @@ HeaderBox.prototype.draw = function(messageRect) {
g.setColor(g.theme.bg).fillRect(x, y2 - 6, x2, y2); // bar at bottom of header
};
const BodyBox = function(msg, messageRect) {
const TextBox = function(msg, messageRect) {
if (msg.body) body = msg.body;
else body = msg.title;
this.lineH = (g.setFont(options.bodyFont).getFontHeight()) + 2; // plus 2 to add a little spacing between lines
@ -109,9 +109,9 @@ const BodyBox = function(msg, messageRect) {
this.scrollY = this.initScrollY;
this.minY = messageRect.y2 - (this.lineH * (this.lines.length + 3));
if (this.minY > 0) this.minY = 0;
}; // BodyBox
}; // TextBox
BodyBox.prototype.draw = function(messageRect, yOffset) {
TextBox.prototype.draw = function(messageRect, yOffset) {
x = messageRect.x;
y = messageRect.y + yOffset;
x2 = messageRect.x2;
@ -140,21 +140,21 @@ MessageBox = function(msg, yOffset) {
y2: Bangle.appRect.y2 + this.yOffset
};
this.headerBox = new HeaderBox(msg, this.rect);
this.bodyBox = new BodyBox(msg, this.rect);
let messageH = this.bodyBox.lines.length * this.bodyBox.lineH;
this.textBox = new TextBox(msg, this.rect);
let messageH = this.textBox.lines.length * this.textBox.lineH;
let boxH = this.rect.h - this.headerBox.maxH;
if ( messageH <= boxH) this.oneScreen = true;
else this.oneScreen = false;
this.top = true;
if (this.oneScreen) {
this.bottom = true;
this.bodyBox.initScrollY = Math.round((boxH - messageH) / 2);
this.textBox.initScrollY = Math.round((boxH - messageH) / 2);
} else {
this.bottom = false;
this.bodyBox.initScrollY = 0;
this.textBox.initScrollY = 0;
}
this.sbH = this.rect.h / messageH * this.rect.h; // scrollbar height
this.sbRatio = (this.rect.h - this.sbH) / Math.abs(this.bodyBox.minY); // scrollbar ratio
this.sbRatio = (this.rect.h - this.sbH) / Math.abs(this.textBox.minY); // scrollbar ratio
}; // MessageBox
MessageBox.prototype.prevOffset = Bangle.appRect.y - Bangle.appRect.h;
@ -172,7 +172,7 @@ MessageBox.prototype.reset = function(yOffset) {
if (!yOffset) yOffset = 0;
this.yOffset = yOffset;
this.headerBox.h = this.headerBox.maxH;
this.bodyBox.scrollY = this.bodyBox.initScrollY;
this.textBox.scrollY = this.textBox.initScrollY;
this.top = true;
if (this.oneScreen) this.bottom = true;
else this.bottom = false;
@ -186,7 +186,7 @@ MessageBox.prototype.draw = function() {
exports.setClipRect(this.rect.x, this.rect.y, this.rect.x2, this.rect.y2);
g.clearRect(this.rect.x, this.rect.y, this.rect.x2, this.rect.y2);
this.headerBox.draw(this.rect);
this.bodyBox.draw(this.rect, this.headerBox.h);
this.textBox.draw(this.rect, this.headerBox.h);
exports.setClipRect(this.rect.x, this.rect.y, this.rect.x2, this.rect.y2);
this.drawScrollbar();
//this.drawFooter();
@ -194,7 +194,7 @@ MessageBox.prototype.draw = function() {
MessageBox.prototype.drawScrollbar = function() {
if (this.oneScreen) return;
let sbY = this.rect.y + (this.sbRatio * Math.abs(this.bodyBox.scrollY));
let sbY = this.rect.y + (this.sbRatio * Math.abs(this.textBox.scrollY));
g.setColor(g.theme.fg).drawLine(this.rect.x, sbY, this.rect.x, sbY + this.sbH);
};
@ -209,17 +209,17 @@ MessageBox.prototype.scroll = function(dy) {
this.headerBox.h += dy;
if (this.headerBox.h > this.headerBox.maxH) this.headerBox.h = this.headerBox.maxH;
}
if (this.headerBox.h == this.headerBox.minH && dy < 0) this.bodyBox.scrollY += dy;
else if (dy > 0) this.bodyBox.scrollY += dy;
if (this.bodyBox.scrollY <= this.bodyBox.minY) {
if (this.headerBox.h == this.headerBox.minH && dy < 0) this.textBox.scrollY += dy;
else if (dy > 0) this.textBox.scrollY += dy;
if (this.textBox.scrollY <= this.textBox.minY) {
this.bottom = true;
this.bodyBox.scrollY = this.bodyBox.minY;
this.textBox.scrollY = this.textBox.minY;
} else {
this.bottom = false;
}
if (this.bodyBox.scrollY >= 0 && this.headerBox.h == this.headerBox.maxH) {
if (this.textBox.scrollY >= 0 && this.headerBox.h == this.headerBox.maxH) {
this.top = true;
this.bodyBox.scrollY = this.bodyBox.initScrollY;
this.textBox.scrollY = this.textBox.initScrollY;
} else {
this.top = false;
}
@ -227,7 +227,33 @@ MessageBox.prototype.scroll = function(dy) {
};
SwipeBox = function(msg, screenRect) {
this.screenRect = screenRect;
console.log("screenRect = ", screenRect);
console.log("this.screenRect = ", this.screenRect);
this.headerBox = new HeaderBox(msg, screenRect);
//this.bodyRect = {x: screenRect.x, y: screenRect.y + headerBox.h, x2: screenRect.x2, y2: screenRect.y2};
};
SwipeBox.prototype.draw = function(xOffset) {
const x = this.screenRect.x, y = this.screenRect.y + this.headerBox.h, x2 = this.screenRect.x2, y2 = this.screenRect.y2;
const w = x2 - x + 1;
const yOff = 120 - this.headerBox.h;
this.headerBox.draw(this.screenRect);
g.reset();
const drawArrows = function (xOffset) {
g.setColor(1, 0, 0);
g.fillPoly([x-w+xOffset, y+yOff, x+50+xOffset, y+yOff, x+60+xOffset, y+yOff+25, x+50+xOffset, y+yOff+50, x-w+xOffset, y+yOff+50]);
g.setColor(0, 1, 0);
g.fillPoly([x2+w+xOffset, y+yOff, x2-50+xOffset, y+yOff, x2-60+xOffset, y+yOff+25, x2-50+xOffset, y+yOff+50, x2+w+xOffset, y+yOff+50]);
};
drawArrows(xOffset);
};
module.exports.HeaderBox = HeaderBox;
module.exports.MessageBox = MessageBox;
module.exports.setOptions = this.setOptions;
module.exports.setClipRect = this.setClipRect;
module.exports.SwipeBox = SwipeBox;
module.exports.setOptions = setOptions;
module.exports.setClipRect = setClipRect;

41
messagecenter.app.js
View File

@ -34,7 +34,7 @@ const setActive = function(newActive) {
if (!newActive) return;
if (active && !previous.includes(active) && newActive !== active) previous.push(active);
active = newActive;
console.log(previous);
//console.log(previous);
}
const setListener = function(event, callback) {
@ -98,16 +98,21 @@ const showAlarm = function(alarm) {
const showCall = function(call) {
Bangle.setUI(); // clear from previous
const HeaderBox = new require("messagebox").HeaderBox;
let header = new HeaderBox(call, Bangle.appRect);
// const HeaderBox = new require("messagebox").HeaderBox;
// let header = new HeaderBox(call, Bangle.appRect);
g.reset().clear().setFont("12x20")
header.draw(Bangle.appRect);
let str = g.wrapString(JSON.stringify(call),g.getWidth()).join("\n");
g.drawString(str, 0, 60);
console.log("call: ", call);
// header.draw(Bangle.appRect);
//let str = g.wrapString(JSON.stringify(call),g.getWidth()).join("\n");
//g.drawString(str, 0, 60);
const SwipeBox = require("messagebox").SwipeBox;
const swipeBox = new SwipeBox(call, Bangle.appRect);
let xOff = 0;
swipeBox.draw(xOff);
const handler = function(e) {
console.log(e);
xOff += e.dx;
console.log(e, xOff);
g.clear();
swipeBox.draw(xOff);
};
Bangle.setUI({
@ -127,7 +132,7 @@ const showText = function(messageNum) {
else if (messageNum >= Bangle.MESSAGES.length - 1) messageNum = Bangle.MESSAGES.length - 1;
Bangle.setUI(); // make sure to clear setUI from anything previous
let switching = false;
let MessageBox = require("messagebox").MessageBox;
const MessageBox = require("messagebox").MessageBox;
require("messagebox").setOptions({fh: 20});
const step = 42;
const delay = 30;
@ -526,8 +531,15 @@ const goBack = function(timedOut) { // TODO do we want this as a stack or by pr
idle = true;
if (buzzing) require("messages").stopBuzz();
let backTo;
if (previous && previous.length) backTo = previous.pop();
console.log("backTo = ", backTo);
if (previous && previous.length) {
backTo = previous.pop();
} else {
if (!timedOut) Bangle.MESSAGES.forEach((m) => {if (!m.new) m.show = false;});
require("messages").write(Bangle.MESSAGES);
cleanup = _cleanup;
Bangle.showClock();
}
//console.log("backTo = ", backTo);
switch (backTo) {
case "call": return showCall(call);
case "map": return showMap(map);
@ -538,11 +550,6 @@ const goBack = function(timedOut) { // TODO do we want this as a stack or by pr
if (msgIdx < Bangle.MESSAGES.length) return showText(msgIdx);
else return showText(0);
}
default:
if (!timedOut) Bangle.MESSAGES.forEach((m) => {if (!m.new) m.show = false;});
require("messages").write(Bangle.MESSAGES);
cleanup = _cleanup;
Bangle.showClock();
}
}; // function goBack

1
messagegui.lib.js
View File

@ -11,6 +11,7 @@ exports.messageListener = function(type, msg) {
msg.t = "modify"; // not sure why messages module puts everything as remove except for "incoming"
msg.new = true;
}
if (msg.t === "add") {
require("messages").apply(msg, Bangle.MESSAGES);
} else if (msg.t === "modify") {