Improve light more info (#263)

* Improve light more info

* Lint
This commit is contained in:
Paulus Schoutsen 2017-04-19 09:07:10 -07:00 committed by GitHub
parent bbc9e0d071
commit 3fdba35986
3 changed files with 39 additions and 9 deletions

View File

@ -24,6 +24,10 @@
.slider-container {
margin-left: 24px;
}
paper-slider {
background-image: var(--ha-slider-background);
}
</style>
<div class='title'>[[caption]]</div>

View File

@ -23,6 +23,10 @@
transition: max-height .5s ease-in;
}
.color_temp {
--ha-slider-background: -webkit-linear-gradient(right, rgb(255, 160, 0) 0%, white 50%, rgb(166, 209, 255) 100%);
}
ha-color-picker {
display: block;
width: 250px;
@ -146,17 +150,25 @@ Polymer({
}
},
featureClassNames: {
1: 'has-brightness',
},
computeClassNames: function (stateObj) {
var classes = window.hassUtil.attributeClassNames(
stateObj, ['rgb_color', 'color_temp', 'white_value',
'effect_list']);
var BRIGHTNESS_SUPPORTED = 1;
// If brightness is supported - show the slider even if the attribute is
// missing (because the light is off).
if (stateObj && (stateObj.attributes.supported_features & BRIGHTNESS_SUPPORTED)) {
classes += ' has-brightness';
var classes = [
window.hassUtil.attributeClassNames(
stateObj, ['color_temp', 'white_value', 'effect_list']),
window.hassUtil.featureClassNames(stateObj, this.featureClassNames),
];
// Lights that do shades of white can still have an rgb color
// In that case we don't want the color picker to show.
if (stateObj.attributes.supported_features &&
(stateObj.attributes.supported_features & 16) !== 0 &&
stateObj.attributes.rgb_color) {
classes.push('has-rgb_color');
}
return classes;
return classes.join(' ');
},
effectChanged: function (effectIndex) {

View File

@ -46,6 +46,20 @@ window.hassUtil.attributeClassNames = function (stateObj, attributes) {
).join(' ');
};
// Expects featureClassNames to be an object mapping feature-bit -> className
window.hassUtil.featureClassNames = function (stateObj, featureClassNames) {
if (!stateObj || !stateObj.attributes.supported_features) return '';
var features = stateObj.attributes.supported_features;
return Object.keys(featureClassNames).map(
function (feature) {
return (features & feature) !== 0 ? featureClassNames[feature] : '';
}
).join(' ');
};
window.hassUtil.canToggleState = function (hass, stateObj) {
var domain = window.hassUtil.computeDomain(stateObj);
if (domain === 'group') {