evlli/hass-core
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

frontend more-info-light: tweaks & cleanup

Browse source
This commit is contained in:
Paulus Schoutsen 2014-12-30 18:37:33 -08:00
parent fee51d604d
commit 85f5df55e9
1 changed files with 19 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

30
homeassistant/components/http/www_static/polymer/more-infos/more-info-light.html
View file

@ -14,26 +14,31 @@
.brightness paper-slider::shadow #sliderBar::shadow #activeProgress { .brightness paper-slider::shadow #sliderBar::shadow #activeProgress {
background-color: #039be5; background-color: #039be5;
} }
color-picker {
display: block;
width: 350px;
margin: 0 auto;
}
</style> </style>
<div> <div>
<div center horizontal layout class='brightness'> <div center horizontal layout class='brightness'>
<div>Brightness</div> <div>Brightness</div>
<paper-slider <paper-slider
max="255" flex max="255" flex id='brightness'
on-core-change="{{brightnessSliderChanged}}" on-core-change="{{brightnessSliderChanged}}">
value="{{brightnessValue}}">
</paper-slider> </paper-slider>
</div> </div>
<color-picker id="colorpicker" <color-picker id="colorpicker" width="350" height="200">
width="350" height="200" color="{{colorValue}}">
</color-picker> </color-picker>
</div> </div>
</template> </template>
<script> <script>
Polymer({ Polymer({
colorValue: 0, // on-change is unpredictable so using on-core-change this has side effect
brightnessValue: 0, // that it fires if changed by brightnessChanged(), thus an ignore boolean.
ignoreNextBrightnessEvent: false,
observe: { observe: {
'stateObj.attributes.brightness': 'brightnessChanged', 'stateObj.attributes.brightness': 'brightnessChanged',
@ -41,11 +46,9 @@ Polymer({
}, },
brightnessChanged: function(oldVal, newVal) { brightnessChanged: function(oldVal, newVal) {
this.brightnessValue = newVal; this.ignoreNextBrightnessEvent = true;
},
colorChanged: function(oldVal, newVal) { this.$.brightness.value = newVal;
console.log(newVal);
}, },
domReady: function() { domReady: function() {
@ -53,6 +56,11 @@ Polymer({
}, },
brightnessSliderChanged: function(ev, details, target) { brightnessSliderChanged: function(ev, details, target) {
if(this.ignoreNextBrightnessEvent) {
this.ignoreNextBrightnessEvent = false;
return;
}
var bri = parseInt(target.value); var bri = parseInt(target.value);
if(isNaN(bri)) return; if(isNaN(bri)) return;