Skip to content

Commit

Permalink
Merge pull request #3570 from bobrippling/feat/promenu-long-title
Browse files Browse the repository at this point in the history 
promenu: scroll long titles
  • Loading branch information
@bobrippling
bobrippling committed Sep 13, 2024
2 parents 9e7d520 + aa6e468 commit 753780c
Show file tree
Hide file tree
Showing 2 changed files with 119 additions and 63 deletions.
81 changes: 52 additions & 29 deletions apps/promenu/bootb2.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -31,8 +31,45 @@ E.showMenu = function (items) {
var scroller = {
scroll: selected,
};
var nameScroller = null;
var drawLine = function (name, v, item, idx, x, y, nameScroll) {
if (nameScroll === void 0) { nameScroll = 0; }
var hl = (idx === selected && !selectEdit);
if (g.theme.dark) {
fillRectRnd(x, y, x2, y + fontHeight - 3, 7, hl ? g.theme.bgH : g.theme.bg + 40);
}
else {
fillRectRnd(x, y, x2, y + fontHeight - 3, 7, hl ? g.theme.bgH : g.theme.bg - 20);
}
g.setFont12x20()
.setColor(hl ? g.theme.fgH : g.theme.fg)
.setFontAlign(-1, -1);
var vplain = v.indexOf("\0") < 0;
var truncated = true;
if (vplain && name.length >= 17 - v.length && typeof item === "object") {
g.drawString(name.substring(nameScroll, nameScroll + 12 - v.length) + "...", x + 3.7, y + 2.7);
}
else if (vplain && name.length >= 15) {
g.drawString(name.substring(nameScroll, nameScroll + 15) + "...", x + 3.7, y + 2.7);
}
else {
g.drawString(name, x + 3.7, y + 2.7);
truncated = false;
}
var xo = x2;
if (selectEdit && idx === selected) {
xo -= 24 + 1;
g.setColor(g.theme.fgH)
.drawImage("\x0c\x05\x81\x00 \x07\x00\xF9\xF0\x0E\x00@", xo, y + (fontHeight - 10) / 2, { scale: 2 });
}
g.setFontAlign(1, -1);
g.drawString(v, xo - 2, y + 1);
return truncated;
};
var l = {
draw: function (rowmin, rowmax) {
if (nameScroller)
clearInterval(nameScroller), nameScroller = null;
var rows = 0 | Math.min((y2 - y) / fontHeight, menuItems.length);
var idx = E.clip(selected - (rows >> 1), 0, menuItems.length - rows);
if (idx != lastIdx)
Expand All @@ -55,18 +92,9 @@ E.showMenu = function (items) {
rows = 1 + rowmax - rowmin;
}
}
while (rows--) {
var _loop_1 = function () {
var name = menuItems[idx];
var item = items[name];
var hl = (idx === selected && !selectEdit);
if (g.theme.dark) {
fillRectRnd(x, iy, x2, iy + fontHeight - 3, 7, hl ? g.theme.bgH : g.theme.bg + 40);
}
else {
fillRectRnd(x, iy, x2, iy + fontHeight - 3, 7, hl ? g.theme.bgH : g.theme.bg - 20);
}
g.setColor(hl ? g.theme.fgH : g.theme.fg);
g.setFontAlign(-1, -1);
var v = void 0;
if (typeof item === "object") {
v = "format" in item
Expand All @@ -78,29 +106,22 @@ E.showMenu = function (items) {
else {
v = "";
}
{
var vplain = v.indexOf("\0") < 0;
if (vplain && name.length >= 17 - v.length && typeof item === "object") {
g.drawString(name.substring(0, 12 - v.length) + "...", x + 3.7, iy + 2.7);
}
else if (vplain && name.length >= 15) {
g.drawString(name.substring(0, 15) + "...", x + 3.7, iy + 2.7);
}
else {
g.drawString(name, x + 3.7, iy + 2.7);
}
var xo = x2;
if (selectEdit && idx === selected) {
xo -= 24 + 1;
g.setColor(g.theme.fgH)
.drawImage("\x0c\x05\x81\x00 \x07\x00\xF9\xF0\x0E\x00@", xo, iy + (fontHeight - 10) / 2, { scale: 2 });
}
g.setFontAlign(1, -1);
g.drawString(v, xo - 2, iy + 1);
var truncated = drawLine(name, v, item, idx, x, iy, 0);
if (truncated && idx === selected) {
var nameScroll_1 = 0;
nameScroller = setInterval(function (name, v, item, idx, x, iy) {
drawLine(name, v, item, idx, x, iy, nameScroll_1);
nameScroll_1 += 1;
if (nameScroll_1 >= name.length - 5)
nameScroll_1 = 0;
}, 300, name, v, item, idx, x, iy);
}
g.setColor(g.theme.fg);
iy += fontHeight;
idx++;
};
while (rows--) {
_loop_1();
}
g.setFontAlign(-1, -1);
g.setColor((idx < menuItems.length) ? g.theme.fg : g.theme.bg).fillPoly([72, 166, 104, 166, 88, 174]);
Expand Down Expand Up @@ -170,6 +191,8 @@ E.showMenu = function (items) {
mode: "updown",
back: back,
remove: function () {
if (nameScroller)
clearInterval(nameScroller);
Bangle.removeListener("swipe", onSwipe);
},
}, function (dir) {
Expand Down
101 changes: 67 additions & 34 deletions apps/promenu/bootb2.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -38,9 +38,59 @@ E.showMenu = (items?: Menu): MenuInstance => {
const scroller = {
scroll: selected,
};
let nameScroller: IntervalId | null = null;

const drawLine = (
name: string,
v: string,
item: ActualMenuItem,
idx: number,
x: number,
y: number,
nameScroll: number = 0,
) => {
const hl = (idx === selected && !selectEdit);
if(g.theme.dark){
fillRectRnd(x, y, x2, y + fontHeight - 3, 7, hl ? g.theme.bgH : g.theme.bg + 40);
}else{
fillRectRnd(x, y, x2, y + fontHeight - 3, 7, hl ? g.theme.bgH : g.theme.bg - 20);
}

g.setFont12x20()
.setColor(hl ? g.theme.fgH : g.theme.fg)
.setFontAlign(-1, -1);

const vplain = v.indexOf("\0") < 0;
let truncated = true;
if(vplain && name.length >= 17 - v.length && typeof item === "object"){
g.drawString(name.substring(nameScroll, nameScroll + 12 - v.length) + "...", x + 3.7, y + 2.7);
}else if(vplain && name.length >= 15){
g.drawString(name.substring(nameScroll, nameScroll + 15) + "...", x + 3.7, y + 2.7);
}else{
g.drawString(name, x + 3.7, y + 2.7);
truncated = false;
}

let xo = x2;
if (selectEdit && idx === selected) {
xo -= 24 + 1;
g.setColor(g.theme.fgH)
.drawImage(
"\x0c\x05\x81\x00 \x07\x00\xF9\xF0\x0E\x00@",
xo,
y + (fontHeight - 10) / 2,
{scale:2},
);
}
g.setFontAlign(1, -1);
g.drawString(v, xo - 2, y + 1);

return truncated;
};

const l = {
draw: (rowmin?: number, rowmax?: number) => {
if (nameScroller) clearInterval(nameScroller), nameScroller = null;
let rows = 0|Math.min((y2 - y) / fontHeight, menuItems.length);
let idx = E.clip(selected - (rows>>1), 0, menuItems.length - rows);

Expand All @@ -66,17 +116,7 @@ E.showMenu = (items?: Menu): MenuInstance => {
const name = menuItems[idx];
const item = items![name]! as ActualMenuItem;

const hl = (idx === selected && !selectEdit);
if(g.theme.dark){
fillRectRnd(x, iy, x2, iy + fontHeight - 3, 7, hl ? g.theme.bgH : g.theme.bg + 40);
}else{
fillRectRnd(x, iy, x2, iy + fontHeight - 3, 7, hl ? g.theme.bgH : g.theme.bg - 20);
}

g.setColor(hl ? g.theme.fgH : g.theme.fg);
g.setFontAlign( - 1, -1);

let v;
let v: string;
if (typeof item === "object") {
v = "format" in item
? (item.format as any)(item.value) // <T>format(), value: T
Expand All @@ -86,29 +126,21 @@ E.showMenu = (items?: Menu): MenuInstance => {
v = "";
}

/*???*/{
const vplain = v.indexOf("\0") < 0;
if(vplain && name.length >= 17 - v.length && typeof item === "object"){
g.drawString(name.substring(0, 12 - v.length) + "...", x + 3.7, iy + 2.7);
}else if(vplain && name.length >= 15){
g.drawString(name.substring(0, 15) + "...", x + 3.7, iy + 2.7);
}else{
g.drawString(name, x + 3.7, iy + 2.7);
}

let xo = x2;
if (selectEdit && idx === selected) {
xo -= 24 + 1;
g.setColor(g.theme.fgH)
.drawImage(
"\x0c\x05\x81\x00 \x07\x00\xF9\xF0\x0E\x00@",
xo,
iy + (fontHeight - 10) / 2,
{scale:2},
);
}
g.setFontAlign(1, -1);
g.drawString(v, xo - 2, iy + 1);
const truncated = drawLine(name, v, item, idx, x, iy, 0);
if (truncated && idx === selected){
let nameScroll = 0;
nameScroller = setInterval((
name: string,
v: string,
item: ActualMenuItem,
idx: number,
x: number,
iy: number,
) => {
drawLine(name, v, item, idx, x, iy, nameScroll);
nameScroll += 1;
if (nameScroll >= name.length - 5) nameScroll = 0;
}, 300, name, v, item, idx, x, iy);
}

g.setColor(g.theme.fg);
Expand Down Expand Up @@ -191,6 +223,7 @@ E.showMenu = (items?: Menu): MenuInstance => {
mode: "updown",
back,
remove: () => {
if (nameScroller) clearInterval(nameScroller);
Bangle.removeListener("swipe", onSwipe);
},
} as SetUIArg<"updown">,
Expand Down

0 comments on commit 753780c

Please sign in to comment.