iobroker.lovelace
Version:
With this adapter you can build visualization for ioBroker with Home Assistant Lovelace UI
526 lines (465 loc) • 17.3 kB
JavaScript
/*! For license information please see chunk.0d561d28f613ef2bd5fa.js.LICENSE.txt */
(self.webpackChunkhome_assistant_frontend=self.webpackChunkhome_assistant_frontend||[]).push([[681],{21157:(e,t,i)=>{"use strict";i(43437);const l=i(50856).d`
/* Most common used flex styles*/
<dom-module id="iron-flex">
<template>
<style>
.layout.horizontal,
.layout.vertical {
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
}
.layout.inline {
display: -ms-inline-flexbox;
display: -webkit-inline-flex;
display: inline-flex;
}
.layout.horizontal {
-ms-flex-direction: row;
-webkit-flex-direction: row;
flex-direction: row;
}
.layout.vertical {
-ms-flex-direction: column;
-webkit-flex-direction: column;
flex-direction: column;
}
.layout.wrap {
-ms-flex-wrap: wrap;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
}
.layout.no-wrap {
-ms-flex-wrap: nowrap;
-webkit-flex-wrap: nowrap;
flex-wrap: nowrap;
}
.layout.center,
.layout.center-center {
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
}
.layout.center-justified,
.layout.center-center {
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
}
.flex {
-ms-flex: 1 1 0.000000001px;
-webkit-flex: 1;
flex: 1;
-webkit-flex-basis: 0.000000001px;
flex-basis: 0.000000001px;
}
.flex-auto {
-ms-flex: 1 1 auto;
-webkit-flex: 1 1 auto;
flex: 1 1 auto;
}
.flex-none {
-ms-flex: none;
-webkit-flex: none;
flex: none;
}
</style>
</template>
</dom-module>
/* Basic flexbox reverse styles */
<dom-module id="iron-flex-reverse">
<template>
<style>
.layout.horizontal-reverse,
.layout.vertical-reverse {
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
}
.layout.horizontal-reverse {
-ms-flex-direction: row-reverse;
-webkit-flex-direction: row-reverse;
flex-direction: row-reverse;
}
.layout.vertical-reverse {
-ms-flex-direction: column-reverse;
-webkit-flex-direction: column-reverse;
flex-direction: column-reverse;
}
.layout.wrap-reverse {
-ms-flex-wrap: wrap-reverse;
-webkit-flex-wrap: wrap-reverse;
flex-wrap: wrap-reverse;
}
</style>
</template>
</dom-module>
/* Flexbox alignment */
<dom-module id="iron-flex-alignment">
<template>
<style>
/**
* Alignment in cross axis.
*/
.layout.start {
-ms-flex-align: start;
-webkit-align-items: flex-start;
align-items: flex-start;
}
.layout.center,
.layout.center-center {
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
}
.layout.end {
-ms-flex-align: end;
-webkit-align-items: flex-end;
align-items: flex-end;
}
.layout.baseline {
-ms-flex-align: baseline;
-webkit-align-items: baseline;
align-items: baseline;
}
/**
* Alignment in main axis.
*/
.layout.start-justified {
-ms-flex-pack: start;
-webkit-justify-content: flex-start;
justify-content: flex-start;
}
.layout.center-justified,
.layout.center-center {
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
}
.layout.end-justified {
-ms-flex-pack: end;
-webkit-justify-content: flex-end;
justify-content: flex-end;
}
.layout.around-justified {
-ms-flex-pack: distribute;
-webkit-justify-content: space-around;
justify-content: space-around;
}
.layout.justified {
-ms-flex-pack: justify;
-webkit-justify-content: space-between;
justify-content: space-between;
}
/**
* Self alignment.
*/
.self-start {
-ms-align-self: flex-start;
-webkit-align-self: flex-start;
align-self: flex-start;
}
.self-center {
-ms-align-self: center;
-webkit-align-self: center;
align-self: center;
}
.self-end {
-ms-align-self: flex-end;
-webkit-align-self: flex-end;
align-self: flex-end;
}
.self-stretch {
-ms-align-self: stretch;
-webkit-align-self: stretch;
align-self: stretch;
}
.self-baseline {
-ms-align-self: baseline;
-webkit-align-self: baseline;
align-self: baseline;
}
/**
* multi-line alignment in main axis.
*/
.layout.start-aligned {
-ms-flex-line-pack: start; /* IE10 */
-ms-align-content: flex-start;
-webkit-align-content: flex-start;
align-content: flex-start;
}
.layout.end-aligned {
-ms-flex-line-pack: end; /* IE10 */
-ms-align-content: flex-end;
-webkit-align-content: flex-end;
align-content: flex-end;
}
.layout.center-aligned {
-ms-flex-line-pack: center; /* IE10 */
-ms-align-content: center;
-webkit-align-content: center;
align-content: center;
}
.layout.between-aligned {
-ms-flex-line-pack: justify; /* IE10 */
-ms-align-content: space-between;
-webkit-align-content: space-between;
align-content: space-between;
}
.layout.around-aligned {
-ms-flex-line-pack: distribute; /* IE10 */
-ms-align-content: space-around;
-webkit-align-content: space-around;
align-content: space-around;
}
</style>
</template>
</dom-module>
/* Non-flexbox positioning helper styles */
<dom-module id="iron-flex-factors">
<template>
<style>
.flex,
.flex-1 {
-ms-flex: 1 1 0.000000001px;
-webkit-flex: 1;
flex: 1;
-webkit-flex-basis: 0.000000001px;
flex-basis: 0.000000001px;
}
.flex-2 {
-ms-flex: 2;
-webkit-flex: 2;
flex: 2;
}
.flex-3 {
-ms-flex: 3;
-webkit-flex: 3;
flex: 3;
}
.flex-4 {
-ms-flex: 4;
-webkit-flex: 4;
flex: 4;
}
.flex-5 {
-ms-flex: 5;
-webkit-flex: 5;
flex: 5;
}
.flex-6 {
-ms-flex: 6;
-webkit-flex: 6;
flex: 6;
}
.flex-7 {
-ms-flex: 7;
-webkit-flex: 7;
flex: 7;
}
.flex-8 {
-ms-flex: 8;
-webkit-flex: 8;
flex: 8;
}
.flex-9 {
-ms-flex: 9;
-webkit-flex: 9;
flex: 9;
}
.flex-10 {
-ms-flex: 10;
-webkit-flex: 10;
flex: 10;
}
.flex-11 {
-ms-flex: 11;
-webkit-flex: 11;
flex: 11;
}
.flex-12 {
-ms-flex: 12;
-webkit-flex: 12;
flex: 12;
}
</style>
</template>
</dom-module>
<dom-module id="iron-positioning">
<template>
<style>
.block {
display: block;
}
[hidden] {
display: none ;
}
.invisible {
visibility: hidden ;
}
.relative {
position: relative;
}
.fit {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
}
body.fullbleed {
margin: 0;
height: 100vh;
}
.scroll {
-webkit-overflow-scrolling: touch;
overflow: auto;
}
/* fixed position */
.fixed-bottom,
.fixed-left,
.fixed-right,
.fixed-top {
position: fixed;
}
.fixed-top {
top: 0;
left: 0;
right: 0;
}
.fixed-right {
top: 0;
right: 0;
bottom: 0;
}
.fixed-bottom {
right: 0;
bottom: 0;
left: 0;
}
.fixed-left {
top: 0;
bottom: 0;
left: 0;
}
</style>
</template>
</dom-module>
`;l.setAttribute("style","display: none;"),document.head.appendChild(l.content)},24381:(e,t,i)=>{"use strict";i.d(t,{Q:()=>l});const l=(e,t)=>e?t.map((t=>t in e.attributes?"has-"+t:"")).filter((e=>""!==e)).join(" "):""},9146:(e,t,i)=>{"use strict";i.d(t,{d:()=>s});var l=i(40095);const s=(e,t)=>e&&e.attributes.supported_features?Object.keys(t).map((i=>(0,l.e)(e,Number(i))?t[i]:"")).filter((e=>""!==e)).join(" "):""},37466:(e,t,i)=>{"use strict";i(21157),i(10983);var l=i(50856),s=i(28426),n=i(56007),o=i(44817);class a extends s.H3{static get template(){return l.d`
<style include="iron-flex"></style>
<style>
:host {
white-space: nowrap;
}
[invisible] {
visibility: hidden ;
}
</style>
<ha-icon-button
aria-label="Open cover tilt"
icon="hass:arrow-top-right"
on-click="onOpenTiltTap"
title="Open tilt"
invisible$="[[!entityObj.supportsOpenTilt]]"
disabled="[[computeOpenDisabled(stateObj, entityObj)]]"
></ha-icon-button>
<ha-icon-button
aria-label="Stop cover from moving"
icon="hass:stop"
on-click="onStopTiltTap"
invisible$="[[!entityObj.supportsStopTilt]]"
disabled="[[computeStopDisabled(stateObj)]]"
title="Stop tilt"
></ha-icon-button>
<ha-icon-button
aria-label="Close cover tilt"
icon="hass:arrow-bottom-left"
on-click="onCloseTiltTap"
title="Close tilt"
invisible$="[[!entityObj.supportsCloseTilt]]"
disabled="[[computeClosedDisabled(stateObj, entityObj)]]"
></ha-icon-button>
`}static get properties(){return{hass:{type:Object},stateObj:{type:Object},entityObj:{type:Object,computed:"computeEntityObj(hass, stateObj)"}}}computeEntityObj(e,t){return new o.ZP(e,t)}computeStopDisabled(e){return e.state===n.nZ}computeOpenDisabled(e,t){if(e.state===n.nZ)return!0;const i=!0===e.attributes.assumed_state;return t.isFullyOpenTilt&&!i}computeClosedDisabled(e,t){if(e.state===n.nZ)return!0;const i=!0===e.attributes.assumed_state;return t.isFullyClosedTilt&&!i}onOpenTiltTap(e){e.stopPropagation(),this.entityObj.openCoverTilt()}onCloseTiltTap(e){e.stopPropagation(),this.entityObj.closeCoverTilt()}onStopTiltTap(e){e.stopPropagation(),this.entityObj.stopCoverTilt()}}customElements.define("ha-cover-tilt-controls",a)},73139:(e,t,i)=>{"use strict";var l=i(50856),s=i(28426);i(16509),i(46998);class n extends s.H3{static get template(){return l.d`
<style>
:host {
display: block;
border-radius: 4px;
}
.title {
margin-bottom: 8px;
color: var(--primary-text-color);
}
.slider-container {
display: flex;
}
ha-icon {
margin-top: 4px;
color: var(--secondary-text-color);
}
ha-slider {
flex-grow: 1;
background-image: var(--ha-slider-background);
}
</style>
<div class="title">[[caption]]</div>
<div class="extra-container"><slot name="extra"></slot></div>
<div class="slider-container">
<ha-icon icon="[[icon]]" hidden$="[[!icon]]"></ha-icon>
<ha-slider
min="[[min]]"
max="[[max]]"
step="[[step]]"
pin="[[pin]]"
disabled="[[disabled]]"
value="{{value}}"
></ha-slider>
</div>
`}static get properties(){return{caption:String,disabled:Boolean,min:Number,max:Number,pin:Boolean,step:Number,extra:{type:Boolean,value:!1},ignoreBarTouch:{type:Boolean,value:!0},icon:{type:String,value:""},value:{type:Number,notify:!0}}}}customElements.define("ha-labeled-slider",n)},30681:(e,t,i)=>{"use strict";i.r(t);i(21157);var l=i(50856),s=i(28426),n=i(24381),o=i(9146),a=(i(37466),i(73139),i(1265)),r=i(44817);const c={4:"has-set_position",128:"has-set_tilt_position"};class p extends((0,a.Z)(s.H3)){static get template(){return l.d`
<style include="iron-flex"></style>
<style>
.current_position,
.tilt {
max-height: 0px;
overflow: hidden;
}
.has-set_position .current_position,
.has-current_position .current_position,
.has-set_tilt_position .tilt,
.has-current_tilt_position .tilt {
max-height: 208px;
}
[invisible] {
visibility: hidden ;
}
</style>
<div class$="[[computeClassNames(stateObj)]]">
<div class="current_position">
<ha-labeled-slider
caption="[[localize('ui.card.cover.position')]]"
pin=""
value="{{coverPositionSliderValue}}"
disabled="[[!entityObj.supportsSetPosition]]"
on-change="coverPositionSliderChanged"
></ha-labeled-slider>
</div>
<div class="tilt">
<ha-labeled-slider
caption="[[localize('ui.card.cover.tilt_position')]]"
pin=""
extra=""
value="{{coverTiltPositionSliderValue}}"
disabled="[[!entityObj.supportsSetTiltPosition]]"
on-change="coverTiltPositionSliderChanged"
>
<ha-cover-tilt-controls
slot="extra"
hidden$="[[entityObj.isTiltOnly]]"
hass="[[hass]]"
state-obj="[[stateObj]]"
></ha-cover-tilt-controls>
</ha-labeled-slider>
</div>
</div>
`}static get properties(){return{hass:Object,stateObj:{type:Object,observer:"stateObjChanged"},entityObj:{type:Object,computed:"computeEntityObj(hass, stateObj)"},coverPositionSliderValue:Number,coverTiltPositionSliderValue:Number}}computeEntityObj(e,t){return new r.ZP(e,t)}stateObjChanged(e){e&&this.setProperties({coverPositionSliderValue:e.attributes.current_position,coverTiltPositionSliderValue:e.attributes.current_tilt_position})}computeClassNames(e){return[(0,n.Q)(e,["current_position","current_tilt_position"]),(0,o.d)(e,c)].join(" ")}coverPositionSliderChanged(e){this.entityObj.setCoverPosition(e.target.value)}coverTiltPositionSliderChanged(e){this.entityObj.setCoverTiltPosition(e.target.value)}}customElements.define("more-info-cover",p)},44817:(e,t,i)=>{"use strict";i.d(t,{ZP:()=>s,pu:()=>n});var l=i(40095);class s{constructor(e,t){this.hass=e,this.stateObj=t,this._attr=t.attributes,this._feat=this._attr.supported_features}get isFullyOpen(){return void 0!==this._attr.current_position?100===this._attr.current_position:"open"===this.stateObj.state}get isFullyClosed(){return void 0!==this._attr.current_position?0===this._attr.current_position:"closed"===this.stateObj.state}get isFullyOpenTilt(){return 100===this._attr.current_tilt_position}get isFullyClosedTilt(){return 0===this._attr.current_tilt_position}get isOpening(){return"opening"===this.stateObj.state}get isClosing(){return"closing"===this.stateObj.state}get supportsOpen(){return(0,l.e)(this.stateObj,1)}get supportsClose(){return(0,l.e)(this.stateObj,2)}get supportsSetPosition(){return(0,l.e)(this.stateObj,4)}get supportsStop(){return(0,l.e)(this.stateObj,8)}get supportsOpenTilt(){return(0,l.e)(this.stateObj,16)}get supportsCloseTilt(){return(0,l.e)(this.stateObj,32)}get supportsStopTilt(){return(0,l.e)(this.stateObj,64)}get supportsSetTiltPosition(){return(0,l.e)(this.stateObj,128)}get isTiltOnly(){const e=this.supportsOpen||this.supportsClose||this.supportsStop;return(this.supportsOpenTilt||this.supportsCloseTilt||this.supportsStopTilt)&&!e}openCover(){this.callService("open_cover")}closeCover(){this.callService("close_cover")}stopCover(){this.callService("stop_cover")}openCoverTilt(){this.callService("open_cover_tilt")}closeCoverTilt(){this.callService("close_cover_tilt")}stopCoverTilt(){this.callService("stop_cover_tilt")}setCoverPosition(e){this.callService("set_cover_position",{position:e})}setCoverTiltPosition(e){this.callService("set_cover_tilt_position",{tilt_position:e})}callService(e,t={}){t.entity_id=this.stateObj.entity_id,this.hass.callService("cover",e,t)}}function n(e){const t=(e=>(0,l.e)(e,1))(e)||(e=>(0,l.e)(e,2))(e)||(e=>(0,l.e)(e,8))(e);return((e=>(0,l.e)(e,16))(e)||(e=>(0,l.e)(e,32))(e)||(e=>(0,l.e)(e,64))(e))&&!t}}}]);
//# sourceMappingURL=chunk.0d561d28f613ef2bd5fa.js.map