Fix light more info (#6855)

This commit is contained in:
Bram Kragten 2020-09-08 16:17:01 +02:00 committed by GitHub
parent 9149bb9333
commit 4e676b1dba
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 13 additions and 2 deletions

View File

@ -176,6 +176,11 @@ class HaColorPicker extends EventsMixin(PolymerElement) {
this.drawColorWheel(); this.drawColorWheel();
this.drawMarker(); this.drawMarker();
if (this.desiredHsColor) {
this.setMarkerOnColor(this.desiredHsColor);
this.applyColorToCanvas(this.desiredHsColor);
}
this.interactionLayer.addEventListener("mousedown", (ev) => this.interactionLayer.addEventListener("mousedown", (ev) =>
this.onMouseDown(ev) this.onMouseDown(ev)
); );
@ -319,6 +324,9 @@ class HaColorPicker extends EventsMixin(PolymerElement) {
// set marker position to the given color // set marker position to the given color
setMarkerOnColor(hs) { setMarkerOnColor(hs) {
if (!this.marker || !this.tooltip) {
return;
}
const dist = hs.s * this.radius; const dist = hs.s * this.radius;
const theta = ((hs.h - 180) / 180) * Math.PI; const theta = ((hs.h - 180) / 180) * Math.PI;
const markerdX = -dist * Math.cos(theta); const markerdX = -dist * Math.cos(theta);
@ -330,6 +338,9 @@ class HaColorPicker extends EventsMixin(PolymerElement) {
// apply given color to interface elements // apply given color to interface elements
applyColorToCanvas(hs) { applyColorToCanvas(hs) {
if (!this.interactionLayer) {
return;
}
// we're not really converting hs to hsl here, but we keep it cheap // we're not really converting hs to hsl here, but we keep it cheap
// setting the color on the interactionLayer, the svg elements can inherit // setting the color on the interactionLayer, the svg elements can inherit
this.interactionLayer.style.color = `hsl(${hs.h}, 100%, ${ this.interactionLayer.style.color = `hsl(${hs.h}, 100%, ${

View File

@ -134,7 +134,7 @@ class MoreInfoLight extends LitElement {
attr-for-selected="item-name" attr-for-selected="item-name"
>${this.stateObj.attributes.effect_list.map( >${this.stateObj.attributes.effect_list.map(
(effect: string) => html` (effect: string) => html`
<paper-item itemName=${effect} <paper-item .itemName=${effect}
>${effect}</paper-item >${effect}</paper-item
> >
` `
@ -170,7 +170,7 @@ class MoreInfoLight extends LitElement {
} }
private _effectChanged(ev: CustomEvent) { private _effectChanged(ev: CustomEvent) {
const newVal = ev.detail.value; const newVal = ev.detail.item.itemName;
if (!newVal || this.stateObj!.attributes.effect === newVal) { if (!newVal || this.stateObj!.attributes.effect === newVal) {
return; return;