Skip to content

Commit

Permalink
[sitemap] New Colortemperaturepicker element
Browse files Browse the repository at this point in the history
Also include a small change of the Colorpicker element.

Related to openhab/openha-core#3891
Related to openhab/openhab-webui#2873

Signed-off-by: Laurent Garnier <lg.hc@free.fr>
  • Loading branch information
lolodomo committed Nov 24, 2024
1 parent 871abaf commit be7a36c
Show file tree
Hide file tree
Showing 3 changed files with 25 additions and 1 deletion.
Binary file modified ui/images/sitemap_demo_colorpicker.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added ui/images/sitemap_demo_colortemperaturepicker.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
26 changes: 25 additions & 1 deletion ui/sitemaps.md
Original file line number Diff line number Diff line change
Expand Up @@ -148,6 +148,7 @@ The following element types may be used in a Sitemap definition file.
| [Button](#element-type-button) | Renders a button inside a Buttongrid that is used to send commands to a given Item. |
| [Chart](#element-type-chart) | Adds a time-series chart object for [persisted](persistence.html) data. |
| [Colorpicker](#element-type-colorpicker) | Allows the user to choose a color from a color wheel. |
| [Colortemperaturepicker](#element-type-colortemperaturepicker) | Allows the user to choose a color temperature from a white color gradient. |
| [Default](#element-type-default) | Renders an Item in the default UI representation specified by the type of the given Item. |
| [Frame](#element-type-frame) | Establishes an area containing various other Sitemap elements. |
| [Group](#element-type-group) | Concentrates all elements of a given group in a nested block. |
Expand Down Expand Up @@ -454,7 +455,9 @@ Colorpicker item=<itemname> [label="<labelname>"] [icon=<iconref>] [staticIcon=<

This element is a combined control for something like a rgb or rgbw light where you can adjust brightness as well es the color hue.
The down-button decreases brightness to zero and switches the light off. The up-button sets brightness to full but keeps the previous color (hue).
The middle button opens an overlay to finetune your color. A color wheel let you pick the hue and a slider allows to set the brightness.
The middle button opens an overlay to finetune your color when you click on it.
In the overlay, a color wheel let you pick the hue and a slider allows to set the brightness.
The content of this middle button can also show what is the current color.

**Example:**

Expand All @@ -464,6 +467,27 @@ Colorpicker item=LR_LEDLight_Color label="LED Light Color" staticIcon=colorwheel

![Presentation of the Colorpicker element in BasicUI](images/sitemap_demo_colorpicker.png)

### Element Type 'Colortemperaturepicker'

```java
Colortemperaturepicker item=<itemname> [label="<labelname>"] [icon=<iconref>] [staticIcon=<iconref>]
```

This element is a control for something like a rgb or rgbw light where you can adjust the color temperature.
The button opens an overlay to finetune your color temperature when you click on it.
In the overlay, a white color gradient let you pick and set the color temperature.
The content of this button can also show what is the current color temperature.

- `minValue` and `maxValue` limit the possible range of the value (both included in the range).

**Example:**

```java
Colortemperaturepicker item=LR_LEDLight_ColorTemp label="LED Light Color Temperature" staticIcon=colorwheel
```

![Presentation of the Colortemperaturepicker element in BasicUI](images/sitemap_demo_colortemperaturepicker.png)

### Element Type 'Input'

```java
Expand Down

0 comments on commit be7a36c

Please sign in to comment.