@DBuit All my thermostat popups are now working but I don’t understand the logic. The only thing I did was disable browser_mod and restarted HA a couple of times (having run out of other things to try)
Good to hear it works, but still really strange!
I know it makes no sense at all.
@DBuit thanks again so much for adding all those new features. I do have 2 (hopefully last) questions for you.
The actions are not centered, it kinda looks weird (and people with OCD might go crazy haha). Could this be fixed? And can we change the text size at the top op the popup (which shows the percentage or on/off). I have sent you a PM on slack with the solution for the alignment.
Second question: could the actions become conditional? E.g. if the light has rgb attributes then show X actions but if it only has color_temp show Y? I use autofilled groups but I had to create three groups to show different popups for different kind of lights. As shown in the screenshots below which are three different kind of lights.
Can someone tell me thats wrong with my code?
I get the error “required key not provided @ data[‘option’]”
- entity: input_select.house_mode_select
icon: 'mdi:weather-night'
popup:
type: 'custom:switch-popup-card'
icon: 'mdi:weather-night'
noActiveState: '-'
entity_value_path: attributes.options
service: input_select.select_option
service_data: null
entity_id: this
options: value
entities:
- input_select.house_mode_select
buttons:
- icon: 'mdi:lightbulb-on'
value: 'Kväll'
name: 'Kväll'
color: '#FFF'
- icon: 'mdi:lightbulb-on'
value: 'Dag'
name: 'Dag'
color: '#FFF'
- icon: 'mdi:lightbulb-on'
value: 'Natt'
name: 'Natt'
color: '#FFF'
- icon: 'mdi:lightbulb-on'
value: 'Morgon'
name: 'Morgon'
color: '#FFF'
- icon: 'mdi:lightbulb-on'
value: Städning
name: Städning
color: '#FFF'
It seems you don’t have an option set. Try changing options to option.
Thank you for your response @jimz011 however I cannot get it to work. Can you show how the code should look like?
Hi,
Do you see the buttons? OR nothing?
Any console errors?
You have service_data: null? I think you should remove the null and add indentation for entity_id
Actually, I made a button with the switch popup and a fan entity as described in the examples, but I couldn’t get it to work either 
HI
hanks for the position option, which is working alright. Though… it seems the position is still very sensitive to the more info card itself.:
is ok (imho it would still be better to show the settings cogwheel mdi:cog, which is generally used for more-info)
but the close button on the more-info itself:
is positioned touching the toggle switch. Using a cogl off icon would be an improvement already, but the positioning must change too I feel.
fyi, I’ve requested the creation of cog-off at MDI: https://github.com/Templarian/MaterialDesign/issues/4896
Hi @Mariusthvdb,
How are you using the pop-up? should not display it like that it should be at the same level as Buffet
Do you use it in fullscreen or not fullscreen?
And do you use browser_mod popup or homekit card?
this is my light-popup-card config:
type: vertical-stack
cards:
# - type: custom:swipe-card
# cards:
# - type: custom:light-entity-card
# entity: '[[[ return entity.entity_id ]]]'
# persist_features: true
# show_slider_percent: true
# smooth_color_wheel: true
- type: entities
style: |
ha-card {
--ha-card-background: transparant;
background: transparant;
box-shadow: none;
margin-top: -15px;
}
entities:
- type: custom:light-popup-card
entity: '[[[ return entity.entity_id ]]]'
fullscreen: false
sliderColoredByLight: true
sliderThumbColor: 'var(--paper-card-background-color)'
sliderTrackColor: ivory
settings: false #builtin more info
settingsPosition: top
# --iron-icon-fill-color: 'var(--primary-color)'
# [[[ var bri = states[entity.entity_id].attributes.brightness;
# return 'hsl(' + bri + ',65%,50%)'; ]]]
brightnessWidth: 150px
brightnessHeight: 400px
switchWidth: 150px
switchHeight: 400px
# supportedFeaturesTreshold: {{ _global.lights_popup.supportedFeaturesTreshold|default('9') }
actions:
- service: scene.turn_on
service_data:
entity_id: scene.lezen
color: ivory
name: Lezen
- service: script.turn_on
service_data:
entity_id: script.lighting_home_theater
color: orange
name: Film
- service: scene.turn_on
service_data:
entity_id: scene.naar_bed
color: red
name: Naar bed
- service: scene.turn_on
service_data:
entity_id: scene.slapen
color: darkblue
name: Slapen
invoked by:
hold_action:
haptic: heavy
action: call-service
service: browser_mod.popup
service_data:
title: >
[[[ return entity.attributes.friendly_name ]]]
card: !include /config/lovelace/includes/include_light_button_popup.yaml
in my button_light template
@Mariusthvdb the problem is you wrap the popup card in a vertical-stack and that makes that the settings button doesnt go at same level as the title.
Why do you use the vertical-stack? because you only load 1 card in it?
And the style part in entities card, does it do something for you? if i check the doc https://www.home-assistant.io/lovelace/entities/#style it is only used for the divider?
@Fredamn76 i found the problem
Your config should be like this:
- entity: input_select.house_mode_select
icon: 'mdi:weather-night'
popup:
type: 'custom:switch-popup-card'
icon: 'mdi:weather-night'
noActiveState: '-'
entity_value_path: state
service: input_select.select_option
service_data: null
entity_id: this
option: value
entities:
- input_select.house_mode_select
buttons:
- icon: 'mdi:lightbulb-on'
value: 'Kväll'
name: 'Kväll'
color: '#FFF'
- icon: 'mdi:lightbulb-on'
value: 'Dag'
name: 'Dag'
color: '#FFF'
- icon: 'mdi:lightbulb-on'
value: 'Natt'
name: 'Natt'
color: '#FFF'
- icon: 'mdi:lightbulb-on'
value: 'Morgon'
name: 'Morgon'
color: '#FFF'
- icon: 'mdi:lightbulb-on'
value: Städning
name: Städning
color: '#FFF'
The problem was the entity_value_path this the where the card can find the current state that you wanna check on. For example when you wanna change brightness you do something like attributes.brightness but you for input_select the current value is not in the attributes.options (this is the list of all possible options) the current value is just the state.
Also the service_data options should be option but @jimz011 already mentioned.
I got a working switch for input_selects let me know if it works now.
you’re probably right, it is a test setup, using more than 1 card in the stack, I comment out for testing:
type: vertical-stack
cards:
# - type: custom:swipe-card
# cards:
# - type: custom:light-entity-card
# entity: '[[[ return entity.entity_id ]]]'
# persist_features: true
# show_slider_percent: true
# smooth_color_wheel: true
- type: entities
style: |
ha-card {
--ha-card-background: transparant;
background: transparant;
box-shadow: none;
margin-top: -15px;
}
entities:
- type: custom:light-popup-card
entity: '[[[ return entity.entity_id ]]]'
fullscreen: false
sliderColoredByLight: true
sliderThumbColor: 'var(--paper-card-background-color)'
sliderTrackColor: ivory
settings: false #builtin more info
settingsPosition: top
# --iron-icon-fill-color: 'var(--primary-color)'
# [[[ var bri = states[entity.entity_id].attributes.brightness;
# return 'hsl(' + bri + ',65%,50%)'; ]]]
brightnessWidth: 150px
brightnessHeight: 400px
switchWidth: 150px
switchHeight: 400px
# supportedFeaturesTreshold: {{ _global.lights_popup.supportedFeaturesTreshold|default('9') }
actions:
- service: scene.turn_on
service_data:
entity_id: scene.lezen
color: ivory
name: Lezen
- service: script.turn_on
service_data:
entity_id: script.lighting_home_theater
color: orange
name: Film
- service: scene.turn_on
service_data:
entity_id: scene.naar_bed
color: red
name: Naar bed
- service: scene.turn_on
service_data:
entity_id: scene.slapen
color: darkblue
name: Slapen
- type: 'custom:rgb-light-card'
entity: '[[[ return entity.entity_id ]]]'
colors:
- color_temp: 153
transition: 2
icon_color: 'rgb(166, 209, 255)'
- color_temp: 227
transition: 2
icon_color: 'rgb(191, 222, 255)'
- color_temp: 300
transition: 2
icon_color: 'rgb(224, 239, 255)'
justify: center
- type: custom:rgb-light-card
entity: '[[[ return entity.entity_id ]]]'
colors:
- color_temp: 360
transition: 2
icon_color: 'rgb(255, 202, 112)'
- color_temp: 440
transition: 2
icon_color: 'rgb(255, 188, 74)'
- color_temp: 500
transition: 2
icon_color: 'rgb(255, 160, 0)'
justify: center
- type: entities
style: |
ha-card {
--ha-card-background: transparant;
background: transparant;
box-shadow: none;
--paper-slider-knob-color: white;
--paper-slider-knob-start-color: white;
--paper-slider-pin-color: white;
--paper-slider-active-color: white;
color: white !important;
--primary-text-color: white !important;
}
entities:
- type: custom:more-info-card
style: |
ha-card {
border-radius: none;
box-shadow: none;
margin-top: -40px;
}
entity: '[[[ return entity.entity_id ]]]'
will test it with only the one card, and see what happens, will report back soon 
result:
more-info (settings):
close button still touching the toggle-switch
without style:
and
Thank you for your reply.
However, then i use your code i get the error “bad indentation of a mapping entry” for
entity_id: this
option: value
After putting them at the same level as “service_data: null” the editor i don´t get any errors. The custom-card shows correct state but unfortunately i cannot change the state. Then i try to change the state i get the error below:
required key not provided @ data[‘option’]
Traceback (most recent call last):
File “/usr/src/homeassistant/homeassistant/components/websocket_api/commands.py”, line 134, in handle_call_service
connection.context(msg),
File “/usr/src/homeassistant/homeassistant/core.py”, line 1204, in async_call
processed_data = handler.schema(service_data)
File “/usr/local/lib/python3.7/site-packages/voluptuous/validators.py”, line 208, in call
return self._exec((Schema(val) for val in self.validators), v)
File “/usr/local/lib/python3.7/site-packages/voluptuous/validators.py”, line 287, in _exec
raise e if self.msg is None else AllInvalid(self.msg, path=path)
File “/usr/local/lib/python3.7/site-packages/voluptuous/validators.py”, line 283, in _exec
v = func(v)
File “/usr/local/lib/python3.7/site-packages/voluptuous/schema_builder.py”, line 272, in call
return self._compiled(, data)
File “/usr/local/lib/python3.7/site-packages/voluptuous/schema_builder.py”, line 817, in validate_callable
return schema(data)
File “/usr/local/lib/python3.7/site-packages/voluptuous/schema_builder.py”, line 272, in call
return self._compiled(, data)
File “/usr/local/lib/python3.7/site-packages/voluptuous/schema_builder.py”, line 594, in validate_dict
return base_validate(path, iteritems(data), out)
File “/usr/local/lib/python3.7/site-packages/voluptuous/schema_builder.py”, line 432, in validate_mapping
raise er.MultipleInvalid(errors)
voluptuous.error.MultipleInvalid: required key not provided @ data[‘option’]
Any ideas what can be wrong?
They should not be at the same level as service_data:null - copying and pasting does not respect indents in most cases so you need to fix the spacing manually (using spaces not tabs). entity_id and option should be indented by two spaces after service_data:null
Got it working now. Must have been some extra spaces somewhere. Didn’t change any code beside been careful with spaces.
1 Like
hey @DBuit
just noticed that even with:
settings: false
the setting button is displayed, and clicking it actually show the more info window. Is this a bug?
only taking the option settings: out of the config removes the settings button from the popup