mirror of
https://github.com/home-assistant/frontend.git
synced 2025-07-28 03:36:44 +00:00
Migrate light to use RGB instead of XY color
This commit is contained in:
parent
b04e285061
commit
5ea83557bb
@ -1,7 +1,5 @@
|
||||
import Polymer from '../../polymer';
|
||||
|
||||
import xyBriToRgb from '../../util/xybri-to-rgb';
|
||||
|
||||
require('./domain-icon');
|
||||
|
||||
export default new Polymer({
|
||||
@ -20,11 +18,8 @@ export default new Polymer({
|
||||
updateIconColor(newVal) {
|
||||
// for domain light, set color of icon to light color if available
|
||||
if (newVal.domain === 'light' && newVal.state === 'on' &&
|
||||
newVal.attributes.brightness && newVal.attributes.xy_color) {
|
||||
const rgb = xyBriToRgb(newVal.attributes.xy_color[0],
|
||||
newVal.attributes.xy_color[1],
|
||||
newVal.attributes.brightness);
|
||||
this.$.icon.style.color = 'rgb(' + rgb.map(Math.floor).join(',') + ')';
|
||||
newVal.attributes.rgb_color) {
|
||||
this.$.icon.style.color = 'rgb(' + newVal.attributes.rgb_color.join(',') + ')';
|
||||
} else {
|
||||
this.$.icon.style.color = null;
|
||||
}
|
||||
|
@ -1,7 +1,5 @@
|
||||
import Polymer from '../../polymer';
|
||||
|
||||
import xyBriToRgb from '../../util/xybri-to-rgb';
|
||||
|
||||
require('./ha-state-icon');
|
||||
|
||||
export default new Polymer({
|
||||
@ -20,11 +18,8 @@ export default new Polymer({
|
||||
updateIconColor(newVal) {
|
||||
// for domain light, set color of icon to light color if available
|
||||
if (newVal.domain === 'light' && newVal.state === 'on' &&
|
||||
newVal.attributes.brightness && newVal.attributes.xy_color) {
|
||||
const rgb = xyBriToRgb(newVal.attributes.xy_color[0],
|
||||
newVal.attributes.xy_color[1],
|
||||
newVal.attributes.brightness);
|
||||
this.$.icon.style.color = 'rgb(' + rgb.map(Math.floor).join(',') + ')';
|
||||
newVal.attributes.rgb_color) {
|
||||
this.$.icon.style.color = 'rgb(' + newVal.attributes.rgb_color.join(',') + ')';
|
||||
} else {
|
||||
this.$.icon.style.color = null;
|
||||
}
|
||||
|
@ -31,7 +31,7 @@
|
||||
max-height: 40px;
|
||||
}
|
||||
|
||||
.has-xy_color ha-color-picker {
|
||||
.has-rgb_color ha-color-picker {
|
||||
max-height: 500px;
|
||||
}
|
||||
</style>
|
||||
|
@ -5,7 +5,7 @@ import attributeClassNames from '../util/attribute-class-names';
|
||||
|
||||
require('../components/ha-color-picker');
|
||||
|
||||
const ATTRIBUTE_CLASSES = ['brightness', 'xy_color', 'color_temp'];
|
||||
const ATTRIBUTE_CLASSES = ['brightness', 'rgb_color', 'color_temp'];
|
||||
|
||||
export default new Polymer({
|
||||
is: 'more-info-light',
|
||||
|
@ -1,26 +0,0 @@
|
||||
// from http://stackoverflow.com/questions/22894498/philips-hue-convert-xy-from-api-to-hex-or-rgb
|
||||
/* eslint-disable id-length */
|
||||
export default function xyBriToRgb(x, y, bri) {
|
||||
const z = 1.0 - x - y;
|
||||
const Y = bri / 255.0; // Brightness of lamp
|
||||
const X = (Y / y) * x;
|
||||
const Z = (Y / y) * z;
|
||||
let r = X * 1.612 - Y * 0.203 - Z * 0.302;
|
||||
let g = -X * 0.509 + Y * 1.412 + Z * 0.066;
|
||||
let b = X * 0.026 - Y * 0.072 + Z * 0.962;
|
||||
r = r <= 0.0031308 ? 12.92 * r : (1.0 + 0.055) * Math.pow(r, (1.0 / 2.4)) - 0.055;
|
||||
g = g <= 0.0031308 ? 12.92 * g : (1.0 + 0.055) * Math.pow(g, (1.0 / 2.4)) - 0.055;
|
||||
b = b <= 0.0031308 ? 12.92 * b : (1.0 + 0.055) * Math.pow(b, (1.0 / 2.4)) - 0.055;
|
||||
const maxValue = Math.max(r, g, b);
|
||||
r /= maxValue;
|
||||
g /= maxValue;
|
||||
b /= maxValue;
|
||||
r = r * 255;
|
||||
if (r < 0) { r = 255; }
|
||||
g = g * 255;
|
||||
if (g < 0) { g = 255; }
|
||||
b = b * 255;
|
||||
if (b < 0) { b = 255; }
|
||||
return [r, g, b];
|
||||
}
|
||||
/* eslint-enable id-length */
|
Loading…
x
Reference in New Issue
Block a user