Homekit Infused (HKI) v2.0.0b10 - Updated 03/05/2020

Tags: #<Tag:0x00007f7802c1e2e8>

It’s an input_select which has the different options (Good Morning, Good Evening, etc.) and an automation that changes the input_select to the correct option based on time.

This is the automation:

## Automations that you can edit
  # Frontend Header Greeting (If you change this, change the input_select for this as well, use the same names!)
  - alias: Frontend Greeting
      - platform: time_pattern
        minutes: "/5"
      - platform: homeassistant
        event: start
      service: input_select.select_option
        entity_id: input_select.frontend_greeting
        option: >
          {% if (states.sensor.time.state > '00:00') and (states.sensor.time.state < '06:00') %}
            Good Night
          {% elif (states.sensor.time.state > '06:00') and (states.sensor.time.state < '12:00') %}
            Good Morning
          {% elif (states.sensor.time.state > '12:00') and (states.sensor.time.state < '18:00') %}
            Good Afternoon
          {% elif (states.sensor.time.state > '18:00') and (states.sensor.time.state < '23:59') %}
            Good Evening
          {% endif %}

And the input_select:

# Frontend Greeting (shown in the header of the frontpage)
    name: Frontend Greeting
      - Good Morning
      - Good Afternoon
      - Good Evening
      - Good Night
1 Like

why not simply use a template sensor for that? Like:

        friendly_name: 'Day phase'
        entity_id: sensor.time
        value_template: >
          {% if now() > now().replace(hour=6).replace(minute=0).replace(second=0) and
                now() < now().replace(hour=12).replace(minute=0).replace(second=0) %}
          {% elif states('sun.sun') == 'above_horizon' or
              now() > now().replace(hour=12).replace(minute=0).replace(second=0) and
              now() < now().replace(hour=18).replace(minute=0).replace(second=0) %}
          {% elif states('sun.sun') == 'below_horizon' or
              now() >  now().replace(hour=18).replace(minute=0).replace(second=0) and
              now() < now().replace(hour=23).replace(minute=59).replace(second=59) %}
          {% else %}
          {% endif %}

and use that in the markdown:

            content: |
              ## Good{{states('sensor.day_phase')|lower}}

(above sensor is a quick c&p, and could of course be much simpler…)


@Mariusthvdb This is actually exactly what I am looking for, as always thanks.

I just copied the original code :upside_down_face:

Message of the day:

All updates for v 1.x are postponed til further notice. If you have any issues, please open an issue on github so I can add it to Homekit Infused v 2.0. I can not give an ETA, but I will definitely show you a preview at the end of the week.

Here are some screenshots of what is going to happen. Global config will be removed entirely! Why? Because I have found a way to do it in the ui and thus Homekit Infused 2.0 will be fully customizable through the ui. Hide elements you don’t need, add custom user content. Rearrange buttons. Rename or add entities? All will be ui-based! You will be greeted with a nice install wizard at first boot and the interface will guide you through the setup process. No more fiddling in yaml files (except for user created content). Completely customizable, modular and autofilled through the UI.

I will keep you posted! It will also be multilingual, people that want to help me translate are most welcome! (Please join me on Slack, find the links in the first post!)

You probably haven’t seen something like this before! See ya soon!


Thank you both @Burningstone & @Mariusthvdb

Just one question, where would I place the first code? thanks

You are kidding me!!! That’s awesome, I highly appreciate what you are doing, “only” to make it easier for other user to use your awesome frontend! It’s people like you, that make this community so great. :+1:

1 Like

Well the goal is to give you something that is super easy to install, easier to configure and even easier to use.

In my opinion the UI is the best option, especially for the people that have little knowledge of HA.

It will take me some time to build this, and if you currently use 1.1 already I will advise you to save customized views when it releases. It will be super easy to insert your custom cards into v2.0 when it does get released.

Anyways thank you, all of your support is really awesome. Thanks!


@jimz011 First of all let me show you my appreciation for this layout, it is nothing short of awesome. I am using it on Android and its even allowed my wife to use the home assistant interface on her mobile device, long gone are the days where I have to adjust a light to the exact settings she requests. So thank you very much!

I do have one issue though and this is the thermostat card doesn’t display correctly.

Do you know what the solution for this is?

Seems like the height is incorrectly set on the control itself (not the card).

you have to copy the file from Jim’s repository and delete if you have the .gz file from your folder

1 Like

Did you get it from HACS or did you get it from my repo?

If you got it from HACS do the following:

  • get the plugin from my repo
  • overwrite the old one with the one from my repo
  • make sure that the js file from my repo is the only one in that folder. (So delete the .gz file)
  • reload lovelace or restart.

This should fix the problem.

I know of these issues, but I am reluctant to update the repo for this as I am currently working real hard to realize HKI 2.0. And if you think that HKI 1.1 is amazing, well, then I am sure you’ll fall in love with 2.0 even more! (For previews you’ll have to either join our slack channel, link in the first post or wait til I make a video preview in the upcoming 2 weeks.

But I am betting that it will be something that many people haven’t seen before in any lovelace ui! People on our slack channel might know what I am talking about :smiley:

I did indeed get the plugin from HACS, however I have now removed it from HACS, downloaded the one fromt your repo here and rebooted home assistant.

I cleared my browser cache and reloaded chrome and unfortunately I still have the issue :expressionless:

On a plus note, I’ve just joined the slack channel to see whats going on… :slight_smile:

Did you remove the .gz file that was in that folder as well?

Ignore me, I was being a plum.

I just did an empty cache and hard reload, which didnt fix the issue. Clearing all data from Chrome has fixed the issue. Thanks for your hasty response. :smiley:

1 Like

Hey Jim,

Awsome looks!
Question, how does this look like on a tablet?
I see pics from a phone, but how well does it look on tablet/laptop?

This is my main interface on all our devices, iPhones, iPads, Mac OS, Ubuntu, even tried it on the Fire TV browser Silk, it works fine on all of them, I may eventually make some new views for when using my laptop to fit more on the screen, but it looks great on all, just doesn’t use the whole width of the screen, but no weird issues with layout on any of them.

Can you show me how it does look like on laptop?
Would you recommend to wait for version 2 or start right away?

i started with HA so far see https://github.com/skank01/Home-Assistant

i dont want to get rid of the network stuff, but this does look way more nice

Would you advise to try?


I would advise you to wait, v2.0 will be mostly ui based, I will try to make it compatible for tablets/laptops. But no guarantees. I might add support for it in 2.1 however ofc the interface will be usable on a tablet/laptop, though it looks exactly the same as on a phone currently only slightly larger.

@hazio And @Mariusthvdb I found an easy way to do this, though you must have card-mod installed. This method does not require automations or template sensors!

              - type: markdown
                style: |
                  ha-card {
                    box-shadow: none;
                    height: 33px;
                    background: none;
                    padding: 0px 10px;
                    color: var(--header-color);
                content: > 
                  {% if (states.sensor.time.state > '00:00') and (states.sensor.time.state < '06:00') %}
                    ## Good Night
                  {% elif (states.sensor.time.state > '06:00') and (states.sensor.time.state < '12:00') %}
                    ## Good Morning
                  {% elif (states.sensor.time.state > '12:00') and (states.sensor.time.state < '18:00') %}
                    ## Good Afternoon
                  {% elif (states.sensor.time.state > '18:00') and (states.sensor.time.state < '23:59') %}
                    ## Good Evening
                  {% endif %}

This is just a plain and simple markdown card!