1
mirror of https://github.com/home-assistant/frontend synced 2024-09-28 00:43:28 +02:00
ha-frontend/src/state-summary/state-card-configurator.js
Steve Repsher 1b922e0065
Add more alternative text to various images (#14932)
* Add alt text for cast launcher images

* Hide icon with supervisor form field label

* Use attribute for iframe title for ingress view

* Hide some decorative ZWave/ZHA icons

* Hide image preload in state card configurator

* Use title for alt text  on image media

* Hide media art as decorative

* Do not allow empty string for image media
2023-01-22 22:47:12 -05:00

70 lines
1.8 KiB
JavaScript

import "@material/mwc-button";
import "@polymer/iron-flex-layout/iron-flex-layout-classes";
import { html } from "@polymer/polymer/lib/utils/html-tag";
/* eslint-plugin-disable lit */
import { PolymerElement } from "@polymer/polymer/polymer-element";
import { computeStateDisplay } from "../common/entity/compute_state_display";
import "../components/entity/state-info";
import LocalizeMixin from "../mixins/localize-mixin";
/*
* @appliesMixin LocalizeMixin
*/
class StateCardConfigurator extends LocalizeMixin(PolymerElement) {
static get template() {
return html`
<style include="iron-flex iron-flex-alignment"></style>
<style>
mwc-button {
top: 3px;
height: 37px;
margin-right: -0.57em;
}
</style>
<div class="horizontal justified layout">
${this.stateInfoTemplate}
<mwc-button hidden$="[[inDialog]]"
>[[_localizeState(stateObj)]]</mwc-button
>
</div>
<!-- pre load the image so the dialog is rendered the proper size -->
<template is="dom-if" if="[[stateObj.attributes.description_image]]">
<img hidden="" alt="" src="[[stateObj.attributes.description_image]]" />
</template>
`;
}
static get stateInfoTemplate() {
return html`
<state-info
hass="[[hass]]"
state-obj="[[stateObj]]"
in-dialog="[[inDialog]]"
></state-info>
`;
}
static get properties() {
return {
hass: Object,
stateObj: Object,
inDialog: {
type: Boolean,
value: false,
},
};
}
_localizeState(stateObj) {
return computeStateDisplay(
this.hass.localize,
stateObj,
this.hass.locale,
this.hass.entities
);
}
}
customElements.define("state-card-configurator", StateCardConfigurator);