class SliderEntityRowSlider extends Polymer.Element { static get template() { return Polymer.html` `; } ready() { super.ready(); this.addEventListener('click', ev => ev.stopPropagation()); } valueChanged(ev) { const value = parseInt(this.value, 10); const param = {entity_id: this.stateObj.entity_id }; if(Number.isNaN(value)) return; if(value === 0) { this.hass.callService('light', 'turn_off', param); } else { param['brightness'] = value; this.hass.callService('light', 'turn_on', param); } } } customElements.define('slider-entity-row-slider', SliderEntityRowSlider); class SliderEntityRow extends HTMLElement { static get template() { console.log("Template"); } constructor() { super(); this.attachShadow({mode:'open'}); this.base = document.createElement('hui-generic-entity-row'); this.slider = document.createElement('slider-entity-row-slider'); this.toggle = document.createElement('ha-entity-toggle'); this.base.appendChild(this.slider); this.base.appendChild(this.toggle); this.shadowRoot.appendChild(this.base); } setConfig(config) { this.base.config = config; this.entity = config.entity; console.log(this.base); } set hass(hass) { this.base.hass = hass; this.toggle.hass = hass; this.slider.hass = hass; let stateObj = hass.states[this.entity]; this.toggle.stateObj = stateObj; this.slider.stateObj = stateObj; this.slider.value = this.isOn(stateObj) ? stateObj.attributes['brightness']: 0; } isOn(stateObj) { return stateObj && stateObj.state === 'on'; } } customElements.define('slider-entity-row', SliderEntityRow);