mirror of https://github.com/espruino/BangleApps
First go
computermacgyver
parent
cd465c12bd
commit
e7c3e983b2
|
|
@ -0,0 +1 @@
|
|||
0.01 First try
|
||||
|
|
@ -0,0 +1,98 @@
|
|||
/* jshint esversion: 6 */
|
||||
const timeFontSize = 6;
|
||||
const dateFontSize = 3;
|
||||
const gmtFontSize = 2;
|
||||
const font = "6x8";
|
||||
|
||||
const xyCenter = g.getWidth() / 2;
|
||||
const xcol1=10;
|
||||
const xcol2=g.getWidth()-xcol1;
|
||||
const yposTime = 75;
|
||||
const yposDate = 130;
|
||||
//const yposYear = 175;
|
||||
//const yposGMT = 220;
|
||||
const yposWorld=170;
|
||||
|
||||
|
||||
var offsets = require("Storage").readJSON("worldclock.settings.json");
|
||||
|
||||
// Check settings for what type our clock should be
|
||||
//var is12Hour = (require("Storage").readJSON("setting.json",1)||{})["12hour"];
|
||||
var secondInterval = undefined;
|
||||
|
||||
function doublenum(x) {
|
||||
return x<10? "0"+x : ""+x;
|
||||
}
|
||||
|
||||
function offset(dt,offset) {
|
||||
return new Date(dt.getTime() + (offset*60*60*1000));
|
||||
}
|
||||
|
||||
function drawSimpleClock() {
|
||||
// get date
|
||||
var d = new Date();
|
||||
var da = d.toString().split(" ");
|
||||
|
||||
g.reset(); // default draw styles
|
||||
// drawSting centered
|
||||
g.setFontAlign(0, 0);
|
||||
|
||||
// draw time
|
||||
var time = da[4].substr(0, 5).split(":");
|
||||
var hours = time[0], minutes = time[1];
|
||||
|
||||
g.setFont(font, timeFontSize);
|
||||
g.drawString(`${hours}:${minutes}`, xyCenter, yposTime, true);
|
||||
|
||||
// draw Day, name of month, Date
|
||||
var date = [da[0], da[1], da[2]].join(" ");
|
||||
g.setFont(font, dateFontSize);
|
||||
|
||||
g.drawString(date, xyCenter, yposDate, true);
|
||||
|
||||
// draw year
|
||||
//g.setFont(font, dateFontSize);
|
||||
//g.drawString(d.getFullYear(), xyCenter, yposYear, true);
|
||||
|
||||
// draw gmt
|
||||
//console.log(d.getTimezoneOffset());//offset to GMT in minutes
|
||||
var gmt = new Date(d.getTime()+(d.getTimezoneOffset()*60*1000));
|
||||
//gmt is now UTC+0
|
||||
|
||||
for (var i=0; i<offsets.length; i++) {
|
||||
g.setFont(font, gmtFontSize);
|
||||
dx=offset(gmt,offsets[i][1]);
|
||||
hours=doublenum(dx.getHours());
|
||||
minutes=doublenum(dx.getMinutes());
|
||||
g.setFontAlign(-1, 0);
|
||||
g.drawString(offsets[i][0],xcol1,yposWorld+i*15, true);
|
||||
g.setFontAlign(1, 0);
|
||||
g.drawString(`${hours}:${minutes}`, xcol2, yposWorld+i*15, true);
|
||||
//g.drawString(gmt, xyCenter, yposWorld, true);
|
||||
}
|
||||
}
|
||||
|
||||
// clean app screen
|
||||
g.clear();
|
||||
Bangle.loadWidgets();
|
||||
Bangle.drawWidgets();
|
||||
|
||||
// refesh every 15 sec when screen is on
|
||||
Bangle.on('lcdPower',on=>{
|
||||
if (secondInterval) clearInterval(secondInterval);
|
||||
secondInterval = undefined;
|
||||
if (on) {
|
||||
secondInterval = setInterval(drawSimpleClock, 15E3);
|
||||
drawSimpleClock(); // draw immediately
|
||||
}
|
||||
});
|
||||
|
||||
// draw now and every 15 sec until display goes off
|
||||
drawSimpleClock();
|
||||
if (Bangle.isLCDOn()) {
|
||||
secondInterval = setInterval(drawSimpleClock, 15E3);
|
||||
}
|
||||
|
||||
// Show launcher when middle button pressed
|
||||
setWatch(Bangle.showLauncher, BTN2, {repeat:false,edge:"falling"});
|
||||
|
||||
|
|
@ -0,0 +1,76 @@
|
|||
<html>
|
||||
<head>
|
||||
<link rel="stylesheet" href="../../css/spectre.min.css">
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<p>You can add up to 4 timezones. Please give a name and UTC offset in hours.
|
||||
If you want less than 4, clear the checkbox to the left.</p>
|
||||
|
||||
<table id="worldclock-offsets">
|
||||
<tr>
|
||||
<th>Enabled?</th>
|
||||
<th>Name</th>
|
||||
<th>UTC Offset</th>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
<p>Click <button id="upload" class="btn btn-primary">Upload</button></p>
|
||||
|
||||
<script src="../../lib/customize.js"></script>
|
||||
|
||||
<script>
|
||||
|
||||
var offsets=[];
|
||||
try{
|
||||
var stored = localStorage.getItem('worldclock-offset-list')
|
||||
if(stored) offsets = JSON.parse(stored);
|
||||
if (!offsets || offsets.length!=4) {
|
||||
throw "Offsets invalid";
|
||||
}
|
||||
} catch(e){
|
||||
offsets=[
|
||||
[true,"Tokyo",9],
|
||||
[true,"Delhi",5.5],
|
||||
[true, "London",0],
|
||||
[true, "São Paulo",-3],
|
||||
];
|
||||
}
|
||||
console.log(offsets);
|
||||
var tbl=document.getElementById("worldclock-offsets");
|
||||
for (var i=0; i<4; i++) {
|
||||
var $offset = document.createElement('tr')
|
||||
$offset.innerHTML = `
|
||||
<td><input type="checkbox" id="enabled_${i}" ${offsets[i][0]? "checked" : ""}></td>
|
||||
<td><input type="text" id="name_${i}" value="${offsets[i][1]}"></td>
|
||||
<td><input type="number" id="offset_${i}" value="${offsets[i][2]}"></td>`
|
||||
tbl.append($offset);
|
||||
}
|
||||
|
||||
// When the 'upload' button is clicked...
|
||||
document.getElementById("upload").addEventListener("click", function() {
|
||||
var storage_offsets=[];
|
||||
var app_offsets=[];
|
||||
for (var i=0; i<4; i++) {
|
||||
var checked=document.getElementById("enabled_"+i).checked;
|
||||
var name=document.getElementById("name_"+i).value;
|
||||
var offset=document.getElementById("offset_"+i).value;
|
||||
if (checked) {
|
||||
app_offsets.push([name,offset]);
|
||||
}
|
||||
storage_offsets.push([checked,name,offset]);
|
||||
}
|
||||
console.log(storage_offsets);
|
||||
console.log(app_offsets);
|
||||
localStorage.setItem('worldclock-offset-list',JSON.stringify(storage_offsets));
|
||||
// send finished app (in addition to contents of app.json)
|
||||
sendCustomizedApp({
|
||||
storage:[
|
||||
{name:"worldclock.settings.json", content:JSON.stringify(timezones)},
|
||||
]
|
||||
});
|
||||
});
|
||||
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
Loading…
Reference in New Issue