Skip to content

Commit c84c9c5

Browse files
marksie1988marksie1988
authored
Merge branch 'master' into dependabot/npm_and_yarn/master/babel/core-7.11.1
2 parents b7700f1 + e5e2d54 commit c84c9c5

File tree

6 files changed

+78
-32
lines changed

6 files changed

+78
-32
lines changed

‎dist/atomic-calendar-revive.js‎

Lines changed: 18 additions & 18 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎docs/options/main-options.md‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -24,9 +24,11 @@ nav_order: 1
2424
| disableEventLink | boolean | optional | v0.10.0 | `false` disables links in event title. |
2525
| disableLocationLink | boolean | optional | v0.10.0 | `false` disables links in event location. |
2626
| linkTarget | string | optional | v0.11.0 | `_blank` Allows custom target for links, default will open new tab. |
27-
| showFullDayProgress | string | optional | v1.7.0 | `false` Enables the progress bar for full day events |
27+
| showFullDayProgress | boolean | optional | v1.7.0 | `false` Enables the progress bar for full day events |
2828
| showDeclined | boolean | optional | v2.0.0 | `false` show/hide events that have been declined |
2929
| defaultMode | integer | optional | v2.0.0 | `Event` Set `Event` to make Events default mode, set `Calendar` to make Calendar mode default |
30+
| refreshInterval | integer | optional | v2.1.0 | `60` Set how often the calendar should refresh data in seconds |
31+
| showRelativeTime | boolean | optional | v2.1.0 | `true` show relative time to event |
3032

3133
# Color Options
3234

‎package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "atomic-calendar-revive",
3-
"version": "2.0.1",
3+
"version": "2.1.0",
44
"description": "Calendar Card for Home Assistant",
55
"main": "atomic-calendar-revive.js",
66
"scripts": {

‎src/const.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,2 +1,2 @@
1-
export const CARD_VERSION = '2.0.1';
1+
export const CARD_VERSION = '2.1.0';
22
export const EDITOR_VERSION = '1.0.0';

‎src/index.ts‎

Lines changed: 53 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -123,6 +123,7 @@ class AtomicCalendarRevive extends LitElement {
123123
timeColor: 'var(--primary-color)', // Time text color (center bottom)
124124
timeSize: 90, //Time text size
125125
showHours: true, //shows the bottom line (time, duration of event)
126+
showRelativeTime: true,
126127

127128
eventTitleColor: 'var(--primary-text-color)', //Event title settings (center top), if no custom color set
128129
eventTitleSize: 100,
@@ -168,6 +169,7 @@ class AtomicCalendarRevive extends LitElement {
168169
calEventTime: false, // show calendar event summary time
169170

170171
firstDayOfWeek: 1, // default 1 - monday
172+
refreshInterval: 60,
171173
...customConfig,
172174
};
173175

@@ -255,7 +257,7 @@ class AtomicCalendarRevive extends LitElement {
255257

256258
// check if an update is needed
257259
if (!this.isUpdating && this.modeToggle == 'Event') {
258-
if (!this.lastEventsUpdateTime || moment().diff(this.lastEventsUpdateTime, 'seconds') > 60) {
260+
if (!this.lastEventsUpdateTime || moment().diff(this.lastEventsUpdateTime, 'seconds') > this._config.refreshInterval) {
259261
this.showLoader = true;
260262
this.isUpdating = true;
261263
try {
@@ -368,6 +370,21 @@ class AtomicCalendarRevive extends LitElement {
368370
display: flex;
369371
justify-content: space-between;
370372
padding: 0px 5px 0 5px;
373+
color: ${this._config.descColor};
374+
font-size: ${this._config.descSize}%;
375+
}
376+
377+
.hoursHTML {
378+
color: ${this._config.timeColor};
379+
font-size: ${this._config.timeSize}%;
380+
float: left;
381+
}
382+
383+
.relativeTime {
384+
color: ${this._config.timeColor};
385+
font-size: ${this._config.timeSize}%;
386+
float: right;
387+
padding-left: 5px;
371388
}
372389
373390
.event-main {
@@ -458,6 +475,11 @@ class AtomicCalendarRevive extends LitElement {
458475
margin: auto;
459476
}
460477
478+
td.currentDay{
479+
color: var(--paper-item-icon-active-color);
480+
background-color: ${this._config.calEventBackgroundColor};
481+
}
482+
461483
tr.cal {
462484
width: 100%;
463485
}
@@ -657,6 +679,18 @@ class AtomicCalendarRevive extends LitElement {
657679
else return html`<div>${event.startTime.format('LT')} - ${event.endTime.format('LT')}</div>`;
658680
}
659681

682+
/**
683+
* generate Event Relative Time HTML
684+
*
685+
*/
686+
687+
getRelativeTime(event) {
688+
const today = moment();
689+
if (event.isEmpty) return html``;
690+
else if (!moment(event.startTime).isBefore(today,'day'))
691+
return html`(${today.to(moment(event.startTime))})`;
692+
}
693+
660694
/**
661695
* generate Event Location link HTML
662696
*
@@ -668,10 +702,12 @@ class AtomicCalendarRevive extends LitElement {
668702
<div><ha-icon class="event-location-icon" icon="mdi:map-marker"></ha-icon>&nbsp;${event.address}</div>
669703
`;
670704
else
705+
var loc: String = event.location;
706+
const location: String = loc.startsWith("http") ? loc : "https://maps.google.com/?q=" + loc;
671707
return html`
672708
<div>
673709
<a
674-
href="https://maps.google.com/?q=${event.location}"
710+
href=${location}
675711
target="${this._config.linkTarget}"
676712
class="location-link"
677713
>
@@ -683,13 +719,16 @@ class AtomicCalendarRevive extends LitElement {
683719
getCalLocationHTML(event) {
684720
if (!event.location || !this._config.showLocation || this._config.disableCalLocationLink) return html``;
685721
else
722+
var loc: String = event.location;
723+
const location: String = loc.startsWith("http") ? loc : "https://maps.google.com/?q=" + loc;
686724
return html`
687-
<a href="https://maps.google.com/?q=${event.location}" target="${this._config.linkTarget}" class="location-link"
725+
<a href=${location} target="${this._config.linkTarget}" class="location-link"
688726
><ha-icon class="event-location-icon" icon="mdi:map-marker"></ha-icon>&nbsp;</a
689727
>
690728
`;
691729
}
692730

731+
693732
/**
694733
* update Events main HTML
695734
*
@@ -793,14 +832,18 @@ class AtomicCalendarRevive extends LitElement {
793832
: ``;
794833

795834
const hoursHTML = this._config.showHours
796-
? html`<div style="color: ${this._config.timeColor}; font-size: ${this._config.timeSize}%;">
835+
? html`<div class="hoursHTML">
797836
${this.getHoursHTML(event)}
798837
</div>`
799838
: '';
839+
const relativeTime = this._config.showRelativeTime
840+
? html`<div class="relativeTime">
841+
${this.getRelativeTime(event)}
842+
</div>`
843+
: '';
800844
const descHTML = this._config.showDescription
801845
? html`<div
802846
class="event-description"
803-
style="color: ${this._config.descColor};font-size: ${this._config.descSize}%;"
804847
>
805848
${event.description}
806849
</div>`
@@ -817,7 +860,7 @@ class AtomicCalendarRevive extends LitElement {
817860
<div>${currentEventLine}</div>
818861
<div class="event-right">
819862
<div class="event-main">
820-
${this.getTitleHTML(event)} ${hoursHTML}
863+
${this.getTitleHTML(event)} ${hoursHTML} ${relativeTime}
821864
</div>
822865
<div class="event-location">
823866
${this.getLocationHTML(event)} ${eventCalName}
@@ -1193,7 +1236,8 @@ class AtomicCalendarRevive extends LitElement {
11931236

11941237
return month.map((day, i) => {
11951238
const dayStyleOtherMonth = moment(day.date).isSame(moment(this.selectedMonth), 'month') ? '' : `opacity: .35;`;
1196-
const dayStyleToday = moment(day.date).isSame(moment(), 'day') ? `background-color: ${this._config.calEventBackgroundColor};` : ``;
1239+
const dayStyleToday = moment(day.date).isSame(moment(), 'day') ? `border: 2px solid; background-color: ${this._config.calEventBackgroundColor};` : ``;
1240+
const dayClassToday = moment(day.date).isSame(moment(), 'day') ? `currentDay` : ``;
11971241
const dayStyleSat = moment(day.date).isoWeekday() == 6 ? `background-color: ${this._config.calEventSatColor};` : ``;
11981242
const dayStyleSun = moment(day.date).isoWeekday() == 7 ? `background-color: ${this._config.calEventSunColor};` : ``;
11991243
const dayStyleClicked = moment(day.date).isSame(moment(this.clickedDate), 'day') ? `background-color: ${this._config.calActiveEventBackgroundColor};` : ``;
@@ -1203,9 +1247,9 @@ class AtomicCalendarRevive extends LitElement {
12031247
${i % 7 === 0 ? html`<tr class="cal"></tr>` : ''}
12041248
<td
12051249
@click="${ _e => this.handleEventSummary(day)}"
1206-
class="cal"
1250+
class="cal ${dayClassToday}"
12071251
style="color: ${this._config
1208-
.calDayColor};${dayStyleOtherMonth}${dayStyleToday}${dayStyleSat}${dayStyleSun}${dayStyleClicked}"
1252+
.calDayColor};${dayStyleOtherMonth}${dayStyleSat}${dayStyleSun}${dayStyleClicked}"
12091253
>
12101254
<div class="calDay">
12111255
<div style="position: relative; top: 5%;">

‎tracker.json‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
{
22
"atomic-calendar-revive": {
3-
"updated_at": "2020-08-04",
4-
"version": "2.0.1",
3+
"updated_at": "2020-08-05",
4+
"version": "2.1.0",
55
"remote_location": "https://github.com/marksie1988/atomic-calendar-revive/releases/latest/dist/atomic-calendar-revive.js",
66
"visit_repo": "https://github.com/marksie1988/atomic-calendar-revive",
77
"changelog": "https://github.com/marksie1988/atomic-calendar-revive/releases/latest"

0 commit comments

Comments
 (0)