From b6374f0f9ad9ad69181ad3f3ea946332643662c1 Mon Sep 17 00:00:00 2001 From: Peter Nijssen Date: Wed, 15 May 2019 14:34:16 +0200 Subject: [PATCH] resolve display of information. add today and tomorrow. minor design fixes --- postnl-card.js | 158 ++++++++++++++++++++++++++++++++++--------------- tracker.json | 4 +- 2 files changed, 111 insertions(+), 51 deletions(-) diff --git a/postnl-card.js b/postnl-card.js index 28f24c6..23479bd 100755 --- a/postnl-card.js +++ b/postnl-card.js @@ -1,4 +1,4 @@ - const LitElement = Object.getPrototypeOf( +const LitElement = Object.getPrototypeOf( customElements.get("ha-panel-lovelace") ); const html = LitElement.prototype.html; @@ -36,7 +36,7 @@ function renderStyles() { font-size: var(--paper-font-body1_-_font-size); font-weight: var(--paper-font-body1_-_font-weight); line-height: var(--paper-font-body1_-_line-height); - padding-bottom: 16px); + padding-bottom: 16px; } ha-card.no-header { padding: 16px 0; @@ -126,15 +126,15 @@ function renderStyles() { margin: 0; align-self: left; } + + footer { + padding: 16px; + color: red; + } ` } -function isToday(dateParameter) { - var today = new Date(); - return dateParameter.getDate() === today.getDate() && dateParameter.getMonth() === today.getMonth() && dateParameter.getFullYear() === today.getFullYear(); -} - class PostNL extends LitElement { static get properties() { return { @@ -157,9 +157,14 @@ class PostNL extends LitElement { super() this._hass = null - this.delivery = null - this.distribution = null - this.letters = null + this.deliveryObject = null + this.distributionObject = null + this.letterObject = null + this.delivery_enroute = [] + this.delivery_delivered = [] + this.distribution_enroute = [] + this.distribution_delivered = [] + this.letters = [] this.icon = null this.name = null this.date_format = null @@ -173,15 +178,15 @@ class PostNL extends LitElement { this._hass = hass if (this.config.delivery) { - this.delivery = hass.states[this.config.delivery] + this.deliveryObject = hass.states[this.config.delivery] } if (this.config.distribution) { - this.distribution = hass.states[this.config.distribution] + this.distributionObject = hass.states[this.config.distribution] } if (this.config.letters) { - this.letters = hass.states[this.config.letters] + this.letterObject = hass.states[this.config.letters] } if (this.config.hide) { @@ -219,6 +224,53 @@ class PostNL extends LitElement { } this._language = hass.language + + this.delivery_enroute = [] + this.delivery_delivered = [] + this.distribution_enroute = [] + this.distribution_delivered = [] + + // Format letters + Object.entries(this.letterObject.attributes.letters).sort((a, b) => new Date(b[1].delivery_date) - new Date(a[1].delivery_date)).map(([key, letter]) => { + if (window.moment) { + if (moment(letter.delivery_date).isBefore(moment().subtract(this.past_days, 'days').startOf('day'))) { + return; + } + } + + this.letters.push(letter); + }); + + // Format deliveries + Object.entries(this.deliveryObject.attributes.enroute).sort((a, b) => new Date(b[1].planned_date) - new Date(a[1].planned_date)).map(([key, shipment]) => { + this.delivery_enroute.push(shipment); + }); + + Object.entries(this.deliveryObject.attributes.delivered).sort((a, b) => new Date(b[1].delivery_date) - new Date(a[1].delivery_date)).map(([key, shipment]) => { + if (window.moment) { + if (shipment.delivery_date != null && moment(shipment.delivery_date).isBefore(moment().subtract(this.past_days, 'days').startOf('day'))) { + return; + } + } + + + this.delivery_delivered.push(shipment); + }); + + // Format distribution + Object.entries(this.distributionObject.attributes.enroute).sort((a, b) => new Date(b[1].planned_date) - new Date(a[1].planned_date)).map(([key, shipment]) => { + this.distribution_enroute.push(shipment); + }); + + Object.entries(this.distributionObject.attributes.delivered).sort((a, b) => new Date(b[1].delivery_date) - new Date(a[1].delivery_date)).map(([key, shipment]) => { + if (window.moment) { + if (shipment.delivery_date != null && moment(shipment.delivery_date).isBefore(moment().subtract(this.past_days, 'days').startOf('day'))) { + return; + } + } + + this.distribution_delivered.push(shipment); + }); } render({ _hass, _hide, _values, config, delivery, distribution, letters } = this) { @@ -244,6 +296,7 @@ class PostNL extends LitElement { ${this.renderLetters()} ${this.renderDelivery()} ${this.renderDistribution()} + ${this.renderWarning()} ` } @@ -259,19 +312,29 @@ class PostNL extends LitElement { ` } + renderWarning() { + if (window.moment) return '' + + return html` + + ` + } + renderLettersInfo() { if (!this.letters) return '' return html`

- ${this.letters.state} letters + ${this.letters.length} letters
` } renderLetters() { - if (!this.letters || (this.letters && this.letters.state === "0")) return '' + if (!this.letters || (this.letters && this.letters.length === 0)) return '' return html`
@@ -289,7 +352,7 @@ class PostNL extends LitElement { - ${Object.entries(this.letters.attributes.letters).sort((a, b) => new Date(b[1].delivery_date) - new Date(a[1].delivery_date)).map(([key, letter]) => { + ${Object.entries(this.letters).map(([key, letter]) => { return this.renderLetter(letter) })} @@ -301,22 +364,16 @@ class PostNL extends LitElement { renderLetterImage() { if (this._hide.first_letter) return '' - if (this.letters.attributes.letters[0].image == null) return '' + if (this.letters[0] == null || this.letters[0].image == null) return '' return html`
- +
` } renderLetter(letter) { - if (window.moment) { - if (moment(letter.delivery_date).isBefore(moment().subtract(this.past_days, 'days').startOf('day'))) { - return; - } - } - if (letter.image == null) { return html` @@ -337,41 +394,42 @@ class PostNL extends LitElement { } renderDeliveryInfo() { - if (!this.delivery) return '' + if (!this.deliveryObject) return '' return html`

- ${this.delivery.state} enroute + ${this.delivery_enroute.length} enroute

- ${this.delivery.attributes.delivered.length} delivered + ${this.delivery_delivered.length} delivered
` } renderDistributionInfo() { - if (!this.distribution) return '' + if (!this.distributionObject) return '' return html`

- ${this.distribution.state} enroute + ${this.distribution_enroute.length} enroute

- ${this.distribution.attributes.delivered.length} delivered + ${this.distribution_delivered.length} delivered
` } renderDelivery() { - if (!this.delivery) return '' + if (!this.deliveryObject) return '' - // Nothing enroute and delivery disabled - if (this.delivery.state === "0" && this._hide.delivered) return '' + if (this.delivery_enroute.length === 0 && this._hide.delivered) return '' + + if (this.delivery_enroute.length === 0 && this.delivery_delivered.length === 0) return '' return html`
@@ -388,11 +446,11 @@ class PostNL extends LitElement { - ${Object.entries(this.delivery.attributes.enroute).sort((a, b) => new Date(b[1].planned_date) - new Date(a[1].planned_date)).map(([key, shipment]) => { + ${Object.entries(this.delivery_enroute).map(([key, shipment]) => { return this.renderShipment(shipment) })} - ${this._hide.delivered ? "" : Object.entries(this.delivery.attributes.delivered).sort((a, b) => new Date(b[1].delivery_date) - new Date(a[1].delivery_date)).map(([key, shipment]) => { + ${this._hide.delivered ? "" : Object.entries(this.delivery_delivered).map(([key, shipment]) => { return this.renderShipment(shipment) })} @@ -403,10 +461,11 @@ class PostNL extends LitElement { renderDistribution() { // Distribution disabled - if (!this.distribution ) return '' + if (!this.distributionObject) return '' + + if (this.distribution_enroute.length === 0 && this._hide.delivered) return '' - // Nothing enroute and delivery disabled - if (this.distribution.state === "0" && this._hide.delivered) return '' + if (this.distribution_enroute.length === 0 && this.distribution_delivered.length === 0) return '' return html`
@@ -423,11 +482,11 @@ class PostNL extends LitElement { - ${Object.entries(this.distribution.attributes.enroute).sort((a, b) => new Date(b[1].planned_date) - new Date(a[1].planned_date)).map(([key, shipment]) => { + ${Object.entries(this.distribution_enroute).map(([key, shipment]) => { return this.renderShipment(shipment) })} - ${this._hide.delivered ? "" : Object.entries(this.distribution.attributes.delivered).sort((a, b) => new Date(b[1].delivery_date) - new Date(a[1].delivery_date)).map(([key, shipment]) => { + ${this._hide.delivered ? "" : Object.entries(this.distribution_delivered).map(([key, shipment]) => { return this.renderShipment(shipment) })} @@ -437,18 +496,14 @@ class PostNL extends LitElement { } renderShipment(shipment) { - var delivery_date = "Unknown" - - if (window.moment) { - if (shipment.delivery_date != null && moment(shipment.delivery_date).isBefore(moment().subtract(this.past_days, 'days').startOf('day'))) { - return; - } - } + var delivery_date = "Unknown"; + var className = "delivered"; // Convesion Time if (shipment.delivery_date != null) { var delivery_date = this.dateConversion(shipment.delivery_date) } else if (shipment.planned_date != null) { + var className = "enroute"; var delivery_date = this.dateConversion(shipment.planned_date) + " " + this.timeConversion(shipment.planned_from) + " - " + @@ -456,7 +511,7 @@ class PostNL extends LitElement { } return html` - + ${shipment.name} ${shipment.status_message} ${delivery_date} @@ -467,7 +522,12 @@ class PostNL extends LitElement { dateConversion(date) { if (window.moment) { date = moment(date); - return date.format(this.date_format); + + return date.calendar(null, { + sameDay: '[Today]', + nextDay: '[Tomorrow]', + sameElse: this.date_format + }); } return (new Date(date)).toLocaleDateString(this._language) diff --git a/tracker.json b/tracker.json index 07ada01..f032b8d 100644 --- a/tracker.json +++ b/tracker.json @@ -1,9 +1,9 @@ { "postnl-card": { - "version": "0.9.0", + "version": "0.9.1", "updated_at": "2019-05-15", "visit_repo": "https://github.com/peternijssen/lovelace-postnl", - "remote_location": "https://github.com/peternijssen/lovelace-postnl/releases/download/0.9.0/postnl-card.js", + "remote_location": "https://github.com/peternijssen/lovelace-postnl/releases/download/0.9.1/postnl-card.js", "changelog": "https://github.com/peternijssen/lovelace-postnl/releases/latest" } }