Adding app id to clockinfo to ensure clock faces remember their own settings

apps/aiclock/ChangeLog

@@ -6,3 +6,4 @@
 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.08: Use clock_info module as an app
+0.09: clock_info now uses app name to maintain settings specifically for this clock face

apps/aiclock/aiclock.app.js

@@ -193,6 +193,7 @@ function queueDraw() {
  */
 let clockInfoItems = clock_info.load();
 let clockInfoMenu = clock_info.addInteractive(clockInfoItems, {
+  app : "aiclock",
   x : 0,
   y: 0,
   w: W,

apps/aiclock/metadata.json

@@ -3,7 +3,7 @@
   "name": "AI Clock",
   "shortName":"AI Clock",
   "icon": "aiclock.png",
-  "version":"0.08",
+  "version":"0.09",
   "readme": "README.md",
   "supports": ["BANGLEJS2"],
   "dependencies" : { "clock_info":"module" },

apps/lato/ChangeLog

@@ -1,2 +1,3 @@
 0.01: first release
 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

apps/lato/app.js

@@ -37,13 +37,13 @@ Graphics.prototype.setFontLatoSmall = function(scale) {
 {
   // 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
-  
+
   let draw = function() {
     var date = new Date();
     var timeStr = require("locale").time(date,1);
     var h = g.getHeight();
     var w = g.getWidth();
-    
+
     g.reset();
     g.setColor(g.theme.bg);
     g.fillRect(Bangle.appRect);
@@ -66,7 +66,7 @@ Graphics.prototype.setFontLatoSmall = function(scale) {
   /**
    * clock_info_support
    * 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
    * 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().setFontLatoSmall();
     g.setBgColor(options.bg).setColor(options.fg);
-    
+
     //use info.text.toString(), steps does not have length defined
     var text_w = g.stringWidth(info.text.toString());
     // 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
     g.clearRect(0, options.y -2, g.getWidth(), options.y+ 23 + 2);
-    
+
     // draw the image if we have one
     if (info.img) {
       // image start
@@ -110,8 +110,8 @@ Graphics.prototype.setFontLatoSmall = function(scale) {
   // clock_info_support
   // 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
-  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
   var drawTimeout;
   g.clear();

apps/lato/lato.fast.js

@@ -37,13 +37,13 @@ Graphics.prototype.setFontLatoSmall = function(scale) {
 {
   // 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
-  
+
   let draw = function() {
     var date = new Date();
     var timeStr = require("locale").time(date,1);
     var h = g.getHeight();
     var w = g.getWidth();
-    
+
     g.reset();
     g.setColor(g.theme.bg);
     g.fillRect(Bangle.appRect);
@@ -66,7 +66,7 @@ Graphics.prototype.setFontLatoSmall = function(scale) {
   /**
    * clock_info_support
    * 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
    * 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().setFontLatoSmall();
     g.setBgColor(options.bg).setColor(options.fg);
-    
+
     //use info.text.toString(), steps does not have length defined
     var text_w = g.stringWidth(info.text.toString());
     // 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
     g.clearRect(0, options.y -2, g.getWidth(), options.y+ 23 + 2);
-    
+
     // draw the image if we have one
     if (info.img) {
       // image start
@@ -110,8 +110,8 @@ Graphics.prototype.setFontLatoSmall = function(scale) {
   // clock_info_support
   // 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
-  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
   var drawTimeout;
   g.clear();

apps/lato/lato.slow.js

@@ -64,7 +64,7 @@ function queueDraw() {
 /**
  * clock_info_support
  * 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
  * length of the image+text
  *
@@ -109,8 +109,8 @@ let clockInfoItems = require("clock_info").load();
  * 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();
 
 // Show launcher when middle button pressed

apps/lato/metadata.json

@@ -1,7 +1,7 @@
 {
   "id": "lato",
   "name": "Lato",
-  "version": "0.02",
+  "version": "0.03",
   "description": "A Lato Font clock with fast load and clock_info",
   "readme": "README.md",
   "icon": "app.png",

apps/lcdclock/ChangeLog

@@ -1,2 +1,3 @@
 0.01: New 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

apps/lcdclock/app.js

@@ -79,6 +79,6 @@ let clockInfoDraw = (itm, info, options) => {
 
 };
 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 clockInfoMenu2 = require("clock_info").addInteractive(clockInfoItems, { x:midX+2, y:R.y, w:midX-3, 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, {  app:"lcdclock", x:midX+2, y:R.y, w:midX-3, h:barY-R.y-2, draw : clockInfoDraw});
 }

apps/lcdclock/metadata.json

@@ -1,6 +1,6 @@
 { "id": "lcdclock",
   "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",
   "icon": "app.png",
   "screenshots": [{"url":"screenshot.png"}],

apps/pebblepp/ChangeLog

@@ -1 +1,2 @@
 0.01: First release
+0.02: clock_info now uses app name to maintain settings specifically for this clock face

apps/pebblepp/app.js

@@ -90,10 +90,12 @@ let clockInfoDraw = (itm, info, options) => {
 };
 
 let clockInfoMenuA = require("clock_info").addInteractive(clockInfoItems, {
+  app:"pebblepp",
   x : 0, y: 0, w: w/2, h:h/2,
   draw : clockInfoDraw
 });
 let clockInfoMenuB = require("clock_info").addInteractive(clockInfoItems, {
+  app:"pebblepp",
   x : w/2, y: 0, w: w/2, h:h/2,
   draw : clockInfoDraw
 });

apps/pebblepp/metadata.json

@@ -2,7 +2,7 @@
   "id": "pebblepp",
   "name": "Pebble++ Clock",
   "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",
   "icon": "app.png",
   "screenshots": [{"url":"screenshot.png"}],

apps/simplestpp/ChangeLog

@@ -1,3 +1,4 @@
 0.01: first release
 0.02: removed fast load, minimalism is useful for narrowing down on issues
 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

apps/simplestpp/app.js

@@ -5,7 +5,7 @@ function draw() {
   var timeStr = require("locale").time(date,1);
   var h = g.getHeight();
   var w = g.getWidth();
-  
+
   g.reset();
   g.setColor(g.theme.bg);
   g.fillRect(Bangle.appRect);
@@ -34,7 +34,7 @@ function queueDraw() {
 /**
  * clock_info_support
  * 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
  * length of the image+text
  *
@@ -42,7 +42,7 @@ function queueDraw() {
 function clockInfoDraw(itm, info, options) {
 
   g.reset().setFont('Vector',24).setBgColor(options.bg).setColor(options.fg);
-  
+
   //use info.text.toString(), steps does not have length defined
   var text_w = g.stringWidth(info.text.toString());
   // gap between image and text
@@ -54,7 +54,7 @@ function clockInfoDraw(itm, info, options) {
 
   // clear the whole info line
   g.clearRect(0, options.y -1, g.getWidth(), options.y+24);
-  
+
   // draw the image if we have one
   if (info.img) {
     // image start
@@ -82,7 +82,7 @@ let clockInfoItems = require("clock_info").load();
  * 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
 g.clear();

apps/simplestpp/metadata.json

@@ -2,7 +2,7 @@
   "id": "simplestpp",
   "name": "Simplest++ Clock",
   "shortName": "Simplest++",
-  "version": "0.03",
+  "version": "0.04",
   "description": "The simplest working clock, with clock_info, acts as a tutorial piece",
   "readme": "README.md",
   "icon": "app.png",

apps/widclkinfo/ChangeLog

@@ -1 +1,2 @@
 0.01: New Widget!
+0.02: Now use an app ID (to avoid conflicts with clocks that also use ClockInfo)

apps/widclkinfo/metadata.json

@@ -1,8 +1,8 @@
 { "id": "widclkinfo",
   "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.",
-  "icon": "widget.png",  
+  "icon": "widget.png",
   "screenshots" : [ { "url":"screenshot.png" }],
   "type": "widget",
   "tags": "widget,clkinfo",

apps/widclkinfo/widget.js

@@ -3,6 +3,7 @@ if (!require("clock_info").loadCount) { // don't load if a clock_info was alread
   let clockInfoItems = require("clock_info").load();
   // Add the
   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
     x : 0, y: 0, w: 72, h:24,
     // 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
 
   // The actual widget we're displaying
-  WIDGETS["clkinfo"] = { 
-    area:"tl", 
+  WIDGETS["clkinfo"] = {
+    area:"tl",
     width: clockInfoMenu.w,
     draw:function(e) {
       clockInfoMenu.x = e.x;