diff --git a/apps/boxclk/ChangeLog b/apps/boxclk/ChangeLog index f35b35819..105c8384c 100644 --- a/apps/boxclk/ChangeLog +++ b/apps/boxclk/ChangeLog @@ -1,3 +1,3 @@ 0.01: New App! 0.02: New config options such as step, meridian, short/long formats, custom prefix/suffix -0.03: Allows showing the month in short or long format by setting `"shortMonth"` to true or false +0.03: New Font Library Module! Also allows short or long month. diff --git a/apps/boxclk/README.md b/apps/boxclk/README.md index c72d932a4..5baa9c439 100644 --- a/apps/boxclk/README.md +++ b/apps/boxclk/README.md @@ -24,7 +24,7 @@ Here's an example of what a configuration might contain: { "customBox": { "string": "Your text here", - "font": "CustomFont", // Custom fonts must be removed in setUI + "font": "CustomFont", // Add custom fonts to "boxclk.lib" "fontSize": 1, "outline": 2, "color": "#FF9900", // Use 6 or 3 digit hex color codes @@ -54,7 +54,7 @@ __Breakdown of Parameters:__ * **string:** The text string to be displayed inside the box. This is only required for custom Box Names. -* **font:** The font name given to g.setFont(). +* **font:** The font name given to g.setFont(). To use a custom font, use the Espruino Font Converter and add it to "boxclk.lib" next to the other custom fonts. Use the font name beginning after "setFont" in your JSON config. * **fontSize:** The size of the font. diff --git a/apps/boxclk/app.js b/apps/boxclk/app.js index 0b0ca8e65..1d7d6c590 100644 --- a/apps/boxclk/app.js +++ b/apps/boxclk/app.js @@ -7,6 +7,7 @@ let storage = require("Storage"); let locale = require("locale"); let widgets = require("widget_utils"); + let customFonts = require("boxclk.lib"); let date = new Date(); let bgImage; let configNumber = (storage.readJSON("boxclk.json", 1) || {}).selectedConfig || 0; @@ -46,24 +47,7 @@ /** * --------------------------------------------------------------- - * 4. Font loading function - * --------------------------------------------------------------- - */ - let loadCustomFont = function() { - Graphics.prototype.setFontBrunoAce = function() { - // Actual height 23 (24 - 2) - return this.setFontCustom( - E.toString(require('heatshrink').decompress(atob('ABMHwADBh4DKg4bKgIPDAYUfAYV/AYX/AQMD/gmC+ADBn/AByE/GIU8AYUwLxcfAYX/8AnB//4JIP/FgMP4F+CQQBBjwJBFYRbBAd43DHoJpBh/g/xPEK4ZfDgEEORKDDAY8////wADLfZrTCgITBnhEBAYJMBAYMPw4DCM4QDjhwDCjwDBn0+AYMf/gDBh/4AYMH+ADBLpc4ToK/NGYZfnAYcfL4U/x5fBW4LvB/7vC+LvBgHAsBfIn76Cn4WBcYQDFEgJ+CQQYDyH4L/BAZbHLNYjjCAZc8ngDunycBZ4KkBa4KwBnEHY4UB+BfMgf/ZgMH/4XBc4cf4F/gE+ZgRjwAYcfj5jBM4U4M4RQBM4UA8BjIngDFEYJ8BAYUDAYQvCM4ZxBC4V+AYQvBnkBQ4M8gabBJQPAI4WAAYM/GYQaBAYJKCnqyCn5OCn4aBAYIaBAYJPCU4IABnBhIuDXCFAMD+Z/BY4IDBQwOPwEfv6TDAYUPAcwrDAYQ7BAYY/BI4cD8bLCK4RfEAA0BRYTeDcwIrFn0Pw43Bg4DugYDBjxBBU4SvDMYMH/5QBgP/LAQAP8EHN4UPwADHB4YAHA'))), - 46, - atob("CBEdChgYGhgaGBsaCQ=="), - 32|65536 - ); - }; - }; - - /** - * --------------------------------------------------------------- - * 5. Initial settings of boxes and their positions + * 4. Initial settings of boxes and their positions * --------------------------------------------------------------- */ for (let key in boxesConfig) { @@ -88,7 +72,7 @@ /** * --------------------------------------------------------------- - * 6. Text and drawing functions + * 5. Text and drawing functions * --------------------------------------------------------------- */ @@ -164,7 +148,7 @@ /** * --------------------------------------------------------------- - * 7. String forming helper functions + * 6. String forming helper functions * --------------------------------------------------------------- */ let isBool = function(val, defaultVal) { @@ -208,7 +192,7 @@ /** * --------------------------------------------------------------- - * 8. Main draw function + * 7. Main draw function * --------------------------------------------------------------- */ let draw = (function() { @@ -269,7 +253,7 @@ /** * --------------------------------------------------------------- - * 9. Helper function for touch event + * 8. Helper function for touch event * --------------------------------------------------------------- */ let touchInText = function(e, boxItem, boxKey) { @@ -293,7 +277,7 @@ /** * --------------------------------------------------------------- - * 10. Setup function to configure event handlers + * 9. Setup function to configure event handlers * --------------------------------------------------------------- */ let setup = function() { @@ -380,20 +364,19 @@ Bangle.removeListener('drag', dragHandler); if (drawTimeout) clearTimeout(drawTimeout); drawTimeout = undefined; - delete Graphics.prototype.setFontBrunoAce; + unloadCustomBoxclkFonts(); // Remove custom fonts // Restore original drawString function (no outlines) g.drawString = g_drawString; restoreSetColor(); widgets.show(); } }); - loadCustomFont(); draw(boxes); }; /** * --------------------------------------------------------------- - * 11. Main execution part + * 10. Main execution part * --------------------------------------------------------------- */ Bangle.loadWidgets(); diff --git a/apps/boxclk/boxclk-1.json b/apps/boxclk/boxclk-1.json index 99e225f04..d4fe65b25 100644 --- a/apps/boxclk/boxclk-1.json +++ b/apps/boxclk/boxclk-1.json @@ -1,15 +1,15 @@ { "time": { - "font": "6x8", - "fontSize": 3, + "font": "Orbitron", + "fontSize": 1, "outline": 2, "color": "#0ff", "outlineColor": "#00f", "border": "#0f0", - "xPadding": -1, - "yPadding": -2.5, - "xOffset": 2, - "yOffset": 0, + "xPadding": 0, + "yPadding": -3.5, + "xOffset": 0, + "yOffset": 2, "boxPos": { "x": "0.33", "y": "0.29" @@ -35,7 +35,7 @@ "dow": { "font": "6x8", "fontSize": 2, - "outline": 1, + "outline": 2, "color": "#000", "outlineColor": "#fff", "border": "#0f0", @@ -45,13 +45,13 @@ "yOffset": 1, "boxPos": { "x": "0.5", - "y": "0.82" + "y": "0.83" } }, "step": { "font": "6x8", "fontSize": 2, - "outline": 1, + "outline": 2, "color": "#000", "outlineColor": "#fff", "border": "#0f0", diff --git a/apps/boxclk/lib.js b/apps/boxclk/lib.js new file mode 100644 index 000000000..fec5f95e8 --- /dev/null +++ b/apps/boxclk/lib.js @@ -0,0 +1,53 @@ +/************************************************* + * Name: boxclk.lib + * Type: Font Library + * Desc: Add your custom fonts for Box Clock below + *************************************************/ + +// Create an empty object for exporting module's functions +var exports={}; + +// Array to hold the names of the custom fonts +let fontNames = []; + +// Add custom fonts below. Each font is a function that's added to the Graphics.prototype +// Use the Espruino Font Converter tool to convert your font into the appropriate format +// Use the name beginning after "setFont", for example "BrunoAce" in your JSON config +// This module and the main app will automatically delete the custom fonts in setUI + +Graphics.prototype.setFontBrunoAce = function() { + // Actual height 23 (24 - 2) + return this.setFontCustom( + E.toString(require('heatshrink').decompress(atob('ABMHwADBh4DKg4bKgIPDAYUfAYV/AYX/AQMD/gmC+ADBn/AByE/GIU8AYUwLxcfAYX/8AnB//4JIP/FgMP4F+CQQBBjwJBFYRbBAd43DHoJpBh/g/xPEK4ZfDgEEORKDDAY8////wADLfZrTCgITBnhEBAYJMBAYMPw4DCM4QDjhwDCjwDBn0+AYMf/gDBh/4AYMH+ADBLpc4ToK/NGYZfnAYcfL4U/x5fBW4LvB/7vC+LvBgHAsBfIn76Cn4WBcYQDFEgJ+CQQYDyH4L/BAZbHLNYjjCAZc8ngDunycBZ4KkBa4KwBnEHY4UB+BfMgf/ZgMH/4XBc4cf4F/gE+ZgRjwAYcfj5jBM4U4M4RQBM4UA8BjIngDFEYJ8BAYUDAYQvCM4ZxBC4V+AYQvBnkBQ4M8gabBJQPAI4WAAYM/GYQaBAYJKCnqyCn5OCn4aBAYIaBAYJPCU4IABnBhIuDXCFAMD+Z/BY4IDBQwOPwEfv6TDAYUPAcwrDAYQ7BAYY/BI4cD8bLCK4RfEAA0BRYTeDcwIrFn0Pw43Bg4DugYDBjxBBU4SvDMYMH/5QBgP/LAQAP8EHN4UPwADHB4YAHA'))), + 46, + atob("CBEdChgYGhgaGBsaCQ=="), + 32|65536 + ); +}; + +Graphics.prototype.setFontOrbitron = function() { + // Actual height 24 (25 - 2) + return this.setFontCustom( + E.toString(require('heatshrink').decompress(atob('AA3AAQMBAYwLDAA8DBYUHwADBjwLCngDCvADC+AWJh4OCDQYWGgPgDQsPGI0cMBUf///wE/AYPAAYc4BoIDCnoDCvIDC+IDBgPhAYMDAYfBAYMHwIDBh6HBnEeAYU8AYV4AYX4AYXwAYM58ADBnfAAYM/wADCI4RTDh4DBMhNAYIqeEQ40+XIx7HAYb/SV4MBC4M+gYDCg6fCg5vCAfxnBAYMf/wDBh/8SIYAJgRrDToOAS4KhBAYKpBf4IvChwD5n5jCj7TCh4DBdoK/BMo3wAQMBAYUDAY0HAYUPuB4CAYU8AYV4AYXwAYMB8ADBQIIDBRoIDBh4DCj8AAYKTBAYK7BJ4IDHFAIrCAZgAFO4I1BAYR/CAYK/7AZDABAYMHYYM4YZAAJb4RrBR4xn/gADDNYT0BKYL8BNYs4AfybHU4XAKwJbCXa8HQYQD+M42AYQK7FAA8H/BrC/0BNYQjDM/5rdMoMA4AdBAIwLCC44A='))), + 46, + atob("BxEbDRsaFxsaFRsbBw=="), + 32|65536 + ); +}; + +// Extract the names of the custom fonts added to the Graphics.prototype +for (let prop in Graphics.prototype) { + if (prop.startsWith('setFont')) { + fontNames.push(prop.slice(7)); // remove 'setFont' from the start + } +} + +// Function to remove the custom fonts from the Graphics.prototype +function unloadCustomBoxClkFonts() { + for (let i = 0; i < fontNames.length; i++) { + delete Graphics.prototype[fontNames[i]]; + } +} + +// Export the unload function +exports.unloadCustomBoxClkFonts = unloadCustomBoxClkFonts; \ No newline at end of file diff --git a/apps/boxclk/metadata.json b/apps/boxclk/metadata.json index 6717b79d8..2d2507e8d 100644 --- a/apps/boxclk/metadata.json +++ b/apps/boxclk/metadata.json @@ -12,11 +12,13 @@ "type": "clock", "tags": "clock", "supports": ["BANGLEJS2"], + "provides_modules" : ["boxclk.lib"], "readme": "README.md", "allow_emulator": true, "storage": [ {"name":"boxclk.app.js","url":"app.js"}, {"name":"boxclk.settings.js","url":"settings.js"}, + {"name":"boxclk.lib","url":"lib.js"}, {"name":"boxclk.img","url":"icon.js","evaluate":true}, {"name":"boxclk.beachhouse.img","url":"beachhouse.js","evaluate":true} ], diff --git a/apps/boxclk/screenshot-1.png b/apps/boxclk/screenshot-1.png index c6e22d262..25b911aa8 100644 Binary files a/apps/boxclk/screenshot-1.png and b/apps/boxclk/screenshot-1.png differ