Custom Lovelace Card - Homekit style card

maxym · January 13, 2021, 9:55am

Check if HACS is running.
There were update few weeks ago which causes HACS stopped working. It must not be visible immediately because of caching in browser

Virgil_Popa · January 13, 2021, 9:58am

is running, with last updates, the error is displayed for only a few seconds, then everything is ok

DBuit · January 13, 2021, 12:26pm

Hi,

Should be possible with css i think, can you share your config maybe i can give it a try
What is in the video is not in the code anymore. Long time ago you could just give a weather entity and it would show weather info in the rules section. but that is gone

DBuit · January 13, 2021, 12:28pm

Hi,

i still don’t really understand it
But the problem is that when the state is a time it is not displayed nice? And if i fix that you don’t need the entities card anymore right?

You got an example how i can get a time sensor in my config to test ?

haseat · January 14, 2021, 4:23am

I’m not Jimmy, but as I’m having the same problem I’ll step in .

I’m using an Amazon Echo, and I’m using the timer function pretty often. The Alexa integration adds a sensor to HA which looks like this. The state is the end time of the timer, if no timer is active, the state is unavailable:

That is how the timer is being shown using the homekit panel card now (shows end time of the timer):

And this is how the entities card shows the timer (remaining time, first in hours, then minutes, then seconds):

It would be really amazing if you could add this functionality to the homekit panel card.

DBuit · January 14, 2021, 8:29am

Hi,

can you share a screenshot of this entity in the developer tools of HA?

Jimmy_Berglund · January 14, 2021, 8:35am

Hi m8.

The problem is exacly as @haseat explained it that it show upp wrong. And as you @DBuit said. If its fixed we dont need to use the enteties card anymore. If it could be coded to understand that when this type of code comes “2020-12-29T08:03:04.710Z” i should convert that in to a correcly shown time.

I worked allot on getting my Washer to show the correct time time now and the correct programs with bits i found on the forums here and there.

But this is the code that got it working for me.

      maq_lavar_remaining:
        friendly_name: "Remaining Time"
        value_template:  >-
                        {%- if states('switch.tvattmaskin')|lower == "on" and states('sensor.tvattmaskin_washer_machine_state')|lower != "stop" -%}
                            {%- if states('sensor.tvattmaskin_washer_job_state')|lower != "none" and states('sensor.tvattmaskin_washer_job_state')|lower != "finish" -%}
                              {%- if as_timestamp(states('sensor.tvattmaskin_washer_completion_time')) > utcnow().timestamp() -%}
                                {%- if states('sensor.tvattmaskin_washer_job_state')|lower == "delaywash" -%}
                                  -{{ (( as_timestamp(states('sensor.tvattmaskin_washer_completion_time')) - utcnow().timestamp() ) + 60) | timestamp_custom ("%H:%M", false) }}
                                {%- else -%}
                                  {{ (( as_timestamp(states('sensor.tvattmaskin_washer_completion_time')) - utcnow().timestamp() ) + 60) | timestamp_custom ("%H:%M", false) }}
                                {%- endif -%}
                              {%- else -%}
                                Done
                              {%- endif -%}
                            {%- else -%}
                              Idle
                            {%- endif -%}
                        {%- elif states('switch.tvattmaskin')|lower == "off" -%}
                          Idle
                        {%- else -%}
                          Unavailable
                        {%- endif -%}
        icon_template: "{{ 'mdi:washing-machine' }}"

Guess it has something to do with this

states('sensor.tvattmaskin_washer_job_state')|lower != "finish" -%}
                              {%- if as_timestamp(states('sensor.tvattmaskin_washer_completion_time')) > utcnow().timestamp() -%}
                                {%- if states('sensor.tvattmaskin_washer_job_state')|lower == "delaywash" -%}
                                  -{{ (( as_timestamp(states('sensor.tvattmaskin_washer_completion_time')) - utcnow().timestamp() ) + 60) | timestamp_custom ("%H:%M", false) }}
                                {%- else -%}
                                  {{ (( as_timestamp(states('sensor.tvattmaskin_washer_completion_time')) - utcnow().timestamp() ) + 60) | timestamp_custom ("%H:%M", false) }}
                                {%- endif -%}

Maby this a short version of the same result.

sensor:
  - platform: template
    sensors:
      ha_message_alert:
        entity_id: sensor.time
        value_template: "{{ 'HA alert - ' + now().strftime('%H:%M') }}"

I hope this helps you to better understand what we hope can be added to this already awesome Card and make the experience even more easy use for the users. If you have any more questions ill be waiting.

haseat · January 14, 2021, 3:17pm

The screenshot is already in my first reply to you, but i’ll add it again

The whole entity includes lots more attributes, but these are Alexa/Echo specific and cannot be universally used for any other timer:

Jimmy_Berglund · January 14, 2021, 11:59pm

here is another

DBuit · January 15, 2021, 7:45am

Thanks guys,
Yeah it’s the device_class i need to use that value to know what kind of value it is so it can be displayed the correct way.

Im gonna fix this!

Jimmy_Berglund · January 15, 2021, 9:03am

Thx man! You are the best!

haseat · January 15, 2021, 9:17am

Thanks a lot!

Robert

DBuit · January 15, 2021, 1:01pm

@Jimmy_Berglund and @haseat

Just pre-released some changes for the timestamp.
let me know if this work! below some info

INFO ON NEW STUFF:
Add timestamp sensor options to display better. example:

- entity: sensor.fig_lx1_last_reboot
   timestampFormat: "[Klaar over] h [uur en ] mm [minuten]"
   timestampDiff: true

Thanks to @rob-mccann you can now add collapse: true to your column.
Which will hide the column when all entities are also hidden. Check readme for more info!

haseat · January 15, 2021, 1:31pm

I uninstalled and reinstalled the card (via HACS) and changed my entity, but it’s not working. Do you have an idea what I did wrong?

      - entity: sensor.livingroom_echo_next_timer
        timestampFormat: '[in ] h [hour(s) and ] mm [minutes]'
        timestampDiff: true
        name: Echo Timer
        hide: >
          [[[ if (entity.state != "unavailable") return false; else return true
          ]]]

DBuit · January 15, 2021, 2:40pm

Can you check in developer tools if the entity has a device_class? and if it is timestamp

and check chrome dev tools console maybe there is an error?

and you installed the beta version? 0.5.9.1?

haseat · January 15, 2021, 2:50pm

My bad, I didn’t have the beta version. Installed it, works (in principle)

Two things:

the displayed time is wrong (I set an timer for one hour, local time here is 15:50), I suppose that’s some timezone problem
the text from the config is being translated to uppercase

Greetings
Robert

DBuit · January 15, 2021, 2:55pm

Can you try without the diff set to true, just to see if it display the right date time?

haseat · January 15, 2021, 4:01pm

      - entity: sensor.livingroom_echo_next_timer
        timestampFormat: '[in ]h [hour(s)] m [minutes]'
        timestampDiff: true        
        name: with timestampDiff
        wider: true
      - entity: sensor.livingroom_echo_next_timer
        timestampFormat: '[in ]h [hour(s)] m [minutes]'      
        name: without timestampDiff
        wider: true

local time: 17:00

capstan1 · January 15, 2021, 4:21pm

Hey @DBuit!
I made the feature request for sliders a whole time ago, which you kindly integrated within days! Thanks again for this. If got some problems when combining it with the “wider” option, described here.
Maybe you have some ideas how to get this to work properly?

Jimmy_Berglund · January 15, 2021, 8:03pm

Ignore what i said ^^