From 53382c0339d4be0211ca333a172b4c20253f4c46 Mon Sep 17 00:00:00 2001
From: Dan <47124032+dc-s@users.noreply.github.com>
Date: Mon, 4 Mar 2019 21:15:21 +0000
Subject: [PATCH 1/2] added hide time and date formatting options

---
 README.md |  5 ++++-
 main.js   | 33 ++++++++++++++++++++++++++++-----
 2 files changed, 32 insertions(+), 6 deletions(-)

diff --git a/README.md b/README.md
index ab6abf4..35ee3b9 100644
--- a/README.md
+++ b/README.md
@@ -7,7 +7,7 @@
 <h2>Features</h2>
 
 * Show the next 5 events on your Google Calendar (default set by home assistant)
-* Set custom time format for each event
+* Set custom time and date format for each event
 * Click on event to open in your Google calendar app
 * Integrate multiple calendars
 * Update notifications via custom_updater
@@ -40,7 +40,10 @@ You should have setup Google calendar integration or Caldav integration in HomeA
 | numberOfDays | number | **Optional** | `7` Number of days to display from calendars
 | entities | object | **Required** | List of calendars to display
 | timeFormat | string | **Optional** | `HH:mm` Format to show event time (see [here](https://momentjs.com/docs/#/displaying/format/) for options)
+| dateTopFormat | string | **Optional** | `Dd` Format for top line of event date
+| dateBottomFormat | string | **Optional** | `ddd` Format to bottom line of event date
 | progressBar | boolean | **Optional** | `false` Adds progress bar to ongoing events
+| hideTime | boolean | **Optional** | `false` Hides event time section entirely
 
 <h2>Configuration</h2>
 Download `calendar-card.js` from the [latest release](https://github.com/ljmerza/calendar-card/releases/latest) and upload it your /www folder of your Home Assistant config directory.
diff --git a/main.js b/main.js
index 9ae94ee..238067d 100644
--- a/main.js
+++ b/main.js
@@ -131,6 +131,9 @@ class CalendarCard extends LitElement {
       title: 'Calendar',
       numberOfDays: 7,
       timeFormat: 'HH:mm',
+      dateTopFormat: 'DD',
+      dateBottomFormat: 'ddd',
+      hideTime: false,
       progressBar: false,
       ...config,
     };
@@ -238,12 +241,11 @@ class CalendarCard extends LitElement {
       const eventsTemplate = eventDay.events.map((event, index) => html`
           <tr class='day-wrapper ${eventDay.events.length === index + 1 ? 'day-wrapper-last' : ''}'>
             <td class="date">
-              <div>${index === 0 ? momentDay.format('DD') : ''}</div>
-              <div>${index === 0 ? momentDay.format('ddd') : ''}</div>
+              ${this.getDateHtml(index,momentDay)}
             </td>
             <td class="overview" @click=${() => this.getLinkHtml(event)}>
               <div class="title">${event.title}</div>
-              <div class="time">${this.getTimeHtml(event)}</div>
+              ${this.getTimeHtml(event)}
               ${this.config.progressBar ? this.buildProgressBar(event) : ''}
             </td>
             <td class="location">
@@ -341,16 +343,37 @@ class CalendarCard extends LitElement {
     }
   }
 
+  /**
+   * generates HTML for showing date an event is taking place
+   * @param  {index,momentDay}
+   */
+  getDateHtml(index,momentDay) {
+
+    const top = index === 0 ? momentDay.format(this.config.dateTopFormat) : '';
+    const bottom = index === 0 ? momentDay.format(this.config.dateBottomFormat) : '';
+
+    return html`
+      <div>
+        ${top}
+      </div>
+      <div>
+        ${bottom}
+      </div>
+      `;
+  }
+
   /**
    * generates HTML for showing an event times
    * @param {CalendarEvent} event
    */
   getTimeHtml(event) {
-    if (event.isFullDayEvent) return html`All day`;
+    if(this.config.hideTime === true) return html``;
+
+    if (event.isFullDayEvent) return html`<div class="time">All day</div>`;
 
     const start = moment(event.startDateTime).format(this.config.timeFormat);
     const end = moment(event.endDateTime).format(this.config.timeFormat);
-    return html`${start} - ${end}`;
+    return html`<div class="time">${start} - ${end}</div>`;
   }
 
   /**

From decb99a55f50380bcfbf76ee8a4e170ef8a503c2 Mon Sep 17 00:00:00 2001
From: Leonardo Merza <ljmerza@gmail.com>
Date: Mon, 4 Mar 2019 17:56:00 -0500
Subject: [PATCH 2/2] update readme

---
 README.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/README.md b/README.md
index ee05306..8b265a1 100644
--- a/README.md
+++ b/README.md
@@ -40,7 +40,7 @@ You should have setup Google calendar integration or Caldav integration in HomeA
 | numberOfDays | number | **Optional** | `7` Number of days to display from calendars
 | entities | object | **Required** | List of calendars to display
 | timeFormat | string | **Optional** | `HH:mm` Format to show event time (see [here](https://momentjs.com/docs/#/displaying/format/) for options)
-| dateTopFormat | string | **Optional** | `Dd` Format for top line of event date
+| dateTopFormat | string | **Optional** | `DD` Format for top line of event date
 | dateBottomFormat | string | **Optional** | `ddd` Format to bottom line of event date
 | progressBar | boolean | **Optional** | `false` Adds progress bar to ongoing events
 | hideTime | boolean | **Optional** | `false` Hides event time section entirely