mirror of
https://github.com/home-assistant/frontend.git
synced 2025-07-21 16:26:43 +00:00
picture glance: better handle if no title (#1474)
* Better handle if no title * Simplify code * Arrays in ifs * Remove unused method * Always render the middle div * Always show both entity divs
This commit is contained in:
parent
ec54036f1e
commit
61d3d446f4
@ -60,12 +60,12 @@ class DemoPicGlance extends PolymerElement {
|
|||||||
return html`
|
return html`
|
||||||
<style>
|
<style>
|
||||||
#root {
|
#root {
|
||||||
|
padding: 10px;
|
||||||
}
|
}
|
||||||
hui-picture-glance-card {
|
hui-picture-glance-card {
|
||||||
width: 400px;
|
width: 400px;
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
margin-left: 20px;
|
margin: 10px;
|
||||||
margin-top: 20px;
|
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
<div id='root'>
|
<div id='root'>
|
||||||
|
@ -83,10 +83,11 @@ class HuiPictureGlanceCard extends NavigateMixin(LocalizeMixin(EventsMixin(Polym
|
|||||||
entity="[[_config.entity]]"
|
entity="[[_config.entity]]"
|
||||||
></hui-image>
|
></hui-image>
|
||||||
<div class="box">
|
<div class="box">
|
||||||
|
<template is="dom-if" if="[[_config.title]]">
|
||||||
<div class="title">[[_config.title]]</div>
|
<div class="title">[[_config.title]]</div>
|
||||||
|
</template>
|
||||||
<div>
|
<div>
|
||||||
<template is="dom-repeat" items="[[_entitiesDialog]]">
|
<template is="dom-repeat" items="[[_computeVisible(_entitiesDialog, hass.states)]]">
|
||||||
<template is="dom-if" if="[[_showEntity(item.entity, hass.states)]]">
|
|
||||||
<paper-icon-button
|
<paper-icon-button
|
||||||
on-click="_openDialog"
|
on-click="_openDialog"
|
||||||
class$="[[_computeButtonClass(item.entity, hass.states)]]"
|
class$="[[_computeButtonClass(item.entity, hass.states)]]"
|
||||||
@ -94,11 +95,9 @@ class HuiPictureGlanceCard extends NavigateMixin(LocalizeMixin(EventsMixin(Polym
|
|||||||
title="[[_computeTooltip(item.entity, hass.states)]]"
|
title="[[_computeTooltip(item.entity, hass.states)]]"
|
||||||
></paper-icon-button>
|
></paper-icon-button>
|
||||||
</template>
|
</template>
|
||||||
</template>
|
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<template is="dom-repeat" items="[[_entitiesToggle]]">
|
<template is="dom-repeat" items="[[_computeVisible(_entitiesToggle, hass.states)]]">
|
||||||
<template is="dom-if" if="[[_showEntity(item.entity, hass.states)]]">
|
|
||||||
<paper-icon-button
|
<paper-icon-button
|
||||||
on-click="_callService"
|
on-click="_callService"
|
||||||
class$="[[_computeButtonClass(item.entity, hass.states)]]"
|
class$="[[_computeButtonClass(item.entity, hass.states)]]"
|
||||||
@ -106,7 +105,6 @@ class HuiPictureGlanceCard extends NavigateMixin(LocalizeMixin(EventsMixin(Polym
|
|||||||
title="[[_computeTooltip(item.entity, hass.states)]]"
|
title="[[_computeTooltip(item.entity, hass.states)]]"
|
||||||
></paper-icon-button>
|
></paper-icon-button>
|
||||||
</template>
|
</template>
|
||||||
</template>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</ha-card>
|
</ha-card>
|
||||||
@ -118,7 +116,7 @@ class HuiPictureGlanceCard extends NavigateMixin(LocalizeMixin(EventsMixin(Polym
|
|||||||
hass: Object,
|
hass: Object,
|
||||||
_config: Object,
|
_config: Object,
|
||||||
_entitiesDialog: Array,
|
_entitiesDialog: Array,
|
||||||
_entitiesToggle: Array
|
_entitiesToggle: Array,
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -150,8 +148,8 @@ class HuiPictureGlanceCard extends NavigateMixin(LocalizeMixin(EventsMixin(Polym
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
_showEntity(entityId, states) {
|
_computeVisible(collection, states) {
|
||||||
return entityId in states;
|
return collection.filter(el => el.entity in states);
|
||||||
}
|
}
|
||||||
|
|
||||||
_computeIcon(entityId, states) {
|
_computeIcon(entityId, states) {
|
||||||
|
Loading…
x
Reference in New Issue
Block a user