diff --git a/apps/TheBinWatch/Background176_center.png b/apps/TheBinWatch/Background176_center.png index 9c8ecee53..c8c1c0148 100644 Binary files a/apps/TheBinWatch/Background176_center.png and b/apps/TheBinWatch/Background176_center.png differ diff --git a/apps/TheBinWatch/app.js b/apps/TheBinWatch/app.js index 8cb8669f6..4a8e692a1 100644 --- a/apps/TheBinWatch/app.js +++ b/apps/TheBinWatch/app.js @@ -9,33 +9,56 @@ ****************************************************/ /* reuqirements */ -var locale = require("locale"); -require("Font5x9Numeric7Seg").add(Graphics); +require("Font7x11Numeric7Seg").add(Graphics); +require("Font5x7Numeric7Seg").add(Graphics); /* constants and definitions */ /* Bangle 2: 176 x 176 */ +/* month images */ + +var month = [ + /* JAN */ {width : 53, height : 24, bpp : 1, buffer : require("heatshrink").decompress(atob("AAMf/0D8AFBkM/9EvwMAgcM/3B30YgE4uEOh354EB4eAuFz90Ah0cgeDx9wgFw8Ecjk7wEDw8A8AIBgEcnEHg4IBgFh4EYnEDHYMF/8AwBID/BODgN/4EgAoI0BgODwExGgkDzg0FAII0D88A8PAnAIBAIMOgPBBAPAiBpCgPAQIOAmFwg0P/B5BwcAiE/JYYAHA"))}, + /* FEB */ {width : 51, height : 24, bpp : 1, buffer : require("heatshrink").decompress(atob("v/8n/+g/+if/hP/wM/8c/4Of8Ez/FwgE4gEHgFOAYUA8Ed4ADBgEcge4AYMAgeAu4DCgFwhwQBEIMOgPcAYMAgPAjN/4G/8EX/kf/EP/kB/+F/8C/+Ar/xGQkBGTE7wADBMIMHMotMgEGv+A7/hEYOf/EH/hvBh6FBIIKYFA"))}, + /* MAR */ {width : 52, height : 23, bpp : 1, buffer : require("heatshrink").decompress(atob("v/4j/+gf/hP/gV/6FP/HP8kz/cGv8OgHDwFwuEE8McnEHg8A905BgcO8ecBiM4BgMwuEGoeEi/8gX/wE4gH/4Ef/AMFx0QDIcA8BADnEOgIzCufABgk+Bglx+AMEh+OBgdwvnghk4gcGgfsgFDgEQoEeSgvg"))}, + /* APR */ {width : 52, height : 23, bpp : 1, buffer : require("heatshrink").decompress(atob("v/4j/4gf/hP/oV/4FP/HP9kz/EGv8OgPDwEguEE8EcnEHg8A9wMCuFwhwMTgAMBmFwg1f+EX/kC/+D/8A//AJIIMFxwZCgFwgAmCgEHnBNDgFz4AMEnwMEuPwBgkPxwMDuF88EMBgMGgfsgFDRgNAjyUF8A="))}, + /* MAY */ {width : 52, height : 24, bpp : 1, buffer : require("heatshrink").decompress(atob("v/4j/+AoMJ/8Cv/QAwPP8kz/cEgEugHDwFwsEG8McnEHg8A905BgVwh3jzgMRnAMBmAMBoeEi/8BgNgnEA//Ah/4BgcB/+OiAZCBgPgIARTB90BGYUAhwMahk4gYMBpkAocAiEP+CSDIAOAAwYMB"))}, + /* JUN */ {width : 53, height : 24, bpp : 1, buffer : require("heatshrink").decompress(atob("AAcD8ADBkMAhEvwIJBhkA4O+jEAnFwh0O/PAgPDwFwufugEOjkDwePuEAuHgjkcneAgeHgHgBAMAjk4g8HBAMAsPAjE4gY7BggCBwBPLkACBGgMBweAmI0EgecGgoBBGgfngHh4E4BAIBBh0B4IIB4EQmEEBAPA/0An5qBg0P/ED/xNBiAKBh6PCAAw="))}, + /* JUL */ {width : 53, height : 24, bpp : 1, buffer : require("heatshrink").decompress(atob("AA8hgEImAFBgcMgHB4AGBnFwh0OAoMB4eAuFwAwMOjkDweAAwNw8EcjggCw8A8HgAwMcnEHg40CsPAjE4AwUEAQIgCABMgGgcBGgMBGgo/BGggKBGgYBB8PAnA0BBQMOgJpC4EQmEENIX+gE/wFn/EP/ED/0Cv/gBQMP8EP/5QGA"))}, + /* AUG */ {width : 52, height : 24, bpp : 1, buffer : require("heatshrink").decompress(atob("n/8AocE/+gAgMP/1n+0QgGA//HgHhwEYl/wuEOjkDw8Ag4MB4E4uEABilhBgcv/EcgOCgEB/+AwBBB/AMBAgMCj/ngFgAwNw/wmCgImBBgIzDhwzFBikGhkBgUAs0AkEf4EH+A3Bgf+gBLBAwIMD"))}, + /* SEP */ {width : 51, height : 23, bpp : 1, buffer : require("heatshrink").decompress(atob("h/4j//g/+gf/wn/4M/8ABB5/wmf4mEAjkAg8Ap0AgeAgHgjvAgFwBwMD3EAhwOCu8AgIOCh3ggE4BwMB7gjCBwMYv/Ar/wi/8j/8IYMB/+BIYIODDwIyCLIMHGQYGB8JBDB4IyCAoMDw5BDB4JBDgEEMoZ6Cn/A8A6B8FP/kYgEf/EH/4eCA"))}, + /* OCT */ {width : 50, height : 23, bpp : 1, buffer : require("heatshrink").decompress(atob("h/gg/+j//w/8gf/h//+H+gF/wP//OAkHADAXgjlwAoU4g8cAgMYh0B44pCgeAuIYBgfADAnwnEDDAUcghCDgRMIsACBkAYFGKZKDngYFgJjBwAYCPgX4DAMHPgQYBgB8C8EGgAA="))}, + /* NOV */ {width : 51, height : 24, bpp : 1, buffer : require("heatshrink").decompress(atob("vkAgf4AoMX4GA/+ABIN8mEP8EggP350MgMGgF+vvDwFw8Ef4+4uEOjgiBu8OgIOBv8A8PAnFwEQMcnEHBwP8gOHgFh4EdHYNAgEQgJLFggFEhPAjFwg0cg4jDGQPnGQk8GQkPI4IyB8PDKwYOB+BWBMoMHnkOgHAn+A98BwEIh/4jnAHgX+gaGBAAcggAA=="))}, + /* DEC */ {width : 49, height : 23, bpp : 1, buffer : require("heatshrink").decompress(atob("v/gj//gP/5/4iYFC2f4hn/CAOcgMHgEBwEOgPDwEB4AJB8PAgHggeAuHggFwBoM4uEAnANBjgDBjgNBgwDBh0AiEAgowBAAQ6BwEAggFBv/BwAwBsIwWhwwDnEHAYIiBjhhDgEN/0Dn/Aj/hO4M/+Ef/JABv/8g/+A=="))}, + /* MAI */ {width : 44, height : 23, bpp : 1, buffer : require("heatshrink").decompress(atob("v/4j/+gEJ/8Cv/QgnP8kz/cA50A4eAuEc8McnEHgPOnIKD8ecBR04BQMwhlDwkX/kAoE4gH/4EABQlOiAVD8A2EgIrDBS0MnEDgHMGQMAiEEPwo="))}, + /* OKT */ {width : 51, height : 24, bpp : 1, buffer : require("heatshrink").decompress(atob("g/wAQMP//B/8DgPh//8j/AuF8n//jECh0fDAUA8PH4AGB8EcnIhBsEcgeHvkAj0DwFw98AgYjBh0dDAN4h0A4eAEgQDBl/4gFAE4MD/5OE3/ggIyBhk4gcAuAyCBIIyDIIIyDAgOAGQMBGQNwh8B4E4BwMB8BlCBIM8gF/AgMYg+Aj/wmA3B+EB/hBChiYGA"))}, + /* DEZ */ {width : 51, height : 23, bpp : 1, buffer : require("heatshrink").decompress(atob("n/wh//w//xP/gV/8F//Of4Fn/EH/04gUODAUHgHh4AFBnHgjk4BYUcgeHAoMB8eAuHgAwN4uEOjgFBh4jB4eAgED4ADBl/4gFwB4MD/4DBgQCB3/gC4PghgyBgPAGQl4gYyDjwgBGQQrBh0BGQVwDQM4F4MMLIJlEg3/gOfPAPgn/gk/+j/+h/8IoPh//gA="))} +]; + +var imgSquid = {width : 88, height : 26, bpp : 1, buffer : require("heatshrink").decompress(atob("gE/AYUYgEH////0B//gBQM8BQgDB/AKHh/A/gKBvwKBAgMOj8AnwKHBAIMBgH/BQgmCAoPnBQl4AoOAgPnwAKDuEAgYKB4YKIgfD4AKDMAMB4EDwIKIg+B8AKIgAKIh8A+AKHh0AuAKHj0AvBMG4EcgE4K458Bnh4HnEAjiOHBwMeBQpKBEgMOXQ/wBwIKDaAZQBg4KDcwT0BAAOHfgoKHgE/wDaBAAL8DA="))}; + const V2_X_STEP = 26; const V2_Y_STEP = 34; -const V2_TIME_Y_OFFSET = 30; -const V2_HX = 35; +const V2_TIME_Y_OFFSET = 8; +const V2_HX = 36; const V2_HY = 0 + V2_TIME_Y_OFFSET; const V2_MX = 10; -const V2_MY = 40 + V2_TIME_Y_OFFSET; +const V2_MY = 51 + V2_TIME_Y_OFFSET; const V2_SX = 10; -const V2_SY = 80 + V2_TIME_Y_OFFSET; -const V2_BT_X = 30; -const V2_BT_Y = 10; -const V2_DX = 160; -const V2_DY = 148; +const V2_SY = 95 + V2_TIME_Y_OFFSET; +const V2_BT_X = 135; +const V2_BT_Y = 20; +const V2_DX = 100; +const V2_DY = 141; + +const V2_BAT_POS_X = 21; +const V2_BAT_POS_Y = 40; +const V2_BAT_SIZE_X = 13; +const V2_BAT_SIZE_Y = 2; -const V2_BAT_POS_X = 127; -const V2_BAT_POS_Y = 15; -const V2_BAT_SIZE_X = 2; -const V2_BAT_SIZE_Y = 3; const V2_SCREEN_SIZE_X = 176; const V2_SCREEN_SIZE_Y = 176; const V2_BACKGROUND_IMAGE = "Background176_center.png"; @@ -112,7 +135,7 @@ var cgimg; * @param numOfBits: number of bits to draw */ function drawSquare(gfx, x, y, data, numOfBits) { - + for(i = numOfBits; i > 0 ; i--) { if( (data & 1) != 0) { gfx.fillRect(x + (i - 1) * x_step, y, @@ -132,11 +155,8 @@ function drawSquare(gfx, x, y, data, numOfBits) { * @param s: seconds */ function drawBinary(gfx, hour, minute, second) { - gfx.clear(1); - gfx.setColor(bg_color); - gfx.fillRect(0, 0, screen_size_x, screen_size_y); - gfx.setColor(fg_color); - + gfx.clear(0); + if(hour > 12) { hour -= 12; /* we use for bit for hours so we only display 12 hours*/ } @@ -159,10 +179,8 @@ function drawTime(gfx, h, m, s) { var time = (" "+h).substr(-2) + ":" + ("0"+m).substr(-2)+ ":" + ("0"+s).substr(-2); gfx.setFontAlign(0,-1); // align right bottom - gfx.setFont("5x9Numeric7Seg", 2); - gfx.setColor(fg_color); - - gfx.drawString(time, gfx.getWidth() / 2, dy, false /*clear background*/); + gfx.setFont("7x11Numeric7Seg", 2); + gfx.drawString(time, gfx.getWidth() / 2, dy + 1, false /*clear background*/); } /** @@ -173,18 +191,20 @@ function drawTime(gfx, h, m, s) { * @param gfx: graphic object to use * @param d: date object */ - +var vMonth = 0; function drawDate(gfx, d) { var dateString = "" - + ("0" + d.getDate()).substr(-2) + " " - + ("0" + d.getMonth()).substr(-2) + " " - + ("0" + d.getFullYear()).substr(-4); + + ("0" + d.getDate()).substr(-2) +// + " " +// + ("0" + d.getMonth()).substr(-2) +// + " " +// + ("0" + d.getFullYear()).substr(-2) + ; - gfx.setFontAlign(0,-1); // align right bottom - gfx.setFont("5x9Numeric7Seg",2); /* draw the current time font */ - gfx.setColor(fg_color); - - gfx.drawString(dateString, gfx.getWidth() / 2, dy, false /* don't clear background*/); + gfx.setFontAlign(-1,-1); // align right bottom + gfx.setFont("7x11Numeric7Seg",2); /* draw the current time font */ + gfx.drawString(dateString, dx, dy + 1, false /* don't clear background*/); + gfx.drawImage(month[d.getMonth()], 40, dy); } function toggleDateTime() { @@ -192,10 +212,13 @@ function toggleDateTime() { if(showDateTime > 2){ showDateTime = 0; } - draw(); } function updateVTime() { + vMonth++; + if(vMonth >= 12 + 3) { + vMonth = 0; + } second++; if(second > 59) { second = 0; @@ -219,23 +242,13 @@ function updateVTime() { * @param level: current battery level */ function drawBattery(gfx, level) { - var pos_x = bat_pos_x + 5 * (bat_size_x + 2); + var pos_y = bat_pos_y - 1; var stepLevel = Math.round((level + 10) / 20); -/* - if(stepLevel < 2) { - gfx.setColor(2); - } else if(stepLevel < 4) { - gfx.setColor(3); - } else { - gfx.setColor(4); - } -*/ - gfx.setColor(fg_color); for(i = 0; i < stepLevel; i++) { - pos_x -= bat_size_x + 2; - gfx.fillRect(pos_x, bat_pos_y, - pos_x + bat_size_x, bat_pos_y + bat_size_y); + pos_y -= bat_size_y + 2; + gfx.fillRect(bat_pos_x, pos_y, + bat_pos_x + bat_size_x, pos_y + bat_size_y); } } @@ -247,7 +260,10 @@ function drawBattery(gfx, level) { * @param gfx: graphic object * @param level: current battery level */ -function drawBT(status) { +function drawBT(gfx, status) { + if(!status) { + gfx.drawImage(require("Storage").read("bt-icon.png"), bt_x, bt_y); + } } function setRuntimeValues(resolution) { if(240 == resolution) { @@ -269,14 +285,14 @@ function setRuntimeValues(resolution) { screen_size_x = V1_SCREEN_SIZE_X; screen_size_y = V1_SCREEN_SIZE_Y; backgroundImage = V1_BACKGROUND_IMAGE; - bg_color = V1_BG_COLOR; - fg_color = V1_FG_COLOR; - + bat_pos_x = V1_BAT_POS_X; bat_pos_y = V1_BAT_POS_Y; bat_size_x = V1_BAT_SIZE_X; bat_size_y = V1_BAT_SIZE_Y; - + + setWatch(toggleDateTime, BTN1, { repeat : true, edge: "falling"}); + } else { x_step = V2_X_STEP; y_step = V2_Y_STEP; @@ -299,17 +315,17 @@ function setRuntimeValues(resolution) { screen_size_x = V2_SCREEN_SIZE_X; screen_size_y = V2_SCREEN_SIZE_Y; backgroundImage = V2_BACKGROUND_IMAGE; - bg_color = V2_BG_COLOR; - fg_color = V2_FG_COLOR; bat_pos_x = V2_BAT_POS_X; bat_pos_y = V2_BAT_POS_Y; bat_size_x = V2_BAT_SIZE_X; bat_size_y = V2_BAT_SIZE_Y; + + Bangle.on('swipe', function(direction) { toggleDateTime(direction);}); } cg = Graphics.createArrayBuffer( screen_size_x,screen_size_y, 1, {msb:true}); - + cgimg = {width:screen_size_x, height:screen_size_y, bpp:1, transparent:0, buffer:cg.buffer}; @@ -319,13 +335,12 @@ var batVLevel = 20; function draw() { - if (!Bangle.isLCDOn()) {return;} // no drawing, also no new update scheduled var d = new Date(); var h = d.getHours(), m = d.getMinutes(), s = d.getSeconds(); - + g.reset(); + drawBinary(cg, h, m, s); - cg.setColor(fg_color); - + switch(showDateTime) { case 1: drawTime(cg, h, m, s); @@ -334,12 +349,10 @@ function draw() { drawDate(cg, d); break; default: - /* do nothing */ + cg.drawImage(imgSquid, cg.getWidth() / 2 - 44, dy); } - cg.setColor(fg_color); - drawBattery(cg, batVLevel /*E.getBattery()*/); - drawBT(1); - + drawBattery(cg, /*batVLevel*/ E.getBattery()); + batVLevel += 2; if(batVLevel > 100) { batVLevel = 0; @@ -347,25 +360,20 @@ function draw() { updateVTime(); g.clear(); g.drawImages([{image:cgimg}, - {image:require("Storage").read(backgroundImage)}, - { x:bt_x, y:bt_y, rotate: 0, image:require("Storage").read("bt-icon.png")}, + {image:require("Storage").read(backgroundImage)}, +// { x:bt_x, y:bt_y, rotate: 0, image:require("Storage").read("bt-icon.png")}, ]); + drawBT(g, NRF.getSecurityStatus().connected); +// Bangle.drawWidgets(); const millis = d.getMilliseconds(); setTimeout(draw, 1000-millis); + // Bangle.loadWidgets(); } // Show launcher when button pressed Bangle.setUI("clock"); setRuntimeValues(g.getWidth()); -Bangle.on("lcdPower", function(on) { - if (on) { - draw(); - } -}); g.reset().clear(); Bangle.loadWidgets(); Bangle.drawWidgets(); -//setInterval(draw, 1000); -//var x_size = g.getWidth(); -setWatch(toggleDateTime, BTN1, { repeat : true, edge: "falling"}); draw(); diff --git a/apps/TheBinWatch/bt-icon.png b/apps/TheBinWatch/bt-icon.png index c07800ea3..cba9b5973 100644 Binary files a/apps/TheBinWatch/bt-icon.png and b/apps/TheBinWatch/bt-icon.png differ