andrey-git/home-assistant-custom-ui

Custom UI elements for https://home-assistant.io

home-assistant-custom-ui's Issues

Content Aware Friendly Name not working on group names.

I tried this:

group.verlichting_woonkamer:
  friendly_name: Verlichting Woonkamer
  friendly_names:
    group.verlichting: Woonkamer
    group.woonkamer: Verlichting

Which doesn't seem to work.

It does work (as expected) on lights within groups.

Can’t get sliders to work with Hue Lights

Not sure what I’m doing wrong. Can’t see anything in the error log either. The sliders are always at 0 and don’t change the brightness when I move them.

Here’s my config:

homeassistant:
customize_glob:
light.*:
custom_ui_state_card: custom-ui
state_card_mode: break-slider
stretch_slider: true
hide_control: false
show_last_changed: false
slider_theme:
min: 0
max: 255
pin: true
off_when_min: false
report_when_not_changed: false

add screendump

Just a small remark.
Would be great if you could add a screenshot of the custom ui you created...

Sander.

Is there an option to template themes?

Not an issue. Just a question/feature request.
With the new frontend theme option and the custom ui, it would be nice if we could template the color (or any other attribute) of some entities (badges, text, background etc.) depending on their value.
However, I think that is a lot harder to implement. Is there some work on this yet? I am thinking to start something.
Also it could be a nice addition if we could change the font type, weight, color, background color etc. of entities or/and state cards.
Thanks.
Some examples below (could apply for motion sensors, alarm, temperature etc.).

Is it possible to change icon color?

I got everything setup properly and am able to change background and font color, but am a little unsure if it is possible to change the icon color without just changing the icon altogether? It seems like it should be since they are material design icons.

Thanks!

Update script compatible with hassio?

The current update script does not work on hass.io. Is there any chance that either the script (or hass.io) can be updated to allow it to work?

Currently this is the result:

Getting state-card-custom-ui.html
wget: can't execute 'ssl_helper': No such file or directory
wget: error getting response: Connection reset by peer
rm: can't remove 'state-card-custom-ui.html.tmp': No such file or directory
Download failed with error 1

Google suggests that the solution may possibly be adding:

RUN apk --no-cache add openssl

when creating the docker container.. But I will defer to smarter people to verify if that's the case.

ImportError: cannot import name 'add_extra_html_url' after updating to latest

Home Assistant 0.52.1
Custom UI 20170805

I get:

2017-09-01 17:30:50 ERROR (MainThread) [homeassistant.loader] Error loading custom_components.customizer. Make sure all dependencies are installed
Traceback (most recent call last):
  File "/srv/homeassistant/lib/python3.4/site-packages/homeassistant/loader.py", line 142, in get_component
    module = importlib.import_module(path)
  File "/srv/homeassistant/lib/python3.4/importlib/__init__.py", line 109, in import_module
    return _bootstrap._gcd_import(name[level:], package, level)
  File "<frozen importlib._bootstrap>", line 2254, in _gcd_import
  File "<frozen importlib._bootstrap>", line 2237, in _find_and_load
  File "<frozen importlib._bootstrap>", line 2226, in _find_and_load_unlocked
  File "<frozen importlib._bootstrap>", line 1200, in _load_unlocked
  File "<frozen importlib._bootstrap>", line 1129, in _exec
  File "<frozen importlib._bootstrap>", line 1471, in exec_module
  File "<frozen importlib._bootstrap>", line 321, in _call_with_frames_removed
  File "/home/homeassistant/.homeassistant/custom_components/customizer/__init__.py", line 7, in <module>
    from homeassistant.components.frontend import (
ImportError: cannot import name 'add_extra_html_url'
2017-09-01 17:30:51 ERROR (MainThread) [homeassistant.loader] Unable to find component customizer
2017-09-01 17:30:51 ERROR (MainThread) [homeassistant.setup] Setup failed for customizer: Component not found.

REQUEST: Extra Data allow other entities

While I understand why attributes may be the only option today, example where other entities makes sense:

      sensor.dark_sky_temperature:
        friendly_name: Currently
        custom_ui_state_card: custom-ui
        extra_data_template: "{sensor.dark_sky_apparent_temperature}"

I can then have one line with Temperature - a 'Currently' with a 'Feels Like' as Extra Data.

Group specific friendly names not always working

Checklist

• I'm running the latest version of CustomUI (Update guide) or using a specific release that is not marked as "Broken".
• I tried to force-refresh (Ctrl+Shift+R / Ctrl+F5) the browser
• (Optional, but recommended) I'm using Chrome or tried to reproduce the feature on Chrome.

Browser version: Firefox - 56, Chrome - 61

CustomUI version: 20170927

Home Assistant release (hass --version): 0.55.1

Problem-relevant configuration.yaml entries:

group.living_room_lights:
  friendly_name: Living Room Lights
  icon: mdi:lightbulb
  group:
    group.living_room:
      friendly_name: Lights
sensor.living_room__aeotec_luminance:
  friendly_name: Living Room Light Level
  state_card_mode: badges
  group:
    group.living_room:
      friendly_name: Light Level

groups.yaml:

Default View:
  view: yes
  icon: mdi:home
  entities:
    - group.living_room_lights
    - group.default_view_sensors
Living Room:
  view: yes
  entities:
    - group.living_room_sensors
    - group.living_room_lights
Living Room Lights:
  entities:
    - switch.living_room__corner_switch
    - switch.living_room__cabinet_switch
Living Room Sensors:
  entities:
    - binary_sensor.compound_living_room_occupancy
    - sensor.living_room__aeotec_temperature
    - sensor.living_room__philio_temperature
    - sensor.living_room__aeotec_luminance

Any errors from browser Javascript console:

Unable to check <input pattern='[[pattern]]'> because the pattern is not a valid regexp: raw bracket is not allowed in regular expression with unicode flag blank
paper-drawer-panel is deprecated. Please use app-layout instead!  frontend-2de1bde3b4a6c6c47dd95504fc098906.html-75.js:1
Password fields present on an insecure (http://) page. This is a security risk that allows user login credentials to be stolen.[Learn More]  group.living_room
Invalid chrome URI: /
Loaded CustomUI 20170927  state-card-custom-ui.html.js:1

The issue I am facing is that the context-aware attributes for groups seem to not always work. In particular it seems that elements that are nested directly in the group being used as a filter are not taking the context-aware aspects into account, while more deeply nested elements are.

In the "groups.yaml" above the first two groups define views in the interface. The second two groups that are then loaded into those two views. Groups or sensors/switches/... that are in one of the nested groups will take the context-aware aspects into account and as the configuration sample shows I use it to modify the friendly_name. For some reason the same does not work for groups/sensors/switches/... that are included directly in the view groups. The "Living Room Light Levels" to "Light Levels" works, but the "Living Room Lights" to "Lights" one does not.

I have some screenshots, but for some reason cannot upload them here. Will keep trying.

No custom UI card

Good day, installed 0.53 and followed the instructions for Custom UI but can't get the custom UI card in the panel. Any suggestions?

Is there any possibility of a group dimmer custom control?

I have a number of lights which comprise of multiple bulbs such as this:

Umm.. Don't know why it rotated 90 degrees.. Imagine them hanging off the ceiling rather than a wall :P

Is there any possibility of a light group dimming custom control that works in the same manner as the individual light controls do?

Custom_ui not showing up correctly on 0.51.1

Updated to 0.51.1 and the WemoInsight switch did not appear correctly:

I copied the latest files today and here's the configuration of the switch:

     switch.wemoinsight:
       custom_ui_state_card: custom-ui
       extra_badge:
         entity_id: sensor.wemopowerused  # Will take precedence over attribute and unit below.
         attribute: power_consumption
         unit: W
         blacklist_states: 0

Unavailable devices not showing last update time

Devices that are no longer available are not showing the last update time. For example this LIFX light:

However the information IS there:

Is there any way to have it displayed in these circumstances?

state_card_mode: badges for binary_sensor

Hello,

it is not possible to use state_card_mode: badges for binary sensors? If I use it for a binary sensor it is not displayed as badge in a group.

Any hints?

Thanks!

Hass.io

Is it possible to get this working in hass.io ? Perhaps has a add-on?

Problems after HA 0.53.0

This no longer works for me since HA 0.53.0

I ran the update.sh script to get the latest files.

Then i changed in my config from
custom_ui_state_card: custom-ui
to
custom_ui_state_card: custom-ui-state-card

and i added this to my configuration.yaml

frontend:
  extra_html_url:
    - /local/custom_ui/state-card-custom-ui.html

This just results in all my cards being empty, no entities shown.

Am i doing something wrong or is it broken?

Display sensor in extra data template

I am struggling to display a sensor in an extra_data_template.

This works:

homeassistant:
    customize:
        sensor.home_battery_load_watts:
            friendly_name: test
            extra_data_template: "test"

These do not:

            extra_data_template: '{{ states.sensor.whizbangjr_amps.state }}'

            extra_data_template: {{ states.sensor.whizbangjr_amps.state }}

Note: the bellow non working exemple works as a value_template elsewhere ....

            extra_data_template: '{{ states.sensor.whizbangjr_amp.state|int }}'

            extra_data_template: '{{ entities.sensor.whizbangjr_amp }}'

Note: The bellow exemple test won't execute as javascript but show the script literally in the UI "return 'test';"

            extra_data_template: >
                return 'test';

This won't work either:

            extra_data_template: >
                {{states.sensor.whizbangjr_amp}}A

Indeed test were made using latest version:

$ ./update.sh 
Getting state-card-custom-ui.html
Getting state-card-custom-ui.html.gz
Updated to Custom UI '20170802'
Getting ha-panel-custom-ui.html
Getting ha-panel-custom-ui.html.gz
Updated Panel to '20170802'
Getting __init__.py
File up to date.
Getting services.yaml
File up to date.

Need to force refresh before entities show (0.53.)

I updated to 0.53 today and have empty state cards under Chrome desktop and mobile.
In order to have the state cards content, I need to

1. first open the console (F12)
2. then force refresh (Ctrl + F5).

I have to do it each time I open home assistant

Because it isn't possible to do on mobile, I cannot have it work on mobile.
Firefox has no such issue.

Looks like a duplicate of #40

Browser + Version: Chrome 61

CustomUI version: 20170918

Home Assistant: 0.53.1

homeassistant:
  customize_glob:
    "*.*":
      custom_ui_state_card: state-card-custom-ui

customizer:
  custom_ui: local

REQUEST: Media Player Custom UI

Here is an example of our pain:
https://community.home-assistant.io/t/hide-cover-art-in-media-players/9826
https://community.home-assistant.io/t/tts-causes-media-player-album-art-bounce/19358

For starters just the ability to disable cover art would be INCREDIBLY useful.

Regards,
Michal

Context-aware group card titles?

Is it possible to change the displayed title of a group that is shown as a card within a view by applying a friendly_name to the group entity within the parent view's context? Changing the displayed name of a group that is included within another group is working properly, but I have been unable to change the displayed title of a group included directly in a view within the context of the view (changing the displayed title with a global "friendly_name" does work, however). I'm not sure if I am applying the customizations incorrectly, or if I am trying to do something not currently possible.

Thanks for any info you can provide. If my problem description doesn't make sense I can provide full configuration details.

Dimmer switches supported?

Checklist

• I'm running the latest version of CustomUI (Update guide) or using a specific release that is not marked as "Broken".
• [x ] I tried to force-refresh (Ctrl+Shift+R / Ctrl+F5) the browser
• [x ] (Optional, but recommended) I'm using Chrome or tried to reproduce the feature on Chrome.

Browser + Version:
Latest Chrome

CustomUI version:
Latest
Home Assistant release (hass --version):
0.55
Problem-relevant configuration.yaml entries:

Problem-relevant Home Assistant log entries:

Any errors from browser Javascript console:

Are dimmer switches even supported? I don't see any reference to what types of devices are supported. Reason I ask is I can only control lights. Not switches that are dimmable.

Changing Views/Tabs or resizing window doesn't use Custom-UI

When viewing a tab, Custom UI is working. Moving to a new tab, the custom ui does not work unless you manually refresh the page.

Resizing a browser window also removes custom ui.

How to setup this with Home Assistant Docker?

Hi,

I'm using the latest version of Home Assistant via Docker. I have it setup so that it will update everytime there is a new release via Watchtower. A new Docker container is created, but all configs still work as they are kept locally.
Is it possible to install this on a Docker container, without loosing it everytime Home Assistant is updated and a new container is created?

Thank you!

Themes for badges

Hello,

I don't want to spam your issues section, but it is possible to add support, that I can apply a theme to a badge?

I tried, but it is not applied to my badge.

Checklist

• I'm running the latest version of CustomUI (Update guide) or using a specific release that is not marked as "Broken".
• I tried to force-refresh (Ctrl+Shift+R / Ctrl+F5) the browser
• (Optional, but recommended) I'm using Chrome or tried to reproduce the feature on Chrome.

Browser + Version:

CustomUI version:

Home Assistant release (hass --version):

Problem-relevant configuration.yaml entries:

kitchen:
  name: Küche
  view: no
  entities:
    - group.kitchen_windowshutter

kitchen_windowshutter:
  view: no
  entities:
    - binary_sensor.climate_kitchen_windowshutter

or

kitchen:
  name: Küche
  view: no
  entities:
    - binary_sensor.climate_kitchen_windowshutter

Customize:

binary_sensor.climate_kitchen_windowshutter:
  icon: mdi:glassdoor
  friendly_name: Fenster
  theme_template: >
    if (entities['binary_sensor.climate_livingroom_windowshutter'].state === 'on') return 'yellow'; else return 'default';
  extra_data_template: >
     if (entities['binary_sensor.climate_livingroom_windowshutter'].state === 'off') return null; else return Seit (entities['sensor.climate_livingroom_windowshutter_openingtime'].state) Minuten offen;
  state_card_mode: badges

group.kitchen_windowshutter:
  icon: mdi:glassdoor
  friendly_name: Fenster
  theme_template: >
    if (entities['binary_sensor.climate_livingroom_windowshutter'].state === 'on') return 'yellow'; else return 'default';
  extra_data_template: >
     if (entities['binary_sensor.climate_livingroom_windowshutter'].state === 'off') return null; else return Seit (entities['sensor.climate_livingroom_windowshutter_openingtime'].state) Minuten offen;
  state_card_mode: badges

configuration.yaml

frontend:
  extra_html_url:
    - /local/custom_ui/state-card-media_player.html
    - /local/custom_ui/state-card-custom-ui.html
    - /local/custom_ui/state-card-custom_alarm.html
    
  themes:
    yellow:
      label-badge-background-color: yellow
      label-badge-text-color: yellow

Problem-relevant Home Assistant log entries:

no applicable log entries observed

Any errors from browser Javascript console:

Uncaught SyntaxError: Unexpected identifier
    at new Function (<anonymous>)
    at Object.computeTemplate (state-card-custom-ui.html:1)
    at HTMLElement.computeExtra (state-card-custom-ui.html:1)
    at k (frontend-6b0a95408d9ee869d0fe20c374077ed4.html:1)
    at Object.d [as fn] (frontend-6b0a95408d9ee869d0fe20c374077ed4.html:1)
    at a (frontend-6b0a95408d9ee869d0fe20c374077ed4.html:1)
    at e (frontend-6b0a95408d9ee869d0fe20c374077ed4.html:1)
    at u (frontend-6b0a95408d9ee869d0fe20c374077ed4.html:1)
    at HTMLElement.value (frontend-6b0a95408d9ee869d0fe20c374077ed4.html:1)
    at HTMLElement.value (frontend-6b0a95408d9ee869d0fe20c374077ed4.html:1)

Uncaught TypeError: Cannot read property 'customizer.customizer' of null
    at Object.useCustomizer (state-card-custom-ui.html:1)
    at Object.init (state-card-custom-ui.html:1)
    at state-card-custom-ui.html:1

not working since 0.43.x

Hello,
First of all, thanks for these custom controls, they worked great! I said worked because it seems that since 0.43.x they have no longer worked... any idea why?

cheers

Problem getting badges to work using badges_list

I've been trying to get badges working using option 2 as outlined in the documentation with no luck. Option 1 works:

  customize_glob:
    "*.*":
      custom_ui_state_card: custom-ui
    group.inner_group:
      state_card_mode: badges

group:
  inner_group:
    entities:
      - sensor.office_energy_period
      - sensor.office_energy_current
      - sensor.office_energy_power
      - sensor.office_energy_voltage
      - sensor.office_energy_factor
  outer_group:
    entities:
      - group.inner_group
      - sensor.office_energy_yesterday
      - sensor.office_energy_yesterday_cost
      - sensor.office_energy_today
      - sensor.office_energy_today_cost

Resulting in:

But option 2 (if I am using it correctly) does not:

  customize_glob:
    "*.*":
      custom_ui_state_card: custom-ui
    group.inner_group:
      state_card_mode: badges
      badges_list:
        - sensor.office_energy_period
        - sensor.office_energy_current
        - sensor.office_energy_power
        - sensor.office_energy_voltage
        - sensor.office_energy_factor

group:
  inner_group:
    entities:
      - sensor.office_energy_period
      - sensor.office_energy_current
      - sensor.office_energy_power
      - sensor.office_energy_voltage
      - sensor.office_energy_factor
      - sensor.office_energy_yesterday
      - sensor.office_energy_yesterday_cost
      - sensor.office_energy_today
      - sensor.office_energy_today_cost

Results in:

I have a lot of existing groups that I would like to modify with badges so I was hoping that I could get the second option working.

Is there anything in my config that is incorrect?

P.S. I have no idea why the group in option 1 took on the context naming of group.office_energy. They both should have shown the full names for the entities.

Not able to apply to the group of light

I am trying to customize the group of light so that each light has the following feature. But not able to..
group.all_lights:
custom_ui_state_card: state-card-custom-ui
show_last_changed: true
state_card_mode: break-slider-toggle
stretch_slider: true
theme: happy
slider_theme:
max: 200
min: 10
off_when_min: false
pin: true
report_when_not_changed: false
group.all_devices:
show_last_changed: true

This above code is from the customize.yaml file. Am I doing something wrong?
If I do it for one entiity, it work fines

Some of the new CSS variables (0.51) not working with theme per-entity

Example:
paper-card-background-color applies a custom color when a general theme is used.
However, it does not apply any change when it is used with theme per-entity.
The goal is something like below.

REQUEST: Replace slider with buttons - specifically Fan UI

Replace the slider with buttons, current use being for a fan:

Low | Med | High

Max and pin attributes not working as expected

These custom UI elements are fantastic and thank you very much for them! I hope you create more custom ui elements.

I've run into a couple of problems:

1. Even with max set to 255 the slider in the custom ui. is only able to set the value of brightness up to 100 maximum.
2. With pin set to true I do not see the value as I move the slider.

Tested in both Safari and Chrome on macOS and in Edge on Windows 10.

Brightness slider no longer auto updating

I'm not sure as of which version of HA this happened (I'm currently running 0.44.0) but the brightness slider doesn't update based on the brightness of the light. I can still manually chang it but if it is changed by an automation or another mechanism it does not update.

REQUEST: Make show_last_changed available for all entities

This would be extremely useful for all sorts of sensors (especially motion sensors).

Custom Ui partially broken with 0.51.1

Sliders don't show anymore and all customized entities don't align properly to the right of the state card.
Thanks.

Attributes with spaces

I'm trying to use custom-ui in order to show some attributes with spaces but I'm unable to do it.

I've opened an issue with HA but they redirected me here :)

It could be possible for custom-ui to support attributes with spaces?

Theming and per entity theming not working for badges

Checklist

• I'm running the latest version of CustomUI (Update guide) or using a specific release that is not marked as "Broken".
• I tried to force-refresh (Ctrl+Shift+R / Ctrl+F5) the browser
• (Optional, but recommended) I'm using Chrome or tried to reproduce the feature on Chrome.

Browser + Version:
Chrome, 62

CustomUI version:
2017-10-19
Home Assistant release (hass --version):
0.56.2
Problem-relevant configuration.yaml entries:

Everything else works OK (regarding themes and per entity themes). I can set a theme for all of them, however not per entity.
The variables below are ignored by Custom-UI. I didn't try but I am sure all the variables are ignored for the badges (badges can't be themed). Am I doing something wrong?

--label-badge-background-color: white;
--label-badge-text-color: rgb(76, 76, 76);

Sample configuration:

binary_sensor.door_window_sensor_158d0000f125f7:
      state_card_mode: badges
      templates:
        theme: >
            if (entity.state == 'on') return 'statuson'; else return 'default';

statuson:
      label-badge-background-color: '#00cc66'
      label-badge-text-color: rgb(76, 76, 76);

Problem-relevant Home Assistant log entries:

No errors in log.

Any errors from browser Javascript console:

See picture below.

Odd behaviour when hiding side panel in HA

I don't know if the fact that the affected strings have two words rather than one is part of the issue, but that's the only thing I see that's different about them.

With side panel:

Without side panel:

This is affecting both Chrome and Safari on Mac.

Lock slider

It would be cool if the function "confirmable controls" could also lock the sliders - not just the switches.
I'm often switching some of my lights on when trying to scroll, because I accidentally touched a slider.

Changes to extra_data_template

Would it be possible to have template examples for states from another entity? I'm having some trouble getting the new syntax right.

For example, I was previously using "${state.sensor.office_energy_today_cost}" to display a dollar value.. What would the new syntax be?

I also noticed a change in behaviour for when I used an attribute of a light (effect) within the extra_data_template. Previously when the light was off it would show the time since state change (since effect was unavailable), and now it shows "undefined".

Planned Features

• Extra data that can access other entity's state
• Allow context-aware group names (via js hooks)
• Confirmable controls
• Dynamic customization
• Entity-theming
• Installer/updater script
• Expand context-aware to context-and-device-aware

Margin between badges

Hello,

is there any possibility to add a margin between multiple badges? For instance that a badge name like "temperature" is not cut to "temperat...?

Need to force refresh before entities show (0.53.)

If I restart hass and go to the ui the custom cards don't show(no entities) and in chrome debugger there are a lot of errors about not finding the html file in the custom_ui folder.
After force refresh (ctrl+f5) it works

i'm using the hosted version with folowing configuration

customize_glob:
    light.*:
      custom_ui_state_card: state-card-custom-ui
      state_card_mode: break-slider-toggle

Request: Group specific entity name

Would it be possible to add something like this? Maybe not exactly the same, but some way to allow me to override the name of an entity. Even if I had to run it across a regex or something would be fine.

https://community.home-assistant.io/t/group-specific-friendly-name/12816/6

problems with homematic dimmers

I like your design with the slider very much, but i have an issue to get it working

on/off works as expected, but using the slider is not working. i get following message:

17-04-20 20:08:40 DEBUG (MainThread) [homeassistant.components.websocket_api] WS 1843698608: Received {'service': 'turn_on', 'type': 'call_service', 'domain': 'light', 'id': 10, 'service_data': {'entity_id': 'light.hbdimmer36', 'undefined': 91}}
17-04-20 20:08:40 INFO (MainThread) [homeassistant.core] Bus:Handling <Event call_service[L]: service=turn_on, service_data=entity_id=light.hbdimmer36, undefined=91, domain=light, service_call_id=1978041424-1>
17-04-20 20:08:40 ERROR (MainThread) [homeassistant.core] Invalid service data for light.turn_on: extra keys not allowed @ data['undefined']. Got 91
17-04-20 20:08:40 INFO (MainThread) [homeassistant.core] Bus:Handling <Event service_executed[L]: service_call_id=1978041424-1>

a working event looks like this:

17-04-20 20:06:33 INFO (MainThread) [homeassistant.core] Bus:Handling <Event state_changed[L]: old_state=<state light.hbdimmer36=on; custom_ui_state_card=custom_light, friendly_name=HBdimmer36, id=HBdimmer36, brightness=255, proxy=rf, working=Yes, rssi=-60, supported_features=1, state_card_mode=break-slider, slider_theme=min=10, max=200, pin=True, off_when_min=True, show_last_changed=True @ 2017-04-20T20:06:31.050023+02:00>, new_state=<state light.hbdimmer36=on; custom_ui_state_card=custom_light, friendly_name=HBdimmer36, id=HBdimmer36, brightness=255, proxy=rf, working=No, rssi=-60, supported_features=1, state_card_mode=break-slider, slider_theme=min=10, max=200, pin=True, off_when_min=True, show_last_changed=True @ 2017-04-20T20:06:31.050023+02:00>, entity_id=light.hbdimmer36>
17-04-20 20:06:33 INFO (Thread-12) [pyhomematic.devicetypes.generic] HMGeneric.event: address=HBdimmer36:1, interface_id=homeassistant-rf, key=LEVEL_REAL, value=1.0

what i can see so far is, you are sending the brightness level to undefined: 'undefined': 91

Change dynamically badge description by extra_data_template

Hello,

would it be possible to output a value by extra_data_template if the entity is displayed as a badge?
Just like:
extra_data_template: if (entities['binary_sensor.climate_livingroom_windowshutter'].state === 'off') return 'Closed'; else 'Opened';

Thanks in Advance!

Add gzip version

Home Assistant will ship the gzip'd version of a file if it's available. All people need to do is gzip the file and save it as state-card-custom-ui.html.gz and it will work 👍

Custom UI on iOS not showing

I've included the slider UI for my dimmers which works fine in Chrome (desktop and android phone), but it won't show in Safari on iOS.

Docs seemed to indicate this should work in in Home Assistant > 0.41 and I'm currently on 0.52.

Android:

iOS:

Context aware naming issues

Hi,

The new context aware naming feature is something I have dreamed of for HA since I've started using it. Thank you!

I wanted to test it out in a package which would greatly benefit from this and it partly works. But for some reason it's inconsistent. These two screenshots should be illustrative of the problem:

And here is the package that I am having this problem with:

https://hastebin.com/zupuhupeno.coffeescript

Would greatly appreciate any help to get this fully working.

Regards,
Michal

Extra data support for state as well as attribute

Is there a way to get the extra data template to support sensor states as well as attributes?
I've come across man use cases where this would be ideal.

The badge can show either a state or an attribute.

New frontend classes (0.51) not working with theme_template

Some new frontend classes where added in 0.51 (e.g. background color state card - paper-card-background-color.
Some other work (e.g. paper-item-icon-color).
Maybe it is just me but I can't get something similar to the picture below (with theme_template applying a background color to a single entity).
I can work on it, but I would need a start point. Sadly, I don't have the time these days to understand the code. Thanks.

QUESTION: Is it possible to have different customisations for different groups?

For example, with a battery powered motion sensor I may want to have the last triggered time visible as additional data for most groups, but the battery level attribute when in the battery group.