diff --git a/calendar_monthly.js b/calendar_monthly.js index fbe0a4d..30031c7 100644 --- a/calendar_monthly.js +++ b/calendar_monthly.js @@ -154,13 +154,21 @@ innerSpan.className = "monthPrev"; innerSpan.innerHTML = moment().subtract(1, 'months').endOf('month').subtract((startingDay - 1) - j, 'days').date(); } else if (day <= monthLength && (i > 0 || j >= startingDay)) { - if (day == moment().date()) { + var momentDay = moment().date(day); + var dayEvents = (this.events || []).filter(function(event) { + return momentDay.isSame(event.startDate, 'day') || momentDay.isBetween(event.startDate, event.endDate, 'day', "[)"); + }); + if (momentDay.isSame(moment(), 'day')) { innerSpan.id = "day" + day; innerSpan.className = "today"; } else { innerSpan.id = "day" + day; innerSpan.className = "daily"; } + if (dayEvents.length != 0) { + innerSpan.className = innerSpan.className + " events"; + innerSpan.style = "--event-count: " + dayEvents.length + "; --event-color: " + dayEvents[0].color; + } innerSpan.innerHTML = day; day++; } else if (day > monthLength && i > 0) { @@ -243,6 +251,26 @@ var nextRefresh = moment([now.year(), now.month(), now.date(), now.hour() + 1]); this.scheduleUpdate(nextRefresh); - } + }, + + notificationReceived: function(notification, payload, sender) { + var self = this; + if (notification == "CALENDAR_EVENTS") { + var result = []; + for (event of payload) { + var startDate = moment(parseInt(event.startDate)); + var endDate = moment(parseInt(event.endDate)); + + result.push({ + startDate : startDate, + endDate: endDate, + color: event.color + }); + } + self.events = result; + self.loaded = false; + self.updateDom(this.config.fadeSpeed * 1000); + } + } }); diff --git a/css/themes/block.css b/css/themes/block.css index c03339e..45d0af0 100644 --- a/css/themes/block.css +++ b/css/themes/block.css @@ -28,6 +28,12 @@ color: #333333; } +.square-content .events { + border: 1px solid var(--event-color); + border-radius: 2px; + background-color: var(--event-color); +} + .square-content div { display: table; width: 100%; diff --git a/css/themes/custom.css b/css/themes/custom.css index b03794c..9c17d6b 100644 --- a/css/themes/custom.css +++ b/css/themes/custom.css @@ -51,6 +51,11 @@ color: #80ff00; } +.square-content .events { + border: 1px solid var(--event-color); + color: var(--event-color); +} + .square-content div { display: table; width: 100%; diff --git a/css/themes/slate.css b/css/themes/slate.css index a95edbe..17555a7 100644 --- a/css/themes/slate.css +++ b/css/themes/slate.css @@ -64,6 +64,10 @@ color: #ffffff; } +.square-content .events { + color: var(--event-color); +} + .square-content div { display: table; width: 100%;