diff --git a/apps/slidingtext/ChangeLog b/apps/slidingtext/ChangeLog index 0327ff387..b3cf16ac7 100644 --- a/apps/slidingtext/ChangeLog +++ b/apps/slidingtext/ChangeLog @@ -5,4 +5,5 @@ 0.05: BUGFIX: pedometer widget interfered with the clock Font Alignment 0.06: Use Bangle.setUI for button/launcher handling 0.07: Support for Bangle.js 2 and themes -0.08: Removed "wake LCD on face-up"-feature: A watch-face should not set things like "wake LCD on face-up". +0.08: Removed "wake LCD on face-up"-feature: A watch-face should not set things like "wake LCD on face-up". +0.09: Added button control toggle and other live controls to new settings screen. diff --git a/apps/slidingtext/README.md b/apps/slidingtext/README.md index d2d2fb5b6..d5a561634 100644 --- a/apps/slidingtext/README.md +++ b/apps/slidingtext/README.md @@ -6,22 +6,49 @@ Inspired by the Pebble sliding clock, old times are scrolled off the screen and ## Usage -### Button 1 +### Bangle 2 + +The Bangle 2 has Live Controls switched **off** by default so the colour and language have to be changed from the setting Menu. +Please locate the Sliding Text clock under the setting->apps menu. + +With the Live Controls switched on: +#### Bottom right hand corner press +press the bottom right hand corner of the screen to change the colour + +| White | Black | Gray | Red | +|----------------------|----------------------|----------------------|----------------------| +| ![](b2_color-01.jpg) | ![](b2_color-02.jpg) | ![](b2_color-03.jpg) | ![](b2_color-04.jpg) | + +#### Top right hand corner press +press the top right hand corner of the screen to change the language + +### Bangle 1 + +By Default the Live Controls (The side buttons) are switched on, which means the clock face can be controlled dynamically using the 2 side buttons on the right hand side + +#### Button 1 Use Button 1 (the top right button) to change the language | English | English (Traditional) | French | Japanese (Romanji) | | ---- | ---- | ---- | ---- | -| ![](./format-01.jpg) | ![](format-02.jpg) | ![](format-03.jpg) |![](format-04.jpg) | +| ![](format-01.jpg) | ![](format-02.jpg) | ![](format-03.jpg) |![](format-04.jpg) | | **German** | **Spanish** | | | -| ![](./format-05.jpg) | ![](format-06.jpg) | | | +| ![](format-05.jpg) | ![](format-06.jpg) | | | -### Button 3 +#### Button 3 Button 3 (bottom right button) is used to change the colour | Black | Red | Gray | Purple | | ---- | ---- | ---- | ---- | -| ![](./color-01.jpg) | ![](color-02.jpg) | ![](color-03.jpg) | ![](color-04.jpg) | +| ![](b1_color-01.jpg) | ![](b1_color-02.jpg) | ![](b1_color-03.jpg) | ![](b1_color-04.jpg) | + +#### Settings + +To turn off the Live Controls and change the settings statically please visit the settings menu. The settings menu will allow you to: +- Colour Scheme +- Language +- Live Controls (On or Off) ## Further Details diff --git a/apps/slidingtext/color-01.jpg b/apps/slidingtext/b1_color-01.jpg similarity index 100% rename from apps/slidingtext/color-01.jpg rename to apps/slidingtext/b1_color-01.jpg diff --git a/apps/slidingtext/color-02.jpg b/apps/slidingtext/b1_color-02.jpg similarity index 100% rename from apps/slidingtext/color-02.jpg rename to apps/slidingtext/b1_color-02.jpg diff --git a/apps/slidingtext/color-03.jpg b/apps/slidingtext/b1_color-03.jpg similarity index 100% rename from apps/slidingtext/color-03.jpg rename to apps/slidingtext/b1_color-03.jpg diff --git a/apps/slidingtext/color-04.jpg b/apps/slidingtext/b1_color-04.jpg similarity index 100% rename from apps/slidingtext/color-04.jpg rename to apps/slidingtext/b1_color-04.jpg diff --git a/apps/slidingtext/b2_color-01.jpg b/apps/slidingtext/b2_color-01.jpg new file mode 100644 index 000000000..7428f7623 Binary files /dev/null and b/apps/slidingtext/b2_color-01.jpg differ diff --git a/apps/slidingtext/b2_color-02.jpg b/apps/slidingtext/b2_color-02.jpg new file mode 100644 index 000000000..7e3b8666f Binary files /dev/null and b/apps/slidingtext/b2_color-02.jpg differ diff --git a/apps/slidingtext/b2_color-03.jpg b/apps/slidingtext/b2_color-03.jpg new file mode 100644 index 000000000..96c8655cf Binary files /dev/null and b/apps/slidingtext/b2_color-03.jpg differ diff --git a/apps/slidingtext/b2_color-04.jpg b/apps/slidingtext/b2_color-04.jpg new file mode 100644 index 000000000..dac36365a Binary files /dev/null and b/apps/slidingtext/b2_color-04.jpg differ diff --git a/apps/slidingtext/metadata.json b/apps/slidingtext/metadata.json index 2937a618b..15707c1ad 100644 --- a/apps/slidingtext/metadata.json +++ b/apps/slidingtext/metadata.json @@ -1,7 +1,7 @@ { "id": "slidingtext", "name": "Sliding Clock", - "version": "0.08", + "version": "0.09", "description": "Inspired by the Pebble sliding clock, old times are scrolled off the screen and new times on. You are also able to change language on the fly so you can see the time written in other languages using button 1. Currently English, French, Japanese, Spanish and German are supported", "icon": "slidingtext.png", "type": "clock", @@ -12,6 +12,7 @@ "allow_emulator": false, "storage": [ {"name":"slidingtext.app.js","url":"slidingtext.js"}, + {"name":"slidingtext.settings.js","url":"slidingtext.settings.js"}, {"name":"slidingtext.img","url":"slidingtext-icon.js","evaluate":true}, {"name":"slidingtext.locale.en.js","url":"slidingtext.locale.en.js"}, {"name":"slidingtext.locale.en2.js","url":"slidingtext.locale.en2.js"}, @@ -21,5 +22,6 @@ {"name":"slidingtext.locale.jp.js","url":"slidingtext.locale.jp.js"}, {"name":"slidingtext.locale.de.js","url":"slidingtext.locale.de.js"}, {"name":"slidingtext.dtfmt.js","url":"slidingtext.dtfmt.js"} - ] + ], + "data": [{"name": "slidingtext.settings.json"}] } diff --git a/apps/slidingtext/slidingtext.dtfmt.js b/apps/slidingtext/slidingtext.dtfmt.js index 865ea47e6..266ed0b35 100644 --- a/apps/slidingtext/slidingtext.dtfmt.js +++ b/apps/slidingtext/slidingtext.dtfmt.js @@ -7,6 +7,7 @@ class DateFormatter { * to the lines of text on the screen */ name(){return "no name";} + shortName(){return "no short name"} formatDate(date){ return ["no","date","defined"]; } diff --git a/apps/slidingtext/slidingtext.js b/apps/slidingtext/slidingtext.js index 7b56af1a1..ae6571121 100644 --- a/apps/slidingtext/slidingtext.js +++ b/apps/slidingtext/slidingtext.js @@ -5,11 +5,17 @@ */ const color_schemes = [ + { + name: "white", + background : [1.0,1.0,1.0], + main_bar: [0.0,0.0,0.0], + other_bars: [0.1,0.1,0.1], + }, { name: "black", background : [0.0,0.0,0.0], main_bar: [1.0,1.0,1.0], - other_bars: [0.85,0.85,0.85], + other_bars: [0.9,0.9,0.9], }, { name: "red", @@ -81,7 +87,7 @@ function reset_commands(){ function has_commands(){ return command_stack_high_priority.length > 0 || - command_stack_low_priority.lenth > 0; + command_stack_low_priority.length > 0; } class ShiftText { @@ -244,15 +250,19 @@ function setRowDisplays(y, heights) { y += heights[i]; } } -if (g.getHeight()>200) + +function bangleVersion(){ + return (g.getHeight()>200)? 1 : 2; +} + +if (bangleVersion()<2) setRowDisplays(50, [40,30,30,30,40]); else setRowDisplays(34, [35,25,25,25,35]); function nextColorTheme(){ - //console.log("next color theme"); color_scheme_index += 1; - if(color_scheme_index >= row_displays.length){ + if(color_scheme_index > row_displays.length){ color_scheme_index = 0; } setColorScheme(color_schemes[color_scheme_index]); @@ -411,8 +421,7 @@ function draw_clock(){ reset_commands(); date = display_time(date); console.log("draw_clock:" + last_draw_time.toISOString() + " display:" + date.toISOString()); - // for debugging only - //date.setMinutes(37); + var rows = date_formatter.formatDate(date); var display; for (var i = 0; i < rows.length; i++) { @@ -495,7 +504,7 @@ function set_colorscheme(colorscheme_name){ function set_dateformat(dateformat_name){ console.log("setting date format:" + dateformat_name); for (var i=0; i < date_formatters.length; i++) { - if(date_formatters[i].name() == dateformat_name){ + if(date_formatters[i].shortName() == dateformat_name){ date_formatter_idx = i; date_formatter = date_formatters[date_formatter_idx]; console.log("match"); @@ -503,6 +512,7 @@ function set_dateformat(dateformat_name){ } } +var enable_live_controls = false; const PREFERENCE_FILE = "slidingtext.settings.json"; /** * Called on startup to set the watch to the last preference settings @@ -510,7 +520,7 @@ const PREFERENCE_FILE = "slidingtext.settings.json"; function load_settings(){ var setScheme = false; try{ - settings = require("Storage").readJSON(PREFERENCE_FILE); + var settings = require("Storage").readJSON(PREFERENCE_FILE); if(settings != null){ console.log("loaded:" + JSON.stringify(settings)); if(settings.color_scheme != null){ @@ -520,9 +530,15 @@ function load_settings(){ if(settings.date_format != null){ set_dateformat(settings.date_format); } + if(settings.enable_live_controls == null){ + settings.enable_live_controls = (bangleVersion() <= 1); + } + enable_live_controls = settings.enable_live_controls; } else { console.log("no settings to load"); + enable_live_controls = (bangleVersion() <= 1); } + console.log("enable_live_controls=" + enable_live_controls); } catch(e){ console.log("failed to load settings:" + e); } @@ -536,24 +552,30 @@ function load_settings(){ */ function save_settings(){ var settings = { - date_format : date_formatter.name(), + date_format : date_formatter.shortName(), color_scheme : color_schemes[color_scheme_index].name, + enable_live_controls: enable_live_controls }; console.log("saving:" + JSON.stringify(settings)); require("Storage").writeJSON(PREFERENCE_FILE,settings); } function button1pressed() { - changeFormatter(); - save_settings(); + console.log("button1pressed"); + if (enable_live_controls) { + changeFormatter(); + save_settings(); + } } function button3pressed() { console.log("button3pressed"); - nextColorTheme(); - reset_clock(true); - draw_clock(); - save_settings(); + if (enable_live_controls) { + nextColorTheme(); + reset_clock(true); + draw_clock(); + save_settings(); + } } // The interval reference for updating the clock diff --git a/apps/slidingtext/slidingtext.locale.de.js b/apps/slidingtext/slidingtext.locale.de.js index 3cb178232..da5c2f01d 100644 --- a/apps/slidingtext/slidingtext.locale.de.js +++ b/apps/slidingtext/slidingtext.locale.de.js @@ -66,6 +66,7 @@ function germanMinsToText(mins) { class GermanDateFormatter extends DateFormatter { constructor() { super();} name(){return "German";} + shortName(){return "de"} formatDate(date){ var mins = date.getMinutes(); var hourOfDay = date.getHours(); diff --git a/apps/slidingtext/slidingtext.locale.en.js b/apps/slidingtext/slidingtext.locale.en.js index 7d37fcae1..6414ef7a9 100644 --- a/apps/slidingtext/slidingtext.locale.en.js +++ b/apps/slidingtext/slidingtext.locale.en.js @@ -5,6 +5,7 @@ const numberToText = require("slidingtext.utils.en.js").numberToText; class EnglishDateFormatter extends DateFormatter { constructor() { super();} name(){return "English";} + shortName(){return "en"} formatDate(date){ var hours_txt = hoursToText(date.getHours()); var mins_txt = numberToText(date.getMinutes()); diff --git a/apps/slidingtext/slidingtext.locale.en2.js b/apps/slidingtext/slidingtext.locale.en2.js index cd07e8848..d7d7ff6a8 100644 --- a/apps/slidingtext/slidingtext.locale.en2.js +++ b/apps/slidingtext/slidingtext.locale.en2.js @@ -7,6 +7,7 @@ class EnglishTraditionalDateFormatter extends DateFormatter { super(); } name(){return "English (Traditional)";} + shortName(){return "en2"} formatDate(date){ var mins = date.getMinutes(); var hourOfDay = date.getHours(); diff --git a/apps/slidingtext/slidingtext.locale.es.js b/apps/slidingtext/slidingtext.locale.es.js index 1b6f6d11b..62c68b64d 100644 --- a/apps/slidingtext/slidingtext.locale.es.js +++ b/apps/slidingtext/slidingtext.locale.es.js @@ -47,6 +47,7 @@ function spanishMinsToText(mins){ class SpanishDateFormatter extends DateFormatter { constructor() { super();} name(){return "Spanish";} + shortName(){return "es"} formatDate(date){ var mins = date.getMinutes(); var hourOfDay = date.getHours(); diff --git a/apps/slidingtext/slidingtext.locale.fr.js b/apps/slidingtext/slidingtext.locale.fr.js index 5844c1a4e..d4c1dc9d6 100644 --- a/apps/slidingtext/slidingtext.locale.fr.js +++ b/apps/slidingtext/slidingtext.locale.fr.js @@ -31,6 +31,7 @@ function frenchHeures(hours){ class FrenchDateFormatter extends DateFormatter { constructor() { super(); } name(){return "French";} + shortName(){return "fr"} formatDate(date){ var hours = frenchHoursToText(date.getHours()); var heures = frenchHeures(date.getHours()); diff --git a/apps/slidingtext/slidingtext.locale.jp.js b/apps/slidingtext/slidingtext.locale.jp.js index c28780e88..0f6e46a21 100644 --- a/apps/slidingtext/slidingtext.locale.jp.js +++ b/apps/slidingtext/slidingtext.locale.jp.js @@ -61,6 +61,7 @@ function japaneseMinsToText(mins){ class JapaneseDateFormatter extends DateFormatter { constructor() { super(); } name(){return "Japanese (Romanji)";} + shortName(){return "jp"} formatDate(date){ var hours_txt = japaneseHoursToText(date.getHours()); var mins_txt = japaneseMinsToText(date.getMinutes()); diff --git a/apps/slidingtext/slidingtext.settings.js b/apps/slidingtext/slidingtext.settings.js new file mode 100644 index 000000000..d1006990e --- /dev/null +++ b/apps/slidingtext/slidingtext.settings.js @@ -0,0 +1,65 @@ +(function(back) { + const PREFERENCE_FILE = "slidingtext.settings.json"; + var settings = Object.assign({}, + require('Storage').readJSON(PREFERENCE_FILE, true) || {}); + // the screen controls are defaulted on for a bangle 1 and off for a bangle 2 + if(settings.enable_live_controls == null){ + settings.enable_live_controls = (g.getHeight()> 200); + } + console.log("loaded:" + JSON.stringify(settings)); + + const LANGUAGES_FILE = "slidingtext.languages.json"; + const LANGUAGES_DEFAULT = ["en","en2"]; + var locales = null; + try { + locales = require("Storage").readJSON(LANGUAGES_FILE); + } catch(e) { + console.log("failed to load languages:" + e); + } + if(locales == null || locales.length == 0){ + locales = LANGUAGES_DEFAULT; + console.log("defaulting languages to locale:" + locales); + } + + function writeSettings() { + console.log("saving:" + JSON.stringify(settings)); + require('Storage').writeJSON(PREFERENCE_FILE, settings); + } + + // Helper method which uses int-based menu item for set of string values + function stringItems(startvalue, writer, values) { + return { + value: (startvalue === undefined ? 0 : values.indexOf(startvalue)), + format: v => values[v], + min: 0, + max: values.length - 1, + wrap: true, + step: 1, + onchange: v => { + writer(values[v]); + writeSettings(); + } + }; + } + + // Helper method which breaks string set settings down to local settings object + function stringInSettings(name, values) { + return stringItems(settings[name], v => settings[name] = v, values); + } + + // Show the menu + E.showMenu({ + "" : { "title" : "Sliding Text" }, + "< Back" : () => back(), + "Colour": stringInSettings("color_scheme", ["white", "black", "red","grey","purple","blue"]), + "Languages": stringInSettings("date_format", locales), + "Live Control": { + value: (settings.enable_live_controls !== undefined ? settings.enable_live_controls : true), + format: v => v ? "On" : "Off", + onchange: v => { + settings.enable_live_controls = v; + writeSettings(); + } + }, + }); +}) \ No newline at end of file