mirror of https://github.com/espruino/BangleApps
785 lines
28 KiB
JavaScript
785 lines
28 KiB
JavaScript
/* -*- mode: Javascript; c-basic-offset: 2; indent-tabs-mode: nil; coding: latin-1 -*- */
|
|
// pooqRoman
|
|
//
|
|
// Copyright (c) 2021 Stephen P Spackman
|
|
//
|
|
// Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
// of this software and associated documentation files (the "Software"), to deal
|
|
// in the Software without restriction, including without limitation the rights
|
|
// to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
// copies of the Software, and to permit persons to whom the Software is
|
|
// furnished to do so, subject to the following conditions:
|
|
//
|
|
// The above copyright notice and this permission notice shall be included in all
|
|
// copies or substantial portions of the Software.
|
|
//
|
|
// THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
// FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
// AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
// OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
// SOFTWARE.
|
|
//
|
|
// Notes:
|
|
//
|
|
// This only works for Bangle 2.
|
|
|
|
//////////////////////////////////////////////////////////////////////////////
|
|
/* System integration */
|
|
|
|
const storage = require('Storage');
|
|
|
|
const settings = storage.readJSON("setting.json", true) || {};
|
|
|
|
const alarms = storage.readJSON('alarm.json', true) || [];
|
|
|
|
/*
|
|
{ on : true,
|
|
hr : 6.5, // hours + minutes/60
|
|
msg : "Eat chocolate",
|
|
last : 0, // last day of the month we alarmed on - so we don't alarm twice in one day!
|
|
rp : true, // repeat
|
|
as : false, // auto snooze
|
|
timer : 5, // OPTIONAL - if set, this is a timer and it's the time in minutes
|
|
}
|
|
*/
|
|
|
|
//////////////////////////////////////////////////////////////////////////////
|
|
/* Face-specific options */
|
|
|
|
class Options {
|
|
// Protocol: subclasses must have static id and defaults fields.
|
|
// Only fields named in the defaults will be saved.
|
|
constructor() {
|
|
this.id = this.constructor.id;
|
|
this.file = `${this.id}.json`;
|
|
this.backing = storage.readJSON(this.file, true) || {};
|
|
Object.setPrototypeOf(this.backing, this.constructor.defaults);
|
|
this.reactivator = _ => this.active();
|
|
Object.keys(this.constructor.defaults).forEach(k => this.bless(k));
|
|
}
|
|
|
|
writeBack(delay) {
|
|
if (this.timeout) clearTimeout(this.timeout);
|
|
this.timeout = setTimeout(
|
|
() => {
|
|
this.timeout = null;
|
|
storage.writeJSON(this.file, this.backing);
|
|
},
|
|
delay
|
|
);
|
|
}
|
|
|
|
bless(k) {
|
|
Object.defineProperty(this, k, {
|
|
get: () => this.backing[k],
|
|
set: v => {
|
|
this.backing[k] = v;
|
|
// Ten second writeback delay, since the user will roll values up and down.
|
|
this.writeBack(10000);
|
|
}
|
|
});
|
|
}
|
|
|
|
showMenu(m) {
|
|
if (m instanceof Function) m = m();
|
|
if (m) {
|
|
for (const k in m) if ('init' in m[k]) m[k].value = m[k].init();
|
|
m[''].selected = -1; // Workaround for self-selection bug.
|
|
Bangle.on('drag', this.reactivator);
|
|
this.active();
|
|
} else {
|
|
if (this.bored) clearTimeout(this.bored);
|
|
this.bored = null;
|
|
Bangle.removeListener('drag', this.reactivator);
|
|
this.emit('done');
|
|
}
|
|
g.clear(true);
|
|
E.showMenu(m);
|
|
}
|
|
|
|
active() {
|
|
if (this.bored) clearTimeout(this.bored);
|
|
this.bored = setTimeout(_ => this.showMenu(), 15000);
|
|
}
|
|
|
|
reset() {
|
|
this.backing = {__proto__: this.constructor.defaults};
|
|
this.writeBack(0);
|
|
}
|
|
}
|
|
|
|
class RomanOptions extends Options {
|
|
constructor() {
|
|
super();
|
|
this.menu = {
|
|
'': {title: '* face options *'},
|
|
'< Back': _ => this.showMenu(),
|
|
Ticks: {
|
|
init: _ => this.resolution,
|
|
min: 0, max: 3,
|
|
onchange: x => this.resolution = x,
|
|
format: x => ['seconds', 'seconds (up)', 'minutes', 'hours'][x]
|
|
},
|
|
'Display': {
|
|
init: _ => this.o24h == null ? 0 : 1 + this.o24h,
|
|
min: 0, max: 2,
|
|
onchange: x => this.o24h = [null, 0, 1][x],
|
|
format: x => ['system', '12h', '24h'][x]
|
|
},
|
|
'Day of Week': {
|
|
init: _ => this.dow,
|
|
onchange: x => this.dow = x
|
|
},
|
|
Calendar: {
|
|
init: _ => this.calendric,
|
|
min: 0, max: 2,
|
|
onchange: x => this.calendric = x,
|
|
format: x => ['none', 'day', 'date'][x]
|
|
},
|
|
'Auto-Illum.': {
|
|
init: _ => this.autolight,
|
|
onchange: x => this.autolight = x
|
|
},
|
|
Defaults: _ => {this.reset(); this.interact();}
|
|
};
|
|
}
|
|
|
|
interact() {this.showMenu(this.menu);}
|
|
}
|
|
|
|
RomanOptions.id = 'pooqroman';
|
|
|
|
RomanOptions.defaults = {
|
|
resolution: 1,
|
|
dow: true,
|
|
calendric: 2,
|
|
o24h: !settings["12hour"],
|
|
bg: g.theme.bg,
|
|
fg: g.theme.fg,
|
|
barBg: g.theme.fg,
|
|
barFg: g.theme.bg,
|
|
hourFg: g.theme.fg,
|
|
minuteFg: g.theme.fg,
|
|
secondFg: g.theme.fg2,
|
|
rectFg: g.theme.fg,
|
|
hubFg: g.theme.fg,
|
|
alarmFg: '#f00',
|
|
timerFg: '#0f0',
|
|
activeFg: g.theme.fg2,
|
|
autolight: true,
|
|
};
|
|
|
|
//////////////////////////////////////////////////////////////////////////////
|
|
/* Assets (generated by resourcer.js, in this directory) */
|
|
|
|
const heatshrink = require('heatshrink');
|
|
const dec = x => E.toString(heatshrink.decompress(atob(x)));
|
|
const romanPartsF = [
|
|
dec(
|
|
'wEBsEB3//7//9//+0AjUAguAg3AgYQJjfAgv+gH/8Fg/0gh/AgP4gf2h/j/+BCAP' +
|
|
'wgFggEggEQgEMgEHwEDEIIyDuED3kD7+H9vn2k/hEPgMP4Xevd+j4QB7kA9kAmkA' +
|
|
'hUGgOH8Hn3le4+GgH32PuvfGj+CCAMDgXD4dz+evt9DgcL7fXn87h8NCAMP+Ef/0' +
|
|
'eg+egPugF2j0bCAPAh3wh88h8P/8BNwI'
|
|
), 97, dec('gUDgUGgUJgYFBhsBhMJhgA=='), 17
|
|
];const fontF = [
|
|
dec(
|
|
'AAUwAIM/4F/8HguHAmABBAoIJBBoIUBkEwsEw//wAIIdDBoUQBoIfC+HB+Hj2F/m' +
|
|
'E+CIXAoHEsHMuHcmH8mHuuHH8GBGIUAwEBwEHwH/wH5+EBAIILCCAP8oH8EYXMmA' +
|
|
'BB5wjCgYjCAYMP8E+uF8mHsCIWHCIgCBAIXw4fw54tBgBsBGgUAnKLC99w40wAII' +
|
|
'FBBIINBCIM8gF+iHnmHDuHD8HnDYMAjizEMYJJBn+A+OAAYIHBBYKjDXYKvDYZYP' +
|
|
'D40AAIYMBZYgkC4Hg4DnDuH/8H/BYIVCv/wnEAjwBCAoIJBEIYRFh0Ag8AgPAEYQ' +
|
|
'RCJIJNBfYRXKnFAvlg9ihE8dwsfgkLFHMYgJF8DNCh+AUYWAA4ILBAAJGB/4PB+D' +
|
|
'9CgADCEoIPCJobbBB4IBBAoJdDEgXggvwhuwAIcH8EDRIh/BhkwAIMOuAPCMYQDB' +
|
|
'A4ILBCIcGsECoAPLU4oPDH42ggeAB4XEg/mh1zhkzh03g/+h/4J4nwg0AhjbDRII' +
|
|
'vCt/wAIIVFAoKTBCYIXBDIYHHEIYVFGJJxHSI8P/8H/6hLF44BBM4IABg8gh6NEh' +
|
|
'vwgngBoITBv/Av7PBV4kAsArCfYIVBuEABYNwA4I3BD4cPL4UAM4IXBBYQfC4kP8' +
|
|
'0AucAmcAu8PXogA='
|
|
), 32, dec('gINMgUAhMHhIAGCQ0KAQIKBgwEBgcIBAQVEhIJBhAeIBQIADAoUDEQULBQcHg4FD' +
|
|
'CII='), 16
|
|
];
|
|
const lockI = dec('iMSwMAgfwgf8geHgeB4PA8HguFwnH//9//+4gPf//v//3gE7//9//+8EHCAO///A');
|
|
const batteryI = dec('h8SwMAgPggfAv/4//x//j//H/+P/8f/0//gOOA==');
|
|
const chargeI = dec('h0MwIEBkEBwEMgFwgeAj/w/+AjkA8EDgEYgFAA==');
|
|
const GPSI = dec('iUQwMAhEAgsAgUggFEgEKvEBn0Aj+AgfgglygsJosgxNGiNIgWJ4FBEoM4gA');
|
|
const HRMI = dec('iMRwMAnken8fzfd7v+/3/v9/38/z+b5tiiM3/eP/+D/+AAIM/wEPwEDwEAAIIA==');
|
|
const compassI = dec('iMRwMAgfgg/8g8ng0Q40ImcOjcHg+DwfB4Ph2Hw7FsolmkUxwEwuFwj/wEIMAA==');
|
|
|
|
//////////////////////////////////////////////////////////////////////////////
|
|
/* Squeezable strings */
|
|
|
|
class Formattable {
|
|
width(g) {return this.w != null ? this.w : (this.w = g.stringWidth(this.text));}
|
|
print(g, x, y) {g.drawString(this.text, x, y); return this.width();}
|
|
}
|
|
|
|
class Fixed extends Formattable {
|
|
constructor(text) {
|
|
super();
|
|
this.text = text;
|
|
}
|
|
squeeze() {return false;}
|
|
}
|
|
|
|
class Squeezable extends Formattable {
|
|
constructor(named, index) {
|
|
super();
|
|
this.named = named;
|
|
this.index = index;
|
|
this.end = index + named.forms;
|
|
}
|
|
squeeze() {
|
|
if (this.index >= this.end) return false;
|
|
this.index++;
|
|
this.w = null;
|
|
return true;
|
|
}
|
|
get text() {return this.named.table[this.index];}
|
|
}
|
|
|
|
class Named {
|
|
constructor(forms, table) {
|
|
this.forms = forms;
|
|
this.table = table;
|
|
}
|
|
on(index) {return new Squeezable(this, this.forms * index);}
|
|
}
|
|
|
|
//////////////////////////////////////////////////////////////////////////////
|
|
/* Face */
|
|
|
|
// Static geometry
|
|
const barW = 26, barH = g.getHeight(), barX = g.getWidth() - barW, barY = 0;
|
|
const faceW = g.getWidth() - barW, faceH = g.getHeight();
|
|
const faceX = 0, faceY = 0, faceCX = faceW / 2, faceCY = faceH / 2;
|
|
const rectX = faceX + 35, rectY = faceY + 24, rectW = 80, rectH = 128;
|
|
|
|
// Extended-Roman-numeral labels
|
|
const layout = E.toUint8Array(
|
|
75, 23, // XII
|
|
132, 24, // I
|
|
132, 61, // II
|
|
132, 97, // III
|
|
132, 133, // IV
|
|
132, 170, // V
|
|
75, 171, // VI
|
|
18, 170, // VII
|
|
18, 133, // VIII
|
|
18, 97, // IX
|
|
18, 61, // X
|
|
18, 24 // XI
|
|
);
|
|
|
|
const numeral = (n, options) => [
|
|
'n', // 0
|
|
'abc', // I
|
|
'abdc', // II
|
|
'abddc', // III
|
|
'abefg', // IV
|
|
'hfg', // V
|
|
'hfibc', // VI
|
|
'hfibdc', // VII
|
|
'hfibddc', // VIII
|
|
'abjk', // IX
|
|
'kjk', // X
|
|
'kjbc', // XI
|
|
'kjbdc', // XII
|
|
'kjbddc', // XIII
|
|
'kjbefg', // XIV
|
|
'kjefg', // XV
|
|
'labc', // XVI
|
|
'labdc', // XVII
|
|
'labddc', // XVIII
|
|
'kjbjk', // XIX
|
|
'kjjk', // XX
|
|
'mabc', // XXI
|
|
'mabdc', // XXII
|
|
'mabddc', // XXIII
|
|
][options.o24h ? n % 24 : (n + 11) % 12 + 1];
|
|
|
|
const formatMonth = new Named(4, [
|
|
'January', 'Jan.', 'Jan', 'I',
|
|
'February', 'Feb.', 'Feb', 'II',
|
|
'March', 'Mar.', 'Mar', 'III',
|
|
'April', 'Apr.', 'Apr', 'IV',
|
|
'May', 'May', 'May', 'V',
|
|
'June', 'June', 'Jun', 'VI',
|
|
'July', 'July', 'Jul', 'VII',
|
|
'August', 'Aug.', 'Aug', 'VIII', // VIII *is* narrower than Aug, our I is thin.
|
|
'September', 'Sept.', 'Sep', 'IX',
|
|
'October', 'Oct.', 'Oct', 'X',
|
|
'November', 'Nov.', 'Nov', 'XI',
|
|
'December', 'Dec.', 'Dec', 'XII'
|
|
]);
|
|
const formatDom = {
|
|
on: d => new Fixed(d.toString())
|
|
};
|
|
const formatDow = new Named(4, [
|
|
'Sunday', 'Sun.', 'Sun', 'Su',
|
|
'Monday', 'Mon.', 'Mon', 'M',
|
|
'Tuesday', 'Tues.', 'Tue', 'Tu',
|
|
'Wednesday', 'Weds.', 'Wed', 'W',
|
|
'Thursday', 'Thurs.', 'Thu', 'Th',
|
|
'Friday', 'Fri.', 'Fri', 'F',
|
|
'Saturday', 'Sat.', 'Sat', 'Sa'
|
|
]);
|
|
|
|
const hceil = x => Math.ceil(x / 3600000) * 3600000;
|
|
const hfloor = x => Math.floor(x / 3600000) * 3600000;
|
|
const isString = x => typeof x == 'string';
|
|
const imageWidth = i => isString(i) ? i.charCodeAt(0) : i.width;
|
|
const imageHeight = i => isString(i) ? i.charCodeAt(1) : i.height;
|
|
|
|
const events = {
|
|
// Items are {time: number, wall: boolean, priority: number,
|
|
// past: bool, future: bool, precision: number,
|
|
// colour: colour, dramatic?: bool, event?: any}
|
|
fixed: [{time: Number.POSITIVE_INFINITY}], // indexed by ms absolute
|
|
wall: [{time: Number.POSITIVE_INFINITY}], // indexed by nominal ms + TZ ms
|
|
|
|
clean: function(now, l) {
|
|
let o = now.getTimezoneOffset() * 60000;
|
|
let tf = now.getTime() + l, tw = tf - o;
|
|
// Discard stale events:
|
|
while (this.wall[0].time <= tw) this.wall.shift();
|
|
while (this.fixed[0].time <= tf) this.fixed.shift();
|
|
},
|
|
|
|
scan: function(now, from, to, f) {
|
|
result = Infinity;
|
|
let o = now.getTimezoneOffset() * 60000;
|
|
let t = now.getTime() - o;
|
|
let c, p, i, l = from - o, h = to - o;
|
|
for (i = 0; (c = this.wall[i]).time < l; i++) ;
|
|
for (; (c = this.wall[i]).time < h; i++) {
|
|
p = c.time < t;
|
|
if (p ? c.past : c.future)
|
|
result = Math.min(result, f(c, new Date(c.time + o), p));
|
|
}
|
|
l += o; h += o; t += o;
|
|
for (i = 0; (c = this.fixed[i]).time < l; i++) ;
|
|
for (; (c = this.fixed[i]).time < h; i++) {
|
|
p = c.time < t;
|
|
if (p ? c.past : c.future)
|
|
result = Math.min(f(c, new Date(c.time), p));
|
|
}
|
|
return result;
|
|
},
|
|
|
|
span: function(now, from, to, width) {
|
|
let o = now.getTimezoneOffset() * 60000;
|
|
let t = now.getTime() - o;
|
|
let lfence = [], rfence = [];
|
|
this.scan(now, from, to, (e, d, p) => {
|
|
if (p) {
|
|
for (let j = 0; j <= e.priority; j++) {
|
|
if (d < (lfence[e.priority] || t)) lfence[e.priority] = d;
|
|
}
|
|
} else {
|
|
for (let j = 0; j <= e.priority; j++) {
|
|
if (d > (rfence[e.priority] || t)) rfence[e.priority] = d;
|
|
}
|
|
}
|
|
});
|
|
for (let j = 0; ; j += 0.5) {
|
|
if ((rfence[Math.ceil(j)] - lfence[Math.floor(j)] || 0) <= width) {
|
|
return [lfence[Math.floor(j)] || now, rfence[Math.ceil(j)] || now];
|
|
}
|
|
}
|
|
},
|
|
|
|
insert: function(t, wall, e) {
|
|
let v = wall ? this.wall : this.fixed;
|
|
e.time = t = t - (wall ? t.getTimezoneOffset() * 60000 : 0);
|
|
v.splice(v.findIndex(x => x.time > t), 0, e);
|
|
},
|
|
|
|
loadFromSystem: function(options) {
|
|
alarms.forEach(x => {
|
|
if (x.on) {
|
|
const t = new Date();
|
|
let h = x.hr;
|
|
let m = h % 1 * 60;
|
|
let s = m % 1 * 60;
|
|
let ms = s % 1 * 1000;
|
|
t.setHours(h - h % 1, m - m % 1, s - s % 1, ms);
|
|
// There's a race condition here, but I'm not sure what we can do about it.
|
|
if (t < Date.now() || x.last === t.getDate()) t.setDate(t.getDate() + 1);
|
|
this.insert(t, true, {
|
|
priority: 0,
|
|
past: false, // System alarms seem uninteresting if past?
|
|
future: true,
|
|
precision: x.timer ? 1000 : 60000,
|
|
colour: x.timer ? options.timerFg : options.alarmFg,
|
|
event: x
|
|
});
|
|
}
|
|
});
|
|
return this;
|
|
},
|
|
};
|
|
|
|
//////////////////////////////////////////////////////////////////////////////
|
|
/* The main face logic */
|
|
|
|
class Sidebar {
|
|
constructor(g, x, y, w, h, options) {
|
|
this.g = g;
|
|
this.options = options;
|
|
this.x = x;
|
|
this.y = this.initY = y;
|
|
this.h = h;
|
|
this.rate = Infinity;
|
|
this.doLocked = Sidebar.status(_ => Bangle.isLocked(), lockI);
|
|
this.doHRM = Sidebar.status(_ => Bangle.isHRMOn(), HRMI);
|
|
this.doGPS = Sidebar.status(_ => Bangle.isGPSOn(), GPSI, Sidebar.gpsColour(options));
|
|
}
|
|
reset(rate) {this.y = this.initY; this.rate = rate; return this;}
|
|
print(t) {
|
|
this.y += 4 + t.print(
|
|
this.g.setColor(this.options.barFg).setFontAlign(-1, 1, 1),
|
|
this.x + 3, this.y + 4
|
|
);
|
|
return this;
|
|
}
|
|
pad(n) {this.y += n; return this;}
|
|
free() {return this.h - this.y;}
|
|
static status(p, i, c) {
|
|
return function() {
|
|
if (p()) {
|
|
this.g.setColor(c ? c() : this.options.barFg)
|
|
.drawImage(i, this.x + 4, this.y += 4);
|
|
this.y += imageHeight(i);
|
|
}
|
|
return this;
|
|
};
|
|
}
|
|
static gpsColour(o) {
|
|
const fix = Bangle.getGPSFix();
|
|
return fix && fix.fix ? o.activeFg : o.barFg;
|
|
}
|
|
doPower() {
|
|
const c = Bangle.isCharging();
|
|
const b = E.getBattery();
|
|
if (c || b < 50) {
|
|
let g = this.g, x = this.x, y = this.y, options = this.options;
|
|
g.setColor(options.barFg).drawImage(batteryI, x + 4, y + 4);
|
|
g.setColor(b <= 10 ? '#f00' : b <= 30 ? '#ff0' : '#0f0');
|
|
const h = 13 * (100 - b) / 100;
|
|
g.fillRect(x + 8, y + 7 + h, x + 17, y + 20);
|
|
// Espruino disallows blank leading rows in icons, for some reason.
|
|
if (c) g.setColor(options.barBg).drawImage(chargeI, x + 4, y + 8);
|
|
this.y = y + imageHeight(batteryI) + 4;
|
|
}
|
|
return this;
|
|
}
|
|
doCompass() {
|
|
if (Bangle.isCompassOn()) {
|
|
const c = Bangle.getCompass();
|
|
const a = c && this.rate <= 1000;
|
|
this.g.setColor(a ? this.options.activeFg : this.options.barFg).drawImage(
|
|
compassI,
|
|
this.x + 4 + imageWidth(compassI) / 2,
|
|
this.y + 4 + imageHeight(compassI) / 2,
|
|
a ? {rotate: (360-c.heading) / 180 * Math.PI} : undefined
|
|
);
|
|
this.y += 4 + imageHeight(compassI);
|
|
}
|
|
return this;
|
|
}
|
|
}
|
|
|
|
class Roman {
|
|
constructor(g, events) {
|
|
this.g = g;
|
|
this.state = null;
|
|
const options = this.options = new RomanOptions();
|
|
this.events = events.loadFromSystem(this.options);
|
|
this.timescales = [1000, [1000, 60000], 60000, 3600000];
|
|
this.sidebar = new Sidebar(g, barX, barY, barW, barH, options);
|
|
this.hours = Roman.hand(g, 3, 0.5, 12, _ => options.hourFg);
|
|
this.minutes = Roman.hand(g, 2, 0.9, 60, _ => options.minuteFg);
|
|
this.seconds = Roman.hand(g, 1, 0.9, 60, _ => options.secondFg);
|
|
}
|
|
|
|
reset() {this.state = null;}
|
|
|
|
doIcons(which) {this.state.iconsOk = null;}
|
|
|
|
// Watch hands. These could be improved, graphically.
|
|
// If we restricted them to 60 positions, we could feasibly hand-draw them?
|
|
static hand(g, w, l, d, c) {
|
|
return p => {
|
|
g.setColor(c());
|
|
p = ((12 * p / d) + 1) % 12;
|
|
let h = l * rectW / 2;
|
|
let v = l * rectH / 2;
|
|
let poly =
|
|
p <= 2 ? [faceCX + w, faceCY, faceCX - w, faceCY,
|
|
faceCX + h * (p - 1), faceCY - v,
|
|
faceCX + h * (p - 1) + 1, faceCY - v]
|
|
: p < 6 ? [faceCX + 1, faceCY + w, faceCX + 1, faceCY - w,
|
|
faceCX + h, faceCY + v / 2 * (p - 4),
|
|
faceCX + h, faceCY + v / 2 * (p - 4) + 1]
|
|
: p <= 8 ? [faceCX - w, faceCY + 1, faceCX + w, faceCY + 1,
|
|
faceCX - h * (p - 7), faceCY + v,
|
|
faceCX - h * (p - 7) - 1, faceCY + v]
|
|
: [faceCX, faceCY - w, faceCX, faceCY + w,
|
|
faceCX - h, faceCY - v / 2 * (p - 10),
|
|
faceCX - h, faceCY - v / 2 * (p - 10) - 1];
|
|
g.fillPoly(poly);
|
|
};
|
|
}
|
|
|
|
static pos(p, r) {
|
|
let h = r * rectW / 2;
|
|
let v = r * rectH / 2;
|
|
p = (p + 1) % 12;
|
|
return p <= 2 ? [faceCX + h * (p - 1), faceCY - v]
|
|
: p < 6 ? [faceCX + h, faceCY + v / 2 * (p - 4)]
|
|
: p <= 8 ? [faceCX - h * (p - 7), faceCY + v]
|
|
: [faceCX - h, faceCY - v / 2 * (p - 10)];
|
|
}
|
|
|
|
alert(e, date, now, past) {
|
|
const g = this.g;
|
|
g.setColor(e.colour);
|
|
const dt = date - now;
|
|
if (e.precision < 60000 && dt >= 0 && e.future && dt <= 59000) { // Seconds away
|
|
const p = Roman.pos(date.getSeconds() / 5, 0.95);
|
|
g.drawLine(faceCX, faceCY, p[0], p[1]);
|
|
return 1000;
|
|
} else if (e.precision < 3600000 && dt >= 0 && e.future && dt <= 3540000) { // Minutes away
|
|
const p = Roman.pos(date.getMinutes() / 5 + date.getSeconds() / 300, 0.8);
|
|
g.drawLine(p[0] - 5, p[1], p[0] + 5, p[1]);
|
|
g.drawLine(p[0], p[1] - 5, p[0], p[1] + 5);
|
|
return dt < 119000 ? 1000 : 60000; // Turn on second hand two minutes up.
|
|
} else if (e.precision < 43200000 && dt >= 0 ? e.future : e.past) { // Hours away
|
|
const p = Roman.pos(date.getHours() + date.getMinutes() / 60, 0.6);
|
|
const poly = [p[0] - 4, p[1], p[0], p[1] - 4, p[0] + 4, p[1], p[0], p[1] + 4];
|
|
if (date >= now) g.fillPoly(poly);
|
|
else g.drawPoly(poly, true);
|
|
return 3600000;
|
|
}
|
|
return Infinity;
|
|
}
|
|
|
|
render(d, rate) {
|
|
const g = this.g;
|
|
const state = this.state || (g.clear(true), this.state = {});
|
|
const options = this.options;
|
|
const events = this.events;
|
|
events.clean(d, -39600000); // 11h
|
|
|
|
// Sidebar: icons and date
|
|
if (d.getDate() !== state.date || !state.iconsOk) {
|
|
const sidebar = this.sidebar;
|
|
state.date = d.getDate();
|
|
state.iconsOk = true;
|
|
g.setColor(options.barBg).fillRect(barX, barY, barX + barW, barY + barH);
|
|
|
|
sidebar.reset(rate).doLocked().doPower().doGPS().doHRM().doCompass();
|
|
g.setFontCustom.apply(g, fontF);
|
|
let formatters = [];
|
|
let month, dom, dow;
|
|
if (options.calendric > 1) {
|
|
formatters.push(month = formatMonth.on(d.getMonth()));
|
|
}
|
|
if (options.calendric > 0) {
|
|
formatters.push(dom = formatDom.on(d.getDate()));
|
|
}
|
|
if (options.dow) {
|
|
formatters.push(dow = formatDow.on(d.getDay()));
|
|
}
|
|
// Obnoxiously inefficient iterative method :(
|
|
let ava = sidebar.free() - 3, use, i = 0, j = 0;
|
|
while ((use = formatters.reduce((l, f) => l + f.width(g) + 4, 0)) > ava &&
|
|
j < formatters.length)
|
|
for (j = 0;
|
|
!formatters[i++ % formatters.length].squeeze() &&
|
|
j < formatters.length;
|
|
j++) ;
|
|
if (dow) sidebar.print(dow);
|
|
sidebar.pad(ava - use);
|
|
if (month) sidebar.print(month);
|
|
if (dom) sidebar.print(dom);
|
|
}
|
|
|
|
// Hour labels and (purely aesthetic) box; clear inner face.
|
|
let keyHour = d.getHours() < 12 ? 1 : 13;
|
|
let alertSpan = events.span(d, hceil(d) - 39600000, hfloor(d) + 39600000, 39600000);
|
|
let l = alertSpan[0].getHours(), h = alertSpan[1].getHours();
|
|
if ((l - keyHour + 24) % 24 >= 12 || (h - keyHour + 24) % 24 >= 12) keyHour = l;
|
|
if (keyHour !== state.keyHour) {
|
|
state.keyHour = keyHour;
|
|
g.setColor(options.bg)
|
|
.fillRect(faceX, faceY, faceX + faceW, faceY + faceH)
|
|
.setFontCustom.apply(g, romanPartsF)
|
|
.setFontAlign(0, 1)
|
|
.setColor(options.fg);
|
|
// In order to deal with timezone changes more logic will be required,
|
|
// since the labels may be in unusual locations (even offset when
|
|
// a non-integral zone is involved). The value of keyHour can be
|
|
// anything in [hr-12, hr] mod 24.
|
|
for (let h = keyHour; h < keyHour + 12; h++) {
|
|
g.drawString(
|
|
numeral(h % 24, options),
|
|
faceX + layout[h % 12 * 2],
|
|
faceY + layout[h % 12 * 2 + 1]
|
|
);
|
|
}
|
|
g.setColor(options.rectFg)
|
|
.drawRect(rectX, rectY, rectX + rectW - 1, rectY + rectH - 1);
|
|
} else {
|
|
g.setColor(options.bg)
|
|
.fillRect(rectX + 1, rectY + 1, rectX + rectW - 2, rectY + rectH - 2)
|
|
.setColor(options.fg);
|
|
}
|
|
|
|
// Alerts
|
|
let requestedRate = events.scan(
|
|
d, hfloor(alertSpan[0] + 0), hceil(alertSpan[1] + 0) + 1,
|
|
(e, t, p) => this.alert(e, t, d, p)
|
|
);
|
|
if (rate > requestedRate) rate = requestedRate;
|
|
|
|
// Hands
|
|
// Here we are using incremental hands for hours and minutes.
|
|
// If we quantised, we could use hand-crafted bitmaps, though.
|
|
this.hours(d.getHours() + d.getMinutes() / 60);
|
|
if (rate < 3600000) {
|
|
this.minutes(d.getMinutes() + d.getSeconds() / 60);
|
|
}
|
|
if (rate < 60000) this.seconds(d.getSeconds());
|
|
g.setColor(options.hubFg).fillCircle(faceCX, faceCY, 3);
|
|
return requestedRate;
|
|
}
|
|
}
|
|
|
|
//////////////////////////////////////////////////////////////////////////////
|
|
/* Master clock */
|
|
|
|
class Clock {
|
|
constructor(face) {
|
|
this.face = face;
|
|
this.timescales = face.timescales;
|
|
this.options = face.options;
|
|
this.rates = {};
|
|
|
|
this.options.on('done', () => this.start());
|
|
|
|
this.listeners = {
|
|
charging: _ => {face.doIcons('charging'); this.active();},
|
|
lock: _ => {face.doIcons('locked'); this.active();},
|
|
faceUp: up => {this.conservative = !up; this.active();},
|
|
twist: _ => this.options.autolight && Bangle.setLCDPower(true),
|
|
drag: e => {
|
|
if (this.t0) {
|
|
if (e.b) {
|
|
e.x < this.xN && (this.xN = e.x) || e.x > this.xX && (this.xX = e.x);
|
|
e.y < this.yN && (this.yN = e.y) || e.y > this.yX && (this.yX = e.y);
|
|
} else if (this.xX - this.xN < 20) {
|
|
if (e.y - this.e0.y < -50) {
|
|
this.options.resolution > 0 && this.options.resolution--;
|
|
this.rates.clock = this.timescales[this.options.resolution];
|
|
this.active();
|
|
} else if (e.y - this.e0.y > 50) {
|
|
this.options.resolution < this.timescales.length - 1 &&
|
|
this.options.resolution++;
|
|
this.rates.clock = this.timescales[this.options.resolution];
|
|
this.active();
|
|
} else if (this.yX - this.yN < 20 && Date.now() - this.t0 > 500) {
|
|
this.stop();
|
|
this.options.interact();
|
|
}
|
|
this.t0 = null;
|
|
}
|
|
} else if (e.b) {
|
|
this.t0 = Date.now(); this.e0 = e;
|
|
this.xN = this.xX = e.x; this.yN = this.yX = e.y;
|
|
}
|
|
}
|
|
};
|
|
}
|
|
|
|
redraw(rate) {
|
|
const now = this.updated = new Date();
|
|
if (this.refresh) this.face.reset();
|
|
this.refresh = false;
|
|
rate = this.face.render(now, rate);
|
|
if (rate !== this.rates.face) {
|
|
this.rates.face = rate;
|
|
this.active();
|
|
}
|
|
return this;
|
|
}
|
|
|
|
inactive() {
|
|
this.timeout && clearTimeout(this.timeout);
|
|
this.exception && clearTimeout(this.exception);
|
|
this.interval && clearInterval(this.interval);
|
|
this.timeout = this.exception = this.interval = this.rate = null;
|
|
this.face.reset(); // Cancel any ongoing background rendering
|
|
return this;
|
|
}
|
|
|
|
active() {
|
|
const prev = this.rate;
|
|
const now = Date.now();
|
|
let rate = Infinity;
|
|
for (const k in this.rates) {
|
|
let r = this.rates[k];
|
|
r === +r || (r = r[+this.conservative])
|
|
r < rate && (rate = r);
|
|
}
|
|
const delay = rate - now % rate + 1;
|
|
this.refresh = true;
|
|
if (rate !== prev) {
|
|
this.inactive();
|
|
this.redraw(rate);
|
|
if (rate < 31622400000) { // A year!
|
|
this.timeout = setTimeout(
|
|
() => {
|
|
this.inactive();
|
|
this.interval = setInterval(() => this.redraw(rate), rate);
|
|
if (delay > 1000) this.redraw(rate);
|
|
this.rate = rate;
|
|
}, delay
|
|
);
|
|
}
|
|
} else if (rate > 1000) {
|
|
if (!this.exception) this.exception = setTimeout(() => {
|
|
this.redraw(rate);
|
|
this.exception = null;
|
|
}, this.updated + 1000 - Date.now());
|
|
}
|
|
return this;
|
|
}
|
|
|
|
stop() {
|
|
this.inactive();
|
|
for (const l in this.listeners) {
|
|
Bangle.removeListener(l, this.listeners[l]);
|
|
}
|
|
return this;
|
|
}
|
|
|
|
start() {
|
|
this.inactive(); // Reset to known state.
|
|
this.conservative = false;
|
|
this.rates.clock = this.timescales[this.options.resolution];
|
|
this.active();
|
|
for (const l in this.listeners) {
|
|
Bangle.on(l, this.listeners[l]);
|
|
}
|
|
Bangle.setUI('clock');
|
|
return this;
|
|
}
|
|
}
|
|
|
|
//////////////////////////////////////////////////////////////////////////////
|
|
/* Main */
|
|
|
|
const clock = new Clock(new Roman(g, events)).start();
|