Fix Apple not showing cards (#7232)

This commit is contained in:
Bram Kragten 2020-10-05 15:54:32 +02:00 committed by GitHub
parent da9faccada
commit 3940606167
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 9 additions and 9 deletions

View File

@ -98,10 +98,9 @@ export class MasonryView extends LitElement implements LovelaceViewElement {
} }
protected firstUpdated(): void { protected firstUpdated(): void {
this._updateColumns = this._updateColumns.bind(this);
this._mqls = [300, 600, 900, 1200].map((width) => { this._mqls = [300, 600, 900, 1200].map((width) => {
const mql = matchMedia(`(min-width: ${width}px)`); const mql = window.matchMedia(`(min-width: ${width}px)`);
mql.addEventListener("change", this._updateColumns); mql.addListener(() => this._updateColumns());
return mql; return mql;
}); });
this._updateColumns(); this._updateColumns();
@ -120,10 +119,7 @@ export class MasonryView extends LitElement implements LovelaceViewElement {
if (changedProperties.has("hass")) { if (changedProperties.has("hass")) {
const oldHass = changedProperties.get("hass") as HomeAssistant; const oldHass = changedProperties.get("hass") as HomeAssistant;
if ( if (oldHass && this.hass!.dockedSidebar !== oldHass.dockedSidebar) {
(oldHass && this.hass!.dockedSidebar !== oldHass.dockedSidebar) ||
(!oldHass && this.hass)
) {
this._updateColumns(); this._updateColumns();
} }
@ -155,6 +151,10 @@ export class MasonryView extends LitElement implements LovelaceViewElement {
} }
private async _createColumns() { private async _createColumns() {
if (!this._columns) {
return;
}
this._createColumnsIteration++; this._createColumnsIteration++;
const iteration = this._createColumnsIteration; const iteration = this._createColumnsIteration;
const root = this.shadowRoot!.getElementById("columns")!; const root = this.shadowRoot!.getElementById("columns")!;
@ -168,7 +168,7 @@ export class MasonryView extends LitElement implements LovelaceViewElement {
const columnSizes: number[] = []; const columnSizes: number[] = [];
const columnElements: HTMLDivElement[] = []; const columnElements: HTMLDivElement[] = [];
// Add columns to DOM, limit number of columns to the number of cards // Add columns to DOM, limit number of columns to the number of cards
for (let i = 0; i < Math.min(this._columns!, this.cards.length); i++) { for (let i = 0; i < Math.min(this._columns, this.cards.length); i++) {
const columnEl = document.createElement("div"); const columnEl = document.createElement("div");
columnEl.classList.add("column"); columnEl.classList.add("column");
root.appendChild(columnEl); root.appendChild(columnEl);

View File

@ -2331,7 +2331,7 @@
"toggle": "Toggle entities.", "toggle": "Toggle entities.",
"description": "The Entities card is the most common type of card. It groups items together into lists.", "description": "The Entities card is the most common type of card. It groups items together into lists.",
"special_row": "special row", "special_row": "special row",
"edit_special_row": "Edit row using the code editor", "edit_special_row": "View the details of this row by clicking the edit button",
"entity_row_editor": "Entity Row Editor", "entity_row_editor": "Entity Row Editor",
"secondary_info_values": { "secondary_info_values": {
"none": "No Secondary Info", "none": "No Secondary Info",