mirror of https://github.com/espruino/BangleApps
Adding app id to clockinfo to ensure clock faces remember their own settings
parent
1f30066c7d
commit
b3d251f681
|
@ -6,3 +6,4 @@
|
||||||
0.06: ClockInfo Fix: Use .get instead of .show as .show is not implemented for weather etc.
|
0.06: ClockInfo Fix: Use .get instead of .show as .show is not implemented for weather etc.
|
||||||
0.07: Use clock_info.addInteractive instead of a custom implementation
|
0.07: Use clock_info.addInteractive instead of a custom implementation
|
||||||
0.08: Use clock_info module as an app
|
0.08: Use clock_info module as an app
|
||||||
|
0.09: clock_info now uses app name to maintain settings specifically for this clock face
|
|
@ -193,6 +193,7 @@ function queueDraw() {
|
||||||
*/
|
*/
|
||||||
let clockInfoItems = clock_info.load();
|
let clockInfoItems = clock_info.load();
|
||||||
let clockInfoMenu = clock_info.addInteractive(clockInfoItems, {
|
let clockInfoMenu = clock_info.addInteractive(clockInfoItems, {
|
||||||
|
app : "aiclock",
|
||||||
x : 0,
|
x : 0,
|
||||||
y: 0,
|
y: 0,
|
||||||
w: W,
|
w: W,
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
"name": "AI Clock",
|
"name": "AI Clock",
|
||||||
"shortName":"AI Clock",
|
"shortName":"AI Clock",
|
||||||
"icon": "aiclock.png",
|
"icon": "aiclock.png",
|
||||||
"version":"0.08",
|
"version":"0.09",
|
||||||
"readme": "README.md",
|
"readme": "README.md",
|
||||||
"supports": ["BANGLEJS2"],
|
"supports": ["BANGLEJS2"],
|
||||||
"dependencies" : { "clock_info":"module" },
|
"dependencies" : { "clock_info":"module" },
|
||||||
|
|
|
@ -1,2 +1,3 @@
|
||||||
0.01: first release
|
0.01: first release
|
||||||
0.02: Use clock_info module as an app
|
0.02: Use clock_info module as an app
|
||||||
|
0.03: clock_info now uses app name to maintain settings specifically for this clock face
|
|
@ -37,13 +37,13 @@ Graphics.prototype.setFontLatoSmall = function(scale) {
|
||||||
{
|
{
|
||||||
// must be inside our own scope here so that when we are unloaded everything disappears
|
// must be inside our own scope here so that when we are unloaded everything disappears
|
||||||
// we also define functions using 'let fn = function() {..}' for the same reason. function decls are global
|
// we also define functions using 'let fn = function() {..}' for the same reason. function decls are global
|
||||||
|
|
||||||
let draw = function() {
|
let draw = function() {
|
||||||
var date = new Date();
|
var date = new Date();
|
||||||
var timeStr = require("locale").time(date,1);
|
var timeStr = require("locale").time(date,1);
|
||||||
var h = g.getHeight();
|
var h = g.getHeight();
|
||||||
var w = g.getWidth();
|
var w = g.getWidth();
|
||||||
|
|
||||||
g.reset();
|
g.reset();
|
||||||
g.setColor(g.theme.bg);
|
g.setColor(g.theme.bg);
|
||||||
g.fillRect(Bangle.appRect);
|
g.fillRect(Bangle.appRect);
|
||||||
|
@ -66,7 +66,7 @@ Graphics.prototype.setFontLatoSmall = function(scale) {
|
||||||
/**
|
/**
|
||||||
* clock_info_support
|
* clock_info_support
|
||||||
* this is the callback function that get invoked by clockInfoMenu.redraw();
|
* this is the callback function that get invoked by clockInfoMenu.redraw();
|
||||||
*
|
*
|
||||||
* We will display the image and text on the same line and centre the combined
|
* We will display the image and text on the same line and centre the combined
|
||||||
* length of the image+text
|
* length of the image+text
|
||||||
*
|
*
|
||||||
|
@ -76,7 +76,7 @@ Graphics.prototype.setFontLatoSmall = function(scale) {
|
||||||
//g.reset().setFont('Vector',24).setBgColor(options.bg).setColor(options.fg);
|
//g.reset().setFont('Vector',24).setBgColor(options.bg).setColor(options.fg);
|
||||||
g.reset().setFontLatoSmall();
|
g.reset().setFontLatoSmall();
|
||||||
g.setBgColor(options.bg).setColor(options.fg);
|
g.setBgColor(options.bg).setColor(options.fg);
|
||||||
|
|
||||||
//use info.text.toString(), steps does not have length defined
|
//use info.text.toString(), steps does not have length defined
|
||||||
var text_w = g.stringWidth(info.text.toString());
|
var text_w = g.stringWidth(info.text.toString());
|
||||||
// gap between image and text
|
// gap between image and text
|
||||||
|
@ -88,7 +88,7 @@ Graphics.prototype.setFontLatoSmall = function(scale) {
|
||||||
|
|
||||||
// clear the whole info line, allow additional 2 pixels in case LatoFont overflows area
|
// clear the whole info line, allow additional 2 pixels in case LatoFont overflows area
|
||||||
g.clearRect(0, options.y -2, g.getWidth(), options.y+ 23 + 2);
|
g.clearRect(0, options.y -2, g.getWidth(), options.y+ 23 + 2);
|
||||||
|
|
||||||
// draw the image if we have one
|
// draw the image if we have one
|
||||||
if (info.img) {
|
if (info.img) {
|
||||||
// image start
|
// image start
|
||||||
|
@ -110,8 +110,8 @@ Graphics.prototype.setFontLatoSmall = function(scale) {
|
||||||
// clock_info_support
|
// clock_info_support
|
||||||
// setup the way we wish to interact with the menu
|
// setup the way we wish to interact with the menu
|
||||||
// the hl property defines the color the of the info when the menu is selected after tapping on it
|
// the hl property defines the color the of the info when the menu is selected after tapping on it
|
||||||
let clockInfoMenu = require("clock_info").addInteractive(clockInfoItems, { x:64, y:132, w:50, h:40, draw : clockInfoDraw, bg : g.theme.bg, fg : g.theme.fg, hl : "#0ff"} );
|
let clockInfoMenu = require("clock_info").addInteractive(clockInfoItems, { app : "lato", x:64, y:132, w:50, h:40, draw : clockInfoDraw, bg : g.theme.bg, fg : g.theme.fg, hl : "#0ff"} );
|
||||||
|
|
||||||
// timeout used to update every minute
|
// timeout used to update every minute
|
||||||
var drawTimeout;
|
var drawTimeout;
|
||||||
g.clear();
|
g.clear();
|
||||||
|
|
|
@ -37,13 +37,13 @@ Graphics.prototype.setFontLatoSmall = function(scale) {
|
||||||
{
|
{
|
||||||
// must be inside our own scope here so that when we are unloaded everything disappears
|
// must be inside our own scope here so that when we are unloaded everything disappears
|
||||||
// we also define functions using 'let fn = function() {..}' for the same reason. function decls are global
|
// we also define functions using 'let fn = function() {..}' for the same reason. function decls are global
|
||||||
|
|
||||||
let draw = function() {
|
let draw = function() {
|
||||||
var date = new Date();
|
var date = new Date();
|
||||||
var timeStr = require("locale").time(date,1);
|
var timeStr = require("locale").time(date,1);
|
||||||
var h = g.getHeight();
|
var h = g.getHeight();
|
||||||
var w = g.getWidth();
|
var w = g.getWidth();
|
||||||
|
|
||||||
g.reset();
|
g.reset();
|
||||||
g.setColor(g.theme.bg);
|
g.setColor(g.theme.bg);
|
||||||
g.fillRect(Bangle.appRect);
|
g.fillRect(Bangle.appRect);
|
||||||
|
@ -66,7 +66,7 @@ Graphics.prototype.setFontLatoSmall = function(scale) {
|
||||||
/**
|
/**
|
||||||
* clock_info_support
|
* clock_info_support
|
||||||
* this is the callback function that get invoked by clockInfoMenu.redraw();
|
* this is the callback function that get invoked by clockInfoMenu.redraw();
|
||||||
*
|
*
|
||||||
* We will display the image and text on the same line and centre the combined
|
* We will display the image and text on the same line and centre the combined
|
||||||
* length of the image+text
|
* length of the image+text
|
||||||
*
|
*
|
||||||
|
@ -76,7 +76,7 @@ Graphics.prototype.setFontLatoSmall = function(scale) {
|
||||||
//g.reset().setFont('Vector',24).setBgColor(options.bg).setColor(options.fg);
|
//g.reset().setFont('Vector',24).setBgColor(options.bg).setColor(options.fg);
|
||||||
g.reset().setFontLatoSmall();
|
g.reset().setFontLatoSmall();
|
||||||
g.setBgColor(options.bg).setColor(options.fg);
|
g.setBgColor(options.bg).setColor(options.fg);
|
||||||
|
|
||||||
//use info.text.toString(), steps does not have length defined
|
//use info.text.toString(), steps does not have length defined
|
||||||
var text_w = g.stringWidth(info.text.toString());
|
var text_w = g.stringWidth(info.text.toString());
|
||||||
// gap between image and text
|
// gap between image and text
|
||||||
|
@ -88,7 +88,7 @@ Graphics.prototype.setFontLatoSmall = function(scale) {
|
||||||
|
|
||||||
// clear the whole info line, allow additional 2 pixels in case LatoFont overflows area
|
// clear the whole info line, allow additional 2 pixels in case LatoFont overflows area
|
||||||
g.clearRect(0, options.y -2, g.getWidth(), options.y+ 23 + 2);
|
g.clearRect(0, options.y -2, g.getWidth(), options.y+ 23 + 2);
|
||||||
|
|
||||||
// draw the image if we have one
|
// draw the image if we have one
|
||||||
if (info.img) {
|
if (info.img) {
|
||||||
// image start
|
// image start
|
||||||
|
@ -110,8 +110,8 @@ Graphics.prototype.setFontLatoSmall = function(scale) {
|
||||||
// clock_info_support
|
// clock_info_support
|
||||||
// setup the way we wish to interact with the menu
|
// setup the way we wish to interact with the menu
|
||||||
// the hl property defines the color the of the info when the menu is selected after tapping on it
|
// the hl property defines the color the of the info when the menu is selected after tapping on it
|
||||||
let clockInfoMenu = require("clock_info").addInteractive(clockInfoItems, { x:64, y:132, w:50, h:40, draw : clockInfoDraw, bg : g.theme.bg, fg : g.theme.fg, hl : "#0ff"} );
|
let clockInfoMenu = require("clock_info").addInteractive(clockInfoItems, { app : "lato", x:64, y:132, w:50, h:40, draw : clockInfoDraw, bg : g.theme.bg, fg : g.theme.fg, hl : "#0ff"} );
|
||||||
|
|
||||||
// timeout used to update every minute
|
// timeout used to update every minute
|
||||||
var drawTimeout;
|
var drawTimeout;
|
||||||
g.clear();
|
g.clear();
|
||||||
|
|
|
@ -64,7 +64,7 @@ function queueDraw() {
|
||||||
/**
|
/**
|
||||||
* clock_info_support
|
* clock_info_support
|
||||||
* this is the callback function that get invoked by clockInfoMenu.redraw();
|
* this is the callback function that get invoked by clockInfoMenu.redraw();
|
||||||
*
|
*
|
||||||
* We will display the image and text on the same line and centre the combined
|
* We will display the image and text on the same line and centre the combined
|
||||||
* length of the image+text
|
* length of the image+text
|
||||||
*
|
*
|
||||||
|
@ -109,8 +109,8 @@ let clockInfoItems = require("clock_info").load();
|
||||||
* selected after tapping on it
|
* selected after tapping on it
|
||||||
*
|
*
|
||||||
*/
|
*/
|
||||||
let clockInfoMenu = require("clock_info").addInteractive(clockInfoItems, { x:64, y:132, w:50, h:40, draw : clockInfoDraw, bg : g.theme.bg, fg : g.theme.fg, hl : "#0ff"} );
|
let clockInfoMenu = require("clock_info").addInteractive(clockInfoItems, { app : "lato", x:64, y:132, w:50, h:40, draw : clockInfoDraw, bg : g.theme.bg, fg : g.theme.fg, hl : "#0ff"} );
|
||||||
|
|
||||||
g.clear();
|
g.clear();
|
||||||
|
|
||||||
// Show launcher when middle button pressed
|
// Show launcher when middle button pressed
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
{
|
{
|
||||||
"id": "lato",
|
"id": "lato",
|
||||||
"name": "Lato",
|
"name": "Lato",
|
||||||
"version": "0.02",
|
"version": "0.03",
|
||||||
"description": "A Lato Font clock with fast load and clock_info",
|
"description": "A Lato Font clock with fast load and clock_info",
|
||||||
"readme": "README.md",
|
"readme": "README.md",
|
||||||
"icon": "app.png",
|
"icon": "app.png",
|
||||||
|
|
|
@ -1,2 +1,3 @@
|
||||||
0.01: New App!
|
0.01: New App!
|
||||||
0.02: Use clock_info module as an app
|
0.02: Use clock_info module as an app
|
||||||
|
0.03: clock_info now uses app name to maintain settings specifically for this clock face
|
|
@ -79,6 +79,6 @@ let clockInfoDraw = (itm, info, options) => {
|
||||||
|
|
||||||
};
|
};
|
||||||
let clockInfoItems = require("clock_info").load();
|
let clockInfoItems = require("clock_info").load();
|
||||||
let clockInfoMenu = require("clock_info").addInteractive(clockInfoItems, { x:R.x, y:R.y, w:midX-2, h:barY-R.y-2, draw : clockInfoDraw});
|
let clockInfoMenu = require("clock_info").addInteractive(clockInfoItems, { app:"lcdclock", x:R.x, y:R.y, w:midX-2, h:barY-R.y-2, draw : clockInfoDraw});
|
||||||
let clockInfoMenu2 = require("clock_info").addInteractive(clockInfoItems, { x:midX+2, y:R.y, w:midX-3, h:barY-R.y-2, draw : clockInfoDraw});
|
let clockInfoMenu2 = require("clock_info").addInteractive(clockInfoItems, { app:"lcdclock", x:midX+2, y:R.y, w:midX-3, h:barY-R.y-2, draw : clockInfoDraw});
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
{ "id": "lcdclock",
|
{ "id": "lcdclock",
|
||||||
"name": "LCD Clock",
|
"name": "LCD Clock",
|
||||||
"version":"0.02",
|
"version":"0.03",
|
||||||
"description": "A Casio-style clock, with ClockInfo areas at the top and bottom. Tap them and swipe up/down to toggle between different information",
|
"description": "A Casio-style clock, with ClockInfo areas at the top and bottom. Tap them and swipe up/down to toggle between different information",
|
||||||
"icon": "app.png",
|
"icon": "app.png",
|
||||||
"screenshots": [{"url":"screenshot.png"}],
|
"screenshots": [{"url":"screenshot.png"}],
|
||||||
|
|
|
@ -1 +1,2 @@
|
||||||
0.01: First release
|
0.01: First release
|
||||||
|
0.02: clock_info now uses app name to maintain settings specifically for this clock face
|
|
@ -90,10 +90,12 @@ let clockInfoDraw = (itm, info, options) => {
|
||||||
};
|
};
|
||||||
|
|
||||||
let clockInfoMenuA = require("clock_info").addInteractive(clockInfoItems, {
|
let clockInfoMenuA = require("clock_info").addInteractive(clockInfoItems, {
|
||||||
|
app:"pebblepp",
|
||||||
x : 0, y: 0, w: w/2, h:h/2,
|
x : 0, y: 0, w: w/2, h:h/2,
|
||||||
draw : clockInfoDraw
|
draw : clockInfoDraw
|
||||||
});
|
});
|
||||||
let clockInfoMenuB = require("clock_info").addInteractive(clockInfoItems, {
|
let clockInfoMenuB = require("clock_info").addInteractive(clockInfoItems, {
|
||||||
|
app:"pebblepp",
|
||||||
x : w/2, y: 0, w: w/2, h:h/2,
|
x : w/2, y: 0, w: w/2, h:h/2,
|
||||||
draw : clockInfoDraw
|
draw : clockInfoDraw
|
||||||
});
|
});
|
||||||
|
|
|
@ -2,7 +2,7 @@
|
||||||
"id": "pebblepp",
|
"id": "pebblepp",
|
||||||
"name": "Pebble++ Clock",
|
"name": "Pebble++ Clock",
|
||||||
"shortName": "Pebble++",
|
"shortName": "Pebble++",
|
||||||
"version": "0.01",
|
"version": "0.02",
|
||||||
"description": "A pebble style clock (based on the 'Pebble Clock' app) but with two configurable ClockInfo items at the top",
|
"description": "A pebble style clock (based on the 'Pebble Clock' app) but with two configurable ClockInfo items at the top",
|
||||||
"icon": "app.png",
|
"icon": "app.png",
|
||||||
"screenshots": [{"url":"screenshot.png"}],
|
"screenshots": [{"url":"screenshot.png"}],
|
||||||
|
|
|
@ -1,3 +1,4 @@
|
||||||
0.01: first release
|
0.01: first release
|
||||||
0.02: removed fast load, minimalism is useful for narrowing down on issues
|
0.02: removed fast load, minimalism is useful for narrowing down on issues
|
||||||
0.03: Use clock_info module as an app
|
0.03: Use clock_info module as an app
|
||||||
|
0.04: clock_info now uses app name to maintain settings specifically for this clock face
|
|
@ -5,7 +5,7 @@ function draw() {
|
||||||
var timeStr = require("locale").time(date,1);
|
var timeStr = require("locale").time(date,1);
|
||||||
var h = g.getHeight();
|
var h = g.getHeight();
|
||||||
var w = g.getWidth();
|
var w = g.getWidth();
|
||||||
|
|
||||||
g.reset();
|
g.reset();
|
||||||
g.setColor(g.theme.bg);
|
g.setColor(g.theme.bg);
|
||||||
g.fillRect(Bangle.appRect);
|
g.fillRect(Bangle.appRect);
|
||||||
|
@ -34,7 +34,7 @@ function queueDraw() {
|
||||||
/**
|
/**
|
||||||
* clock_info_support
|
* clock_info_support
|
||||||
* this is the callback function that get invoked by clockInfoMenu.redraw();
|
* this is the callback function that get invoked by clockInfoMenu.redraw();
|
||||||
*
|
*
|
||||||
* We will display the image and text on the same line and centre the combined
|
* We will display the image and text on the same line and centre the combined
|
||||||
* length of the image+text
|
* length of the image+text
|
||||||
*
|
*
|
||||||
|
@ -42,7 +42,7 @@ function queueDraw() {
|
||||||
function clockInfoDraw(itm, info, options) {
|
function clockInfoDraw(itm, info, options) {
|
||||||
|
|
||||||
g.reset().setFont('Vector',24).setBgColor(options.bg).setColor(options.fg);
|
g.reset().setFont('Vector',24).setBgColor(options.bg).setColor(options.fg);
|
||||||
|
|
||||||
//use info.text.toString(), steps does not have length defined
|
//use info.text.toString(), steps does not have length defined
|
||||||
var text_w = g.stringWidth(info.text.toString());
|
var text_w = g.stringWidth(info.text.toString());
|
||||||
// gap between image and text
|
// gap between image and text
|
||||||
|
@ -54,7 +54,7 @@ function clockInfoDraw(itm, info, options) {
|
||||||
|
|
||||||
// clear the whole info line
|
// clear the whole info line
|
||||||
g.clearRect(0, options.y -1, g.getWidth(), options.y+24);
|
g.clearRect(0, options.y -1, g.getWidth(), options.y+24);
|
||||||
|
|
||||||
// draw the image if we have one
|
// draw the image if we have one
|
||||||
if (info.img) {
|
if (info.img) {
|
||||||
// image start
|
// image start
|
||||||
|
@ -82,7 +82,7 @@ let clockInfoItems = require("clock_info").load();
|
||||||
* selected after tapping on it
|
* selected after tapping on it
|
||||||
*
|
*
|
||||||
*/
|
*/
|
||||||
let clockInfoMenu = require("clock_info").addInteractive(clockInfoItems, { x:64, y:132, w:50, h:40, draw : clockInfoDraw, bg : g.theme.bg, fg : g.theme.fg, hl : "#0ff"} );
|
let clockInfoMenu = require("clock_info").addInteractive(clockInfoItems, { app:"simplestpp", x:64, y:132, w:50, h:40, draw : clockInfoDraw, bg : g.theme.bg, fg : g.theme.fg, hl : "#0ff"} );
|
||||||
|
|
||||||
// Clear the screen once, at startup
|
// Clear the screen once, at startup
|
||||||
g.clear();
|
g.clear();
|
||||||
|
|
|
@ -2,7 +2,7 @@
|
||||||
"id": "simplestpp",
|
"id": "simplestpp",
|
||||||
"name": "Simplest++ Clock",
|
"name": "Simplest++ Clock",
|
||||||
"shortName": "Simplest++",
|
"shortName": "Simplest++",
|
||||||
"version": "0.03",
|
"version": "0.04",
|
||||||
"description": "The simplest working clock, with clock_info, acts as a tutorial piece",
|
"description": "The simplest working clock, with clock_info, acts as a tutorial piece",
|
||||||
"readme": "README.md",
|
"readme": "README.md",
|
||||||
"icon": "app.png",
|
"icon": "app.png",
|
||||||
|
|
|
@ -1 +1,2 @@
|
||||||
0.01: New Widget!
|
0.01: New Widget!
|
||||||
|
0.02: Now use an app ID (to avoid conflicts with clocks that also use ClockInfo)
|
|
@ -1,8 +1,8 @@
|
||||||
{ "id": "widclkinfo",
|
{ "id": "widclkinfo",
|
||||||
"name": "Clock Info Widget",
|
"name": "Clock Info Widget",
|
||||||
"version":"0.01",
|
"version":"0.02",
|
||||||
"description": "Use 'Clock Info' in the Widget bar. Tap on the widget to select, then drag up/down/left/right to choose what information is displayed.",
|
"description": "Use 'Clock Info' in the Widget bar. Tap on the widget to select, then drag up/down/left/right to choose what information is displayed.",
|
||||||
"icon": "widget.png",
|
"icon": "widget.png",
|
||||||
"screenshots" : [ { "url":"screenshot.png" }],
|
"screenshots" : [ { "url":"screenshot.png" }],
|
||||||
"type": "widget",
|
"type": "widget",
|
||||||
"tags": "widget,clkinfo",
|
"tags": "widget,clkinfo",
|
||||||
|
|
|
@ -3,6 +3,7 @@ if (!require("clock_info").loadCount) { // don't load if a clock_info was alread
|
||||||
let clockInfoItems = require("clock_info").load();
|
let clockInfoItems = require("clock_info").load();
|
||||||
// Add the
|
// Add the
|
||||||
let clockInfoMenu = require("clock_info").addInteractive(clockInfoItems, {
|
let clockInfoMenu = require("clock_info").addInteractive(clockInfoItems, {
|
||||||
|
app : "widclkinfo",
|
||||||
// Add the dimensions we're rendering to here - these are used to detect taps on the clock info area
|
// Add the dimensions we're rendering to here - these are used to detect taps on the clock info area
|
||||||
x : 0, y: 0, w: 72, h:24,
|
x : 0, y: 0, w: 72, h:24,
|
||||||
// You can add other information here you want to be passed into 'options' in 'draw'
|
// You can add other information here you want to be passed into 'options' in 'draw'
|
||||||
|
@ -19,8 +20,8 @@ if (!require("clock_info").loadCount) { // don't load if a clock_info was alread
|
||||||
let clockInfoInfo; // when clockInfoMenu.draw is called we set this up
|
let clockInfoInfo; // when clockInfoMenu.draw is called we set this up
|
||||||
|
|
||||||
// The actual widget we're displaying
|
// The actual widget we're displaying
|
||||||
WIDGETS["clkinfo"] = {
|
WIDGETS["clkinfo"] = {
|
||||||
area:"tl",
|
area:"tl",
|
||||||
width: clockInfoMenu.w,
|
width: clockInfoMenu.w,
|
||||||
draw:function(e) {
|
draw:function(e) {
|
||||||
clockInfoMenu.x = e.x;
|
clockInfoMenu.x = e.x;
|
||||||
|
|
Loading…
Reference in New Issue