Espruino/libs/js/banglejs/E_showScroller.js
Gordon Williams 95ea8838ff Bangle.js1: Add 'back' option to E.showScroller and Bangle.setUI
Bangle.js1: setUI button handlers now work on falling edge
            Bangle.js: Add setUI custom 'swipe' handler
2022-03-02 15:41:41 +00:00

79 lines
2.0 KiB
JavaScript

(function(options) {
/* options = {
h = height
c = # of items
draw = function(idx, rect, selected)
select = function(idx)
}*/
if (!options) return Bangle.setUI();
var w = Bangle.appRect.w;
var h = Bangle.appRect.h;
var X = Bangle.appRect.x;
var Y = Bangle.appRect.y;
var s = {
scroll : 0|options.scroll,
draw : function(idx) {
g.reset();
// prefer drawing the list so that the selected item is in the middle of the screen
var y=Math.floor((h-options.h)/2)-s.scroll*options.h;
var ty=y+options.c*options.h;
if (ty<=h) y += (h-ty);
if (y>0) y = 0;
ty=y;
// draw
for (var i=0;i<options.c;i++) {
if ((idx===undefined)||(idx===i)) {
if ((y>-options.h+1)&&(y<h)) {
g.setColor((i==s.scroll)?g.theme.fgH:g.theme.fg)
.setBgColor((i==s.scroll)?g.theme.bgH:g.theme.bg)
.setClipRect(X,Y+Math.max(0,y),X+w-1,Y+Math.min(h,y+options.h)-1);
if (!options.draw(i,{x:X,y:Y+y,w:w,h:options.h},i==s.scroll)) {
// border for selected
if (i==s.scroll) {
g.setColor(g.theme.fgH)
.drawRect(X,Y+y,X+w-1,Y+y+options.h-1)
.drawRect(X+1,Y+y+1,X+w-2,Y+y+options.h-2);
}
}
}
}
y+=options.h;
}
// arrows
g.setClipRect(X,Y,X+w-1,Y+h-1);
var p,m=w/2;
if (ty<0) {
p=[X+m,Y,X+m-14,Y+14,X+m+14,Y+14];
g.setColor(g.theme.fg)
.fillPoly(p)
.setColor(g.theme.bg)
.drawPoly(p,true);
}
if (y>h) {
p=[X+m,Y+h,X+m-14,Y+h-14,X+m+14,Y+h-14];
g.setColor(g.theme.fg)
.fillPoly(p)
.setColor(g.theme.bg)
.drawPoly(p,true);
}
},
drawItem : idx => draw(idx)
};
g.reset().clearRect(X,Y,X+w-1,Y+h-1);
s.draw();
Bangle.setUI({mode:"updown", back:options.back},dir=>{
if (dir) {
s.scroll += dir;
if (s.scroll<0) s.scroll = options.c-1;
if (s.scroll>=options.c) s.scroll = 0;
s.draw();
} else {
options.select(s.scroll);
}
});
return s;
})