diff --git a/src/common/const.js b/src/common/const.js index f53713d85f..ddd57cda75 100644 --- a/src/common/const.js +++ b/src/common/const.js @@ -22,6 +22,36 @@ export const DOMAINS_WITH_CARD = [ 'weblink', ]; +/** Domains with separate more info dialog. */ +export const DOMAINS_WITH_MORE_INFO = [ + 'alarm_control_panel', + 'automation', + 'camera', + 'climate', + 'configurator', + 'cover', + 'fan', + 'group', + 'history_graph', + 'input_datetime', + 'light', + 'lock', + 'media_player', + 'script', + 'sun', + 'updater', + 'vacuum', + 'weather' +]; + +/** Domains that show no more info dialog. */ +export const DOMAINS_HIDE_MORE_INFO = [ + 'input_number', + 'input_select', + 'input_text', + 'scene' +]; + /** Domains that should have the history hidden in the more info dialog. */ export const DOMAINS_MORE_INFO_NO_HISTORY = [ 'camera', diff --git a/src/common/entity/state_more_info_type.js b/src/common/entity/state_more_info_type.js index 223b098f2d..3748ded1d4 100644 --- a/src/common/entity/state_more_info_type.js +++ b/src/common/entity/state_more_info_type.js @@ -1,14 +1,5 @@ import computeStateDomain from './compute_state_domain.js'; - -const DOMAINS_WITH_MORE_INFO = [ - 'alarm_control_panel', 'automation', 'camera', 'climate', 'configurator', - 'cover', 'fan', 'group', 'history_graph', 'light', 'lock', 'media_player', 'script', - 'sun', 'updater', 'vacuum', 'input_datetime', 'weather' -]; - -const HIDE_MORE_INFO = [ - 'input_select', 'scene', 'input_number', 'input_text' -]; +import { DOMAINS_HIDE_MORE_INFO, DOMAINS_WITH_MORE_INFO } from '../const.js'; export default function stateMoreInfoType(stateObj) { const domain = computeStateDomain(stateObj); @@ -16,7 +7,7 @@ export default function stateMoreInfoType(stateObj) { if (DOMAINS_WITH_MORE_INFO.includes(domain)) { return domain; } - if (HIDE_MORE_INFO.includes(domain)) { + if (DOMAINS_HIDE_MORE_INFO.includes(domain)) { return 'hidden'; } return 'default'; diff --git a/src/panels/experimental-ui/hui-entities-card.js b/src/panels/experimental-ui/hui-entities-card.js index 25b7bace56..d5e3f8a862 100644 --- a/src/panels/experimental-ui/hui-entities-card.js +++ b/src/panels/experimental-ui/hui-entities-card.js @@ -3,13 +3,20 @@ import { html } from '@polymer/polymer/lib/utils/html-tag.js'; import { PolymerElement } from '@polymer/polymer/polymer-element.js'; import stateCardType from '../../common/entity/state_card_type.js'; +import computeDomain from '../../common/entity/compute_domain.js'; +import { DOMAINS_HIDE_MORE_INFO } from '../../common/const.js'; import '../../components/ha-card.js'; // just importing this now as shortcut to import correct state-card-* import '../../state-summary/state-card-content.js'; -class HuiEntitiesCard extends PolymerElement { +import EventsMixin from '../../mixins/events-mixin.js'; + +/* + * @appliesMixin EventsMixin + */ +class HuiEntitiesCard extends EventsMixin(PolymerElement) { static get template() { return html` @@ -82,6 +92,10 @@ class HuiEntitiesCard extends PolymerElement { const stateObj = this.hass.states[entityId]; const tag = stateObj ? `state-card-${stateCardType(this.hass, stateObj)}` : 'state-card-display'; const element = document.createElement(tag); + if (!DOMAINS_HIDE_MORE_INFO.includes(computeDomain(entityId))) { + element.classList.add('state-card-dialog'); + element.addEventListener('click', () => this.fire('hass-more-info', { entityId })); + } element.stateObj = stateObj; element.hass = this.hass; this._elements.push({ entityId, element }); @@ -98,4 +112,5 @@ class HuiEntitiesCard extends PolymerElement { } } } + customElements.define('hui-entities-card', HuiEntitiesCard);