0.7.3 added time shift, timezone correction, hour format

Author: atomic7777

README.md

@@ -1,4 +1,4 @@
-# atomic calendar card v0.7.2
+# atomic calendar card v0.7.3
 Advanced calendar card for Home Assistant with Lovelace
 
 Calendar card with advanced settings. It loads calendar events from Home Assistant - Google calendar component.
@@ -35,7 +35,7 @@ If you have any suggestions about design or functionality, please let me know, o
 
 ## 1. Installation
 1. You need to have the ![Google calendar](https://www.home-assistant.io/components/calendar.google/) component configured in Home Assistant.
-2. Download `atomic-calendar.js` file to `/www` directory in your Home Assistant - [latest release](https://github.com/atomic7777/atomic_calendar/releases/download/v0.7.2/atomic-calendar.js) - link not working (in development)
+2. Download `atomic-calendar.js` file to `/www` directory in your Home Assistant - [latest release](https://github.com/atomic7777/atomic_calendar/releases/download/v0.7.3/atomic-calendar.js) - link not working (in development)
 3. Add this reference to your `ui-lovelace.yaml` file:
   ```yaml
   resources:
@@ -62,8 +62,8 @@ If you have any suggestions about design or functionality, please let me know, o
 | showLoader | boolean | optional | v0.7.0 | `true` Show animation, when events are being loaded from Google Calendar.
 | showDate | boolean | optional | v0.7.2 | `false` Show the date on the right side of the title
 | dateFormat | string | optional | v0.7.2 | `LL` Custom date format - see https://devhints.io/moment for examples
-| hoursFormat | string | optional | v0.7.3 | `default` Custom hours format - `12h` or `24h` or `default` (default for local HA language settings)
-
+| hoursFormat | string | optional | v0.7.3 | `default` Custom hours format - you can set `12h` or `24h` or `default` (default for local HA language settings) or even provide your custom, like `HH:mm` or `h:mm A` - see https://devhints.io/moment for examples
+| startDaysAhead | integer | optional | v0.7.3 | `0` If you set more than 0, events will be loaded starting `x` days from today. For example `1` - the component will show events starting from tomorrow.
 
 ### Text colors and fonts
 | Name | Type | Since | Description |

app.js

@@ -10,7 +10,8 @@ class AtomicCalendar extends LitElement {
 
 	let timeFormat = moment.localeData(this._hass.language).longDateFormat('LT')
 	if (this.config.hoursFormat=='12h') timeFormat = 'h:mm A'
-	else if (this.config.hoursFormat=='24h') timeFormat = 'hh:mm'
+	else if (this.config.hoursFormat=='24h') timeFormat = 'H:mm'
+	else if(this.config.hoursFormat!='default') timeFormat = this.config.hoursFormat
 		moment.updateLocale(this._hass.language, {
 			week: {
 				dow: this.config.firstDayOfWeek
@@ -61,6 +62,7 @@ class AtomicCalendar extends LitElement {
 					try {
 						this.events = await this.getEvents()
 					} catch (error) {
+						console.log(error)
 						this.errorMessage = 'The calendar can\'t be loaded from Home Assistant component'
 					}
 
@@ -405,7 +407,7 @@ class AtomicCalendar extends LitElement {
 			showDate: false,
 			dateFormat: 'LL',
 			hoursFormat: 'default', // 12h / 24h / default time format. Default is HA language setting.
-
+			startDaysAhead: 0, // shows the events starting on x days from today. Default 0.
 
 			// color and font settings
 			dateColor: 'var(--primary-text-color)', // Date text color (left side)
@@ -673,8 +675,11 @@ class AtomicCalendar extends LitElement {
 	 * 
 	 */
 	async getEvents() {
-		let start = moment().startOf('day').format('YYYY-MM-DDTHH:mm:ss');
-		let end = moment().add(this.config.maxDaysToShow, 'days').format('YYYY-MM-DDTHH:mm:ss');
+
+
+		let timeOffset = new Date().getTimezoneOffset()
+		let start = moment().add(this.config.startDaysAhead, 'days').startOf('day').add(timeOffset,'minutes').format('YYYY-MM-DDTHH:mm:ss');
+		let end = moment().add((this.config.maxDaysToShow + this.config.startDaysAhead), 'days').endOf('day').add(timeOffset,'minutes').format('YYYY-MM-DDTHH:mm:ss');
 		let calendarUrlList = this.config.entities.map(entity =>
 			`calendars/${entity.entity}?start=${start}Z&end=${end}Z`)
 		try {
@@ -713,8 +718,9 @@ class AtomicCalendar extends LitElement {
 	 */
 	getCalendarEvents(startDay, endDay, monthToGet, month) {
 		this.refreshCalEvents = false
-		let start = moment(startDay).startOf('day').format('YYYY-MM-DDTHH:mm:ss');
-		let end = moment(endDay).endOf('day').format('YYYY-MM-DDTHH:mm:ss');
+		let timeOffset = new Date().getTimezoneOffset()
+		let start = moment(startDay).startOf('day').add(timeOffset,'minutes').format('YYYY-MM-DDTHH:mm:ss');
+		let end = moment(endDay).endOf('day').add(timeOffset,'minutes').format('YYYY-MM-DDTHH:mm:ss');
 		// calendarUrlList[url, type of event configured for this callendar,filters]
 		let calendarUrlList = []
 		this.config.entities.map(entity => {