diff --git a/apps/calendar/ChangeLog b/apps/calendar/ChangeLog index 05eca83c0..27e1e2517 100644 --- a/apps/calendar/ChangeLog +++ b/apps/calendar/ChangeLog @@ -11,3 +11,5 @@ 0.10: Use default Bangle formatter for booleans 0.11: Fix off-by-one-error on next year 0.12: Mark dated events on a day +0.13: Switch to swipe left/right for month and up/down for year selection + Display events for current month on touch diff --git a/apps/calendar/README.md b/apps/calendar/README.md index 4fc6962cf..ec1c0c55a 100644 --- a/apps/calendar/README.md +++ b/apps/calendar/README.md @@ -4,11 +4,13 @@ Basic calendar ## Usage -- Use `BTN4` (left screen tap) to go to the previous month -- Use `BTN5` (right screen tap) to go to the next month +- Swipe left to go to the previous month +- Swipe right to go to the next month +- Swipe up (Bangle.js 2 only) to go to the previous year +- Swipe down (Bangle.js 2 only) to go to the next year +- Touch to display events for current month +- Press the button (button 3 on Bangle.js 1) to exit ## Settings -- Starts Sunday: whether the calendar should start on Sunday (default is Monday). - B2 Colors: use non-dithering colors (default, recommended for Bangle 2) or the original color scheme. - diff --git a/apps/calendar/calendar.js b/apps/calendar/calendar.js index b61f2089c..83d587319 100644 --- a/apps/calendar/calendar.js +++ b/apps/calendar/calendar.js @@ -24,11 +24,24 @@ let fgOtherMonth = gray1; let fgSameMonth = white; let bgEvent = blue; const eventsPerDay=6; // how much different events per day we can display +let menuVisible = false; +const date = new Date(); const timeutils = require("time_utils"); let settings = require('Storage').readJSON("calendar.json", true) || {}; let startOnSun = ((require("Storage").readJSON("setting.json", true) || {}).firstDayOfWeek || 0) === 0; -const events = (require("Storage").readJSON("sched.json",1) || []).filter(a => a.on && a.date); // all alarms that run on a specific date + // all alarms that run on a specific date +const events = (require("Storage").readJSON("sched.json",1) || []).filter(a => a.on && a.date).map(a => { + const date = new Date(a.date); + const time = timeutils.decodeTime(a.t); + date.setHours(time.h); + date.setMinutes(time.m); + date.setSeconds(time.s); + return {date: date, msg: a.msg}; +}); +events.forEach(a => { +}); +events.sort((a,b) => a.date - b.date); if (settings.ndColors === undefined) { settings.ndColors = !g.theme.dark; @@ -192,6 +205,12 @@ function drawCalendar(date) { } } + const weekBeforeMonth = new Date(date.getTime()); + weekBeforeMonth.setDate(weekBeforeMonth.getDate() - 7); + const weekAfterMonth = new Date(date.getFullYear(), date.getMonth()+1, 0); + weekAfterMonth.setDate(weekAfterMonth.getDate() + 7); + const eventsThisMonth = events.filter(ev => ev.date > weekBeforeMonth && ev.date < weekAfterMonth); + let i = 0; for (y = 0; y < rowN - 1; y++) { for (x = 0; x < colN; x++) { @@ -215,18 +234,18 @@ function drawCalendar(date) { ); } - // Display events for this day - const eventsCurDay = events.filter(ev => ev.date === curDay.toLocalISOString().substr(0, 10)); - if (eventsCurDay.length > 0) { + if (eventsThisMonth.length > 0) { + // Display events for this day g.setColor(bgEvent); - eventsCurDay.forEach(ev => { - const time = timeutils.decodeTime(ev.t); - const hour = time.h + time.m/60.0; - const slice = hour/24*(eventsPerDay-1); // slice 0 for 0:00 up to eventsPerDay for 23:59 - const height = (y2-2) - (y1+2); // height of a cell - const sliceHeight = height/eventsPerDay; - const ystart = (y1+2) + slice*sliceHeight; - g.fillRect(x1+1, ystart, x2-2, ystart+sliceHeight); + eventsThisMonth.forEach(ev => { + if (sameDay(ev.date, curDay)) { + const hour = ev.date.getHours() + ev.date.getMinutes()/60.0; + const slice = hour/24*(eventsPerDay-1); // slice 0 for 0:00 up to eventsPerDay for 23:59 + const height = (y2-2) - (y1+2); // height of a cell + const sliceHeight = height/eventsPerDay; + const ystart = (y1+2) + slice*sliceHeight; + g.fillRect(x1+1, ystart, x2-2, ystart+sliceHeight); + } }); } @@ -242,23 +261,51 @@ function drawCalendar(date) { } } -const date = new Date(); -drawCalendar(date); -clearWatch(); -Bangle.on("touch", area => { - const month = date.getMonth(); - if (area == 1) { - let prevMonth = month > 0 ? month - 1 : 11; - if (prevMonth === 11) date.setFullYear(date.getFullYear() - 1); - date.setMonth(prevMonth); - } else { - let nextMonth = month < 11 ? month + 1 : 0; - if (nextMonth === 0) date.setFullYear(date.getFullYear() + 1); - date.setMonth(nextMonth); - } - drawCalendar(date); -}); +function setUI() { + Bangle.setUI({ + mode : "custom", + swipe: (dirLR, dirUD) => { + if (dirLR<0) { // left + const month = date.getMonth(); + let prevMonth = month > 0 ? month - 1 : 11; + if (prevMonth === 11) date.setFullYear(date.getFullYear() - 1); + date.setMonth(prevMonth); + drawCalendar(date); + } else if (dirLR>0) { // right + const month = date.getMonth(); + let nextMonth = month < 11 ? month + 1 : 0; + if (nextMonth === 0) date.setFullYear(date.getFullYear() + 1); + date.setMonth(nextMonth); + drawCalendar(date); + } else if (dirUD<0) { // up + date.setFullYear(date.getFullYear() - 1); + drawCalendar(date); + } else if (dirUD>0) { // down + date.setFullYear(date.getFullYear() + 1); + drawCalendar(date); + } + }, + btn: (n) => n === (process.env.HWVERSION === 2 ? 1 : 3) && load(), + touch: (n,e) => { + const menu = events.filter(ev => ev.date.getFullYear() === date.getFullYear() && ev.date.getMonth() === date.getMonth()).map(e => { + const dateStr = require("locale").date(e.date, 1); + const timeStr = require("locale").time(e.date, 1); + return { title: `${dateStr} ${timeStr}` + (e.msg ? " " + e.msg : "") }; + }); + if (menu.length === 0) { + menu.push({title: /*LANG*/"No events"}); + } + menu[""] = { title: require("locale").month(date) + " " + date.getFullYear() }; + menu["< Back"] = () => { + E.showMenu(); + drawCalendar(date); + setUI(); + }; + E.showMenu(menu); + } + }); +} -// Show launcher when button pressed -setWatch(() => load(), process.env.HWVERSION === 2 ? BTN : BTN3, { repeat: false, edge: "falling" }); +drawCalendar(date); +setUI(); // No space for widgets! diff --git a/apps/calendar/metadata.json b/apps/calendar/metadata.json index 5bfc422fa..b37c8e82e 100644 --- a/apps/calendar/metadata.json +++ b/apps/calendar/metadata.json @@ -1,7 +1,7 @@ { "id": "calendar", "name": "Calendar", - "version": "0.12", + "version": "0.13", "description": "Simple calendar", "icon": "calendar.png", "screenshots": [{"url":"screenshot_calendar.png"}],