Add support for assumed_state
This commit is contained in:
parent
f393db1bae
commit
f3399c2c3a
|
@ -1,16 +1,29 @@
|
|||
<link rel="import" href="../../../bower_components/polymer/polymer.html">
|
||||
<link rel="import" href="../../../bower_components/paper-toggle-button/paper-toggle-button.html">
|
||||
<link rel="import" href="../../../bower_components/paper-icon-button/paper-icon-button.html">
|
||||
|
||||
<dom-module id="ha-entity-toggle">
|
||||
<style>
|
||||
paper-icon-button {
|
||||
transition: color .5s;
|
||||
}
|
||||
paper-icon-button[state-active] {
|
||||
color: var(--default-primary-color);
|
||||
}
|
||||
paper-toggle-button {
|
||||
cursor: pointer;
|
||||
--paper-toggle-button-label-spacing: 0;
|
||||
}
|
||||
</style>
|
||||
<template>
|
||||
<paper-toggle-button class='self-center'
|
||||
checked="[[toggleChecked]]"
|
||||
on-change="toggleChanged"></paper-toggle-button>
|
||||
<template is='dom-if' if='[[stateObj.attributes.assumed_state]]'>
|
||||
<paper-icon-button icon="mdi:flash-off" on-tap="turnOff" state-active$='[[!isOn]]'></paper-icon-button>
|
||||
<paper-icon-button icon="mdi:flash" on-tap="turnOn" state-active$='[[isOn]]'></paper-icon-button>
|
||||
</template>
|
||||
<template is='dom-if' if='[[!stateObj.attributes.assumed_state]]'>
|
||||
<paper-toggle-button class='self-center'
|
||||
checked="[[toggleChecked]]"
|
||||
on-change="toggleChanged"></paper-toggle-button>
|
||||
</template>
|
||||
</template>
|
||||
</dom-module>
|
||||
|
|
|
@ -10,13 +10,18 @@ export default new Polymer({
|
|||
properties: {
|
||||
stateObj: {
|
||||
type: Object,
|
||||
observer: 'stateObjChanged',
|
||||
},
|
||||
|
||||
toggleChecked: {
|
||||
type: Boolean,
|
||||
value: false,
|
||||
},
|
||||
|
||||
isOn: {
|
||||
type: Boolean,
|
||||
computed: 'computeIsOn(stateObj)',
|
||||
observer: 'isOnChanged',
|
||||
},
|
||||
},
|
||||
|
||||
ready() {
|
||||
|
@ -25,34 +30,34 @@ export default new Polymer({
|
|||
|
||||
toggleChanged(ev) {
|
||||
const newVal = ev.target.checked;
|
||||
const curVal = this._checkToggle(this.stateObj);
|
||||
|
||||
if (newVal && !curVal) {
|
||||
if (newVal && !this.isOn) {
|
||||
this._call_service(true);
|
||||
} else if (!newVal && curVal) {
|
||||
} else if (!newVal && this.isOn) {
|
||||
this._call_service(false);
|
||||
}
|
||||
},
|
||||
|
||||
stateObjChanged(newVal) {
|
||||
if (newVal) {
|
||||
this.updateToggle(newVal);
|
||||
}
|
||||
},
|
||||
|
||||
updateToggle(stateObj) {
|
||||
this.toggleChecked = this._checkToggle(stateObj);
|
||||
isOnChanged(newVal) {
|
||||
this.toggleChecked = newVal;
|
||||
},
|
||||
|
||||
forceStateChange() {
|
||||
const newState = this._checkToggle(this.stateObj);
|
||||
if (this.toggleChecked === newState) {
|
||||
if (this.toggleChecked === this.isOn) {
|
||||
this.toggleChecked = !this.toggleChecked;
|
||||
}
|
||||
this.toggleChecked = newState;
|
||||
this.toggleChecked = this.isOn;
|
||||
},
|
||||
|
||||
_checkToggle(stateObj) {
|
||||
turnOn() {
|
||||
this._call_service(true);
|
||||
},
|
||||
|
||||
turnOff() {
|
||||
this._call_service(false);
|
||||
},
|
||||
|
||||
computeIsOn(stateObj) {
|
||||
return stateObj && stateObj.state !== 'off' &&
|
||||
stateObj.state !== 'unlocked' && stateObj.state !== 'closed';
|
||||
},
|
||||
|
@ -76,7 +81,11 @@ export default new Polymer({
|
|||
service = turnOn ? 'turn_on' : 'turn_off';
|
||||
}
|
||||
|
||||
serviceActions.callService(domain, service, { entity_id: this.stateObj.entityId })
|
||||
.then(() => this.forceStateChange());
|
||||
const call = serviceActions.callService(domain, service,
|
||||
{ entity_id: this.stateObj.entityId });
|
||||
|
||||
if (!this.stateObj.attributes.assumed_state) {
|
||||
call.then(() => this.forceStateChange());
|
||||
}
|
||||
},
|
||||
});
|
||||
|
|
|
@ -1,5 +1,4 @@
|
|||
<link rel="import" href="../../bower_components/polymer/polymer.html">
|
||||
<link rel="import" href="../../bower_components/paper-toggle-button/paper-toggle-button.html">
|
||||
|
||||
<link rel="import" href="../components/state-info.html">
|
||||
<link rel="import" href="../components/entity/ha-entity-toggle.html">
|
||||
|
|
|
@ -5,4 +5,10 @@ require('../components/entity/ha-entity-toggle');
|
|||
|
||||
export default new Polymer({
|
||||
is: 'state-card-toggle',
|
||||
|
||||
properties: {
|
||||
stateObj: {
|
||||
type: Object,
|
||||
},
|
||||
},
|
||||
});
|
||||
|
|
Loading…
Reference in New Issue