Hamlet
(Hamid Shoja)
January 14, 2021, 11:15am
1
Hi there,
I am trying to create a philips hue widget for OH3 and I have come this far:
It already looks like I imagine it, but two functions are still missing:
the color picker
the scenes
How can I open the color picker via a popup? And how can I define a list (or array?) with the scenes?
Resources
Here is my Code:
uid: HUE_Lights
tags: []
props:
parameters:
- description: Title
label: Title
name: title
required: false
type: TEXT
- context: item
description: Color
label: Color
name: color
required: false
type: TEXT
- context: item
description: Scenes
label: Scenes
name: scenes
required: false
type: TEXT
parameterGroups: []
timestamp: Jul 6, 2021, 8:41:26 AM
component: f7-card
config:
title: =props.title
slots:
default:
- component: f7-row
config:
class:
- margin
slots:
default:
- component: oh-toggle
config:
item: =props.color
color: blue
- component: oh-button
config:
text: Scenes
fill: true
action: options
actionItem: =props.scenes
color: blue
visible: "=props.scenes ? true : false"
style:
width: 50%
top: 2px
- component: oh-colorpicker
config:
openIn: auto
item: =props.color
- component: oh-slider-card
config:
item: =props.color
noBorder: true
noShadow: true
color: blue
1 Like
ysc
(Yannick Schaus)
January 14, 2021, 12:23pm
2
this:
- component: oh-colorpicker
config:
openIn: auto # see https://v5.framework7.io/docs/color-picker.html
item: =props.color
(please note, the color picker “swatch” rectangle will not appear until you configure it with a valid Color item)
either:
a. actionItem: =props.scenesItem
(define scenesItem in props too) and make sure the item has State Description metadata with the options
b. actionOptions: =props.scenes
(define scenes in props as a regular TEXT prop) which should contain be configured along with the widget with comma-separated options
1 Like
Hamlet
(Hamid Shoja)
January 31, 2021, 3:44pm
3
The colorpicker works great, thank you, but I still didn’t get how to define the scenes. I thought of something like:
"sceneItems={
'0,0,0' : 'Aus',
'3,100,79' : 'Savanne',
'20,100,49' : 'Tropendämmerung',
'198,100,54' : 'Nordlichter',
'343,43,85' : 'FrĂĽhlingsblĂĽten',
'29,80,57' : 'Entspannen',
'30,60,100' : 'Lesen',
'32,30,100' : 'Konzentrieren',
'39,1,100' : 'Energie tanken',
'30,64,100' : 'Hell',
'30,64,31' : 'Gedimmt',
'27,100,10' : 'Nachtlicht'
}"
an example of how to define the list and how to retrieve the values ​​from it would help me a lot.
cidi
(Christian)
February 4, 2021, 8:40pm
5
Can someone help me on:
how to get the list of scenes and
how to use the list id for a scene in a rule.
thanks in advance
higgers
(Steve Higton)
July 3, 2021, 10:17pm
6
Did you make any more progress with your Hue widget? I’d like to use it too if possible
Hamlet
(Hamid Shoja)
July 5, 2021, 5:24am
7
The widget works except for the scene selection but I didn’t continue at that point either.
Mark_VG
(Mark)
July 5, 2021, 6:50am
8
This is what I use to access the scenes:
- component: oh-list-item
config:
item: PhilipsHueLounge_Scene
action: options
actionItem: LoungeRoom_Scene
listButton: false
listButtonColor: blue
title: Scenes
henryd
(Henry D)
July 5, 2021, 4:30pm
9
Hi Mark,
just a short question: How did you get the item PhilipsHueLounge_Scene?
Many thanks,
Henry
Mark_VG
(Mark)
July 5, 2021, 4:55pm
10
Hi.
It is a channel on my discovered room from my Philips Hue. Just linked it to an item via the UI.
Mark
1 Like
henryd
(Henry D)
July 5, 2021, 5:39pm
11
Hi,
Many thanks for your quick answer! I found the channel from my room in the Philips Hue App an linked it to an string-item I’ve created in the UI. But therefrom comes the name of the Philips Hue scene?
Is it one of this scenes in the app (I hope so):
Or have you created this scenes with rules in OH3?
Mark_VG
(Mark)
July 5, 2021, 6:36pm
12
The item is a string item containing all the Scenes from the Hue Group/Room.
If you create a component as follows:
- component: oh-list-item
config:
item: PhilipsHueLounge_Scene
action: options
actionItem: LoungeRoom_Scene
listButton: false
listButtonColor: blue
title: Scenes
You will get a listButton with the options of scenes to choose from:
My simplistic “test” is defined as:
component: oh-list-card
config:
title: Lounge Lights
slots:
default:
- component: oh-colorpicker-item
config:
title: Lounge Colour
item: LoungeRoom_Color
modules:
- hs-spectrum
- component: oh-slider-item
config:
title: Lounge Temperature
item: LoungeRoom_ColorTemperature
- component: oh-slider-item
config:
title: Lounge Brightness
item: LoungeRoom_Brightness
- component: oh-list-item
config:
item: PhilipsHueLounge_Scene
action: options
actionItem: LoungeRoom_Scene
listButton: false
listButtonColor: blue
title: Scenes
- component: oh-toggle-item
config:
title: Testing Switch
item: Testing_Switch
color: red
- component: oh-list-item
config:
action: command
actionCommand: ON
actionItem: Testing_Switch
title: Testing Switch
listButton: true
1 Like
henryd
(Henry D)
July 5, 2021, 7:52pm
13
Hi Mark,
I don’t know why, but it works !
I will play with it to understand something!
Many thanks for your cooperation, it was a great help!
Stay healthy!
Henry
Hamlet
(Hamid Shoja)
July 6, 2021, 6:49am
14
I didn’t know that you could create scenes as an item. That makes things easy, of course. Thanks for the hint.
Here is the code for the new functional widget:
uid: HUE_Lights
tags: []
props:
parameters:
- description: Title
label: Title
name: title
required: false
type: TEXT
- context: item
description: Color
label: Color
name: color
required: false
type: TEXT
- context: item
description: Scenes
label: Scenes
name: scenes
required: false
type: TEXT
parameterGroups: []
timestamp: Jul 6, 2021, 8:41:26 AM
component: f7-card
config:
title: =props.title
slots:
default:
- component: f7-row
config:
class:
- margin
slots:
default:
- component: oh-toggle
config:
item: =props.color
color: blue
- component: oh-button
config:
text: Scenes
fill: true
action: options
actionItem: =props.scenes
color: blue
visible: "=props.scenes ? true : false"
style:
width: 50%
top: 2px
- component: oh-colorpicker
config:
openIn: auto
item: =props.color
- component: oh-slider-card
config:
item: =props.color
noBorder: true
noShadow: true
color: blue
1 Like
dimes
(dimes)
August 1, 2021, 5:48pm
15
In the scene item I see all scenens for all rooms… Can I show the scenes for a special room only?
Here is my scene item linked to the scene channel of the bridge thing:
I have for created for Rooms/Areas in my hue app:
but only for the “Stehlampe” I created a thing and items:
If I open the scene like in the test above I see the scenes from the other rooms as well:
But I only want to see the last three one…