jeans/frontend
jeans/frontend
1
0
Fork 0
mirror of https://github.com/home-assistant/frontend.git synced 2025-07-25 18:26:35 +00:00
Code Issues Packages Projects Releases Wiki Activity

Add Option For Kelvin Unit To Color Temperature Selector (#18627)

Browse Source
This commit is contained in:
schelv 2023-11-29 10:56:44 +01:00 committed by GitHub
parent eda0d12867
commit 5c47d8652d
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 48 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

51
src/components/ha-selector/ha-selector-color-temp.ts
View File

@ -7,7 +7,11 @@ import type { ColorTempSelector } from "../../data/selector";
import type { HomeAssistant } from "../../types"; import type { HomeAssistant } from "../../types";
import "../ha-labeled-slider"; import "../ha-labeled-slider";
import { generateColorTemperatureGradient } from "../../dialogs/more-info/components/lights/light-color-temp-picker"; import { generateColorTemperatureGradient } from "../../dialogs/more-info/components/lights/light-color-temp-picker";
import { mired2kelvin } from "../../common/color/convert-light-color"; import {
DEFAULT_MAX_KELVIN,
DEFAULT_MIN_KELVIN,
mired2kelvin,
} from "../../common/color/convert-light-color";
@customElement("ha-selector-color_temp") @customElement("ha-selector-color_temp")
export class HaColorTempSelector extends LitElement { export class HaColorTempSelector extends LitElement {
@ -26,10 +30,31 @@ export class HaColorTempSelector extends LitElement {
@property({ type: Boolean }) public required = true; @property({ type: Boolean }) public required = true;
protected render() { protected render() {
const min = this.selector.color_temp?.min_mireds ?? 153; let min: number;
const max = this.selector.color_temp?.max_mireds ?? 500; let max: number;
const gradient = this._generateTemperatureGradient(min, max); switch (this.selector.color_temp?.unit) {
case "kelvin":
min = this.selector.color_temp?.min ?? DEFAULT_MIN_KELVIN;
max = this.selector.color_temp?.max ?? DEFAULT_MAX_KELVIN;
break;
case "mired":
default:
min =
this.selector.color_temp?.min ??
this.selector.color_temp?.min_mireds ??
153;
max =
this.selector.color_temp?.max ??
this.selector.color_temp?.max_mireds ??
500;
break;
}
const gradient = this._generateTemperatureGradient(
this.selector.color_temp?.unit ?? "mired",
min,
max
);
return html` return html`
<ha-labeled-slider <ha-labeled-slider
@ -51,8 +76,22 @@ export class HaColorTempSelector extends LitElement {
} }
private _generateTemperatureGradient = memoizeOne( private _generateTemperatureGradient = memoizeOne(
(min: number, max: number) => (unit: "kelvin" | "mired", min: number, max: number) => {
generateColorTemperatureGradient(mired2kelvin(min), mired2kelvin(max)) let gradient;
switch (unit) {
case "kelvin":
gradient = generateColorTemperatureGradient(min, max);
break;
case "mired":
gradient = generateColorTemperatureGradient(
mired2kelvin(min),
mired2kelvin(max)
);
}
return gradient;
}
); );
private _valueChanged(ev: CustomEvent) { private _valueChanged(ev: CustomEvent) {

3
src/data/selector.ts
View File

@ -102,6 +102,9 @@ export interface ColorRGBSelector {
export interface ColorTempSelector { export interface ColorTempSelector {
color_temp: { color_temp: {
unit?: "kelvin" | "mired";
min?: number;
max?: number;
min_mireds?: number; min_mireds?: number;
max_mireds?: number; max_mireds?: number;
} | null; } | null;