diff --git a/README.md b/README.md
index 053cf18..d69d496 100644
--- a/README.md
+++ b/README.md
@@ -32,3 +32,5 @@ views:
`hide_control: true` - Remove toggle
`break_slider: true` - Put slider on separate row
+
+`hide_when_off: true` - Hide the slider when the light is off
diff --git a/slider-entity-row.js b/slider-entity-row.js
index 4f5bd29..e73f310 100644
--- a/slider-entity-row.js
+++ b/slider-entity-row.js
@@ -1,5 +1,8 @@
class SliderEntityRow extends Polymer.Element {
static get template() {
+ let slider = Polymer.html`
+
+ `
return Polymer.html`
-
-
+
+ ${slider}
-
+
`
@@ -32,30 +35,14 @@ class SliderEntityRow extends Polymer.Element {
return {
_hass: Object,
_config: Object,
- hideControl: {
- type: Boolean,
- value: false,
- },
- breakSlider: {
- type: Boolean,
- value: false,
- },
- stateObj: {
- type: Object,
- value: null,
- },
- min: {
- type: Number,
- value: 0,
- },
- max: {
- type: Number,
- value: 255,
- },
- attribute: {
- type: String,
- value: 'brightness',
- },
+ hideControl: { type: Boolean, value: false },
+ breakSlider: { type: Boolean, value: false },
+ hideWhenOff: { type: Boolean, value: false },
+ isOn: { type: Boolean },
+ stateObj: { type: Object, value: null },
+ min: { type: Number, value: 0 },
+ max: { type: Number, value: 255 },
+ attribute: { type: String, value: 'brightness' },
value: Number,
};
}
@@ -67,16 +54,34 @@ class SliderEntityRow extends Polymer.Element {
this.hideControl = true;
if('break_slider' in config && config.break_slider)
this.breakSlider = true;
+ if('hide_when_off' in config && config.hide_when_off)
+ this.hideWhenOff = true;
+ }
+
+ updateSliders()
+ {
+ this.showTop = false;
+ this.showBottom = false;
+ if(!(this.hideWhenOff && !this.isOn)) {
+ if(this.breakSlider)
+ this.showBottom = true;
+ else
+ this.showTop = true;
+ }
}
set hass(hass) {
this._hass = hass;
this.stateObj = this._config.entity in hass.states ? hass.states[this._config.entity] : null;
if(this.stateObj) {
- if(this.stateObj.state === 'on')
+ if(this.stateObj.state === 'on') {
this.value = this.stateObj.attributes[this.attribute];
- else
+ this.isOn = true;
+ } else {
this.value = this.min;
+ this.isOn = false;
+ }
+ this.updateSliders();
}
}