Upgrades HACS

www/community/pvpc-hourly-pricing-card/pvpc-hourly-pricing-card-editor.js

@@ -0,0 +1,242 @@
+const fireEvent = (node, type, detail, options) => {
+  options = options || {};
+  detail = detail === null || detail === undefined ? {} : detail;
+  const event = new Event(type, {
+    bubbles: options.bubbles === undefined ? true : options.bubbles,
+    cancelable: Boolean(options.cancelable),
+    composed: options.composed === undefined ? true : options.composed
+  });
+  event.detail = detail;
+  node.dispatchEvent(event);
+  return event;
+};
+
+const locale = {
+  da: {
+    optionName: 'Navn (valgfrit)',
+    optionEntity: 'Enhed (påkrævet)',
+    optionShowCurrent: 'Vis nuværende status',
+    optionShowDetails: 'Vis detaljer',
+    optionShowGraph: 'Vis graf',
+    optionShowInfo: 'Vis information'
+  },
+  de: {
+    optionName: 'Name (optional)',
+    optionEntity: 'Entity (Erforderlich)',
+    optionShowCurrent: 'Aktuellen Status anzeigen',
+    optionShowDetails: 'Details anzeigen',
+    optionShowGraph: 'Grafik anzeigen',
+    optionShowInfo: 'Informationen anzeigen'
+  },
+  en: {
+    optionName: 'Name (Optional)',
+    optionEntity: 'Entity (Required)',
+    optionShowCurrent: 'Show Current State',
+    optionShowDetails: 'Show Details',
+    optionShowGraph: 'Show Graph',
+    optionShowInfo: 'Show Info'
+  },
+  es: {
+    optionName: 'Nombre (Opcional)',
+    optionEntity: 'Entidad (Necesario)',
+    optionShowCurrent: 'Mostrar Estado Actual',
+    optionShowDetails: 'Mostrar Detalles',
+    optionShowGraph: 'Mostrar Gráfico',
+    optionShowInfo: 'Mostrar Información'
+  },
+  fr: {
+    optionName: 'Nom (Facultatif)',
+    optionEntity: 'Entity (Required)',
+    optionShowCurrent: "Afficher l'état actuel",
+    optionShowDetails: 'Afficher les détails',
+    optionShowGraph: 'Afficher le graphique',
+    optionShowInfo: 'Afficher les informations'
+  },
+  nl: {
+    optionName: 'Naam (optioneel)',
+    optionEntity: 'Entiteit (vereist)',
+    optionShowCurrent: 'Toon huidige status',
+    optionShowDetails: 'Details weergeven',
+    optionShowGraph: 'Show Graph',
+    optionShowInfo: 'Informatie weergeven'
+  },
+  ru: {
+    optionName: 'Имя (необязательно)',
+    optionEntity: 'Entity (обязательно)',
+    optionShowCurrent: 'Показать текущий статус',
+    optionShowDetails: 'Показать детали',
+    optionShowGraph: 'Показать график',
+    optionShowInfo: 'Показать информацию'
+  },
+  sv: {
+    optionName: 'Namn (valfritt)',
+    optionEntity: 'Enhet (obligatoriskt)',
+    optionShowCurrent: 'Visa aktuell status',
+    optionShowDetails: 'Visa detaljer',
+    optionShowGraph: 'Visa graf',
+    optionShowInfo: 'Visa information'
+  }
+};
+
+const LitElement =
+  window.LitElement || Object.getPrototypeOf(customElements.get('home-assistant') || customElements.get('hui-view'));
+const { html, css } = LitElement.prototype;
+
+export class PVPCHourlyPricingCardEditor extends LitElement {
+  setConfig(config) {
+    this._config = { ...config };
+  }
+
+  static get properties() {
+    return { hass: {}, _config: {} };
+  }
+
+  get _entity() {
+    return this._config.entity || '';
+  }
+
+  get _name() {
+    return this._config.name || '';
+  }
+
+  get _current() {
+    return this._config.current !== false;
+  }
+
+  get _details() {
+    return this._config.details !== false;
+  }
+
+  get _graph() {
+    return this._config.graph !== false;
+  }
+
+  get _info() {
+    return this._config.info !== false;
+  }
+
+  render() {
+    if (!this.hass) {
+      return html``;
+    }
+
+    this.lang = this.hass.selectedLanguage || this.hass.language;
+
+    const entities = Object.keys(this.hass.states).filter((eid) =>
+      Object.keys(this.hass.states[eid].attributes).some((aid) => aid == 'min_price_at')
+    );
+
+    return html`
+      <div class="card-config">
+        <div class="side-by-side">
+          <paper-input
+            label="${this.ll('optionName')}"
+            .value="${this._name}"
+            .configValue="${'name'}"
+            @value-changed="${this._valueChanged}"
+          >
+          </paper-input>
+        </div>
+        <div class="side-by-side">
+          <paper-dropdown-menu
+            label="${this.ll('optionEntity')}"
+            @value-changed="${this._valueChanged}"
+            .configValue="${'entity'}"
+          >
+            <paper-listbox slot="dropdown-content" .selected="${entities.indexOf(this._entity)}">
+              ${entities.map((entity) => {
+                return html` <paper-item>${entity}</paper-item> `;
+              })}
+            </paper-listbox>
+          </paper-dropdown-menu>
+        </div>
+        <div class="side-by-side">
+          <div>
+            <ha-switch
+              .checked=${this._current}
+              .configValue="${'current'}"
+              @change="${this._valueChanged}"
+            ></ha-switch>
+            <label class="mdc-label">${this.ll('optionShowCurrent')}</label>
+          </div>
+          <div>
+            <ha-switch
+              .checked=${this._details}
+              .configValue="${'details'}"
+              @change="${this._valueChanged}"
+            ></ha-switch>
+            <label class="mdc-label">${this.ll('optionShowDetails')}</label>
+          </div>
+        </div>
+        <div class="side-by-side">
+          <div>
+            <ha-switch .checked=${this._graph} .configValue="${'graph'}" @change="${this._valueChanged}"></ha-switch>
+            <label class="mdc-label">${this.ll('optionShowGraph')}</label>
+          </div>
+          <div>
+            <ha-switch .checked=${this._info} .configValue="${'info'}" @change="${this._valueChanged}"></ha-switch>
+            <label class="mdc-label">${this.ll('optionShowInfo')}</label>
+          </div>
+        </div>
+      </div>
+    `;
+  }
+
+  _valueChanged(ev) {
+    if (!this._config || !this.hass) {
+      return;
+    }
+
+    const target = ev.target;
+    if (this[`_${target.configValue}`] === target.value) {
+      return;
+    }
+
+    if (target.configValue) {
+      if (target.value === '') {
+        delete this._config[target.configValue];
+      } else {
+        this._config = {
+          ...this._config,
+          [target.configValue]: target.checked !== undefined ? target.checked : target.value
+        };
+      }
+    }
+
+    fireEvent(this, 'config-changed', { config: this._config });
+  }
+
+  ll(str) {
+    if (locale[this.lang] === undefined) return locale.en[str];
+    return locale[this.lang][str];
+  }
+
+  static get styles() {
+    return css`
+      ha-switch {
+        padding-top: 16px;
+      }
+      .mdc-label {
+        margin-left: 12px;
+        vertical-align: text-bottom;
+      }
+      .side-by-side {
+        display: flex;
+      }
+      .side-by-side > * {
+        flex: 1;
+        padding-right: 4px;
+      }
+    `;
+  }
+}
+
+customElements.define('pvpc-hourly-pricing-card-editor', PVPCHourlyPricingCardEditor);
+
+window.customCards = window.customCards || [];
+window.customCards.push({
+  type: 'pvpc-hourly-pricing-card',
+  name: 'PVPC Hourly Pricing',
+  preview: true,
+  description: 'The PVPC Hourly Pricing card allows you to display propertly the PVPC Hourly Pricing entity.'
+});