Timer Bar Card (+ Mushroom Style)

[rianadon]

Hey! I’d like to share the card I made for timers (and anything which has a timer like washing machines, alarms, and sous vide cookers). It’s 2 years old now but it’s never too late to make a forum post about it, right? It’s not like there’s a timer ticking…

I’ve seen a couple posts here asking how to make Mushroom cards show the time remaining for a timer. I realized that styling the card to make it match the look of the Mushroom cards wouldn’t take too much work (definitely way easier than working with timers), especially since Mushroom is also open source. Thus I’ve added a new configuration to turn the card into a mushroom.

You also don’t need a timer. The card can figure out the timer duration from other entities (even scripts) or be set in the configuration.

Thank you to everyone who’s given feedback on the project and contributed code. Have a great time with the card!

[finity]

I’ve had your card installed for a while but completely forgot about it until you just mentioned it here. so thanks for the reminder as I literally just found a good use for it.

but I’d like a FR that I don’t see how to accomplish unless I’m missing it somewhere.

Is it possible to change the name of the entity?

I have a switch that turns on for a duration set by an input number and the resulting entity name is way too long to fit in the single line for the progress bar so I’d like to change the label for the progress bar.

here’s an example with the entity name used:

If I use “layout: full_row” I get this strange looking blank row with just the state:

I’d like to rename the entity in just this row to something like “progress”, “time left”, etc.

is that possible?

[rianadon]

Yes it is. Sorry I completely forgot about adding an example for configuring an individual row. You can override each row individually, like

type: custom:timer-bar-card
entities:
  - timer.alarm
  - entity: timer.alarm_two
    name: "Special Name"
  - timer.alarm_three

The full_row layout will show just the state if the entity is off and only the progress bar if the entity is on.

Hope that helps! That’s sweet-looking irrigation dashboard you’re building.

[finity]

Awesome! Thanks!

I also figured out I can define the icon and if I make it a blank icon it removes the icon completely.

now it looks exactly like I want:

The buttons I’m using are from my own plugins. That one specifically is my binary control button row. I have several more at my github that are used for various other functions to complete the “theme”.

[rianadon]

Wow nice! The buttons look similar to the paper buttons row plugin, but you have some extra features for those on/off entities.

[finity]

Mine were first.

[alexeiw123]

Like the style of this, thanks.
Is there a way to get the paused state to show as a static bar with time remaining, rather than ‘paused’?

I tried defining ‘paused’ as a state for active, but it shows the bar counting down, when really it’s not.

Also, is there a way that I could make this bar really skinny, or even combine it with the mushroom light card that it’s associated with?

[rianadon]

You’re welcome! I’ll consider showing the progress bar when paused. The drawback is that not every type of entity that works with the card right now would be able to show that static bar. start_time and end_time alone wouldn’t be enough: there would also need to be a paused_time option so the card knows how long ago the timer was paused. Or there could be an attribute showing how much time was left when it was paused.

What you’ve shown is the skinniest you can make it. There’s no way to combine it with the light card, although that would be very cool.

[alexeiw123]

Thanks for the response.

I was able to use the included options, tweak the card size with ‘card_mod’ and use conditional cards to show/hide under the conditions that I want. Doing this I’ve got a minimal view that suits my needs for our motion activated, time-out kitchen downlighting.

[AldoQ (Aldo Quispel)]

I came across this card looking for a progress bar and it looks great from the documentation. I am however stuck or it may not support this.

I wanted to use it for my Dishwasher. It’s a Miele and it uses Home Connect and I have two sensors that may be useful for this. One being the end time and the other being the program_progress. But I have no start-time like in the example for Miele washingmachine with the dishwasher. The program_progress is truly a percentage that goes up from 0 to 100 as the cycle goes on. So I thought it may be easy to use the program_progress. I however don’t get how to use it. For example to say the duration is not a time but “100”.

Any ideas or help would be welcome.

[ZOXSOCKS (ZOX)]

Hi there!

This looks fantastic and looks like what I’m after.

I recently got a Candy Smart Fi washer-dryer (Integration is here: GitHub - ofalvai/home-assistant-candy: Unofficial Candy/Haier appliance integration for Home Assistant), and it exposes the remaining time until a cycle is completed in minutes.

I have it set up thus far:

type: custom:timer-bar-card
entity:
  - sensor.wash_cycle_remaining_time
resolution: h:m
mushroom:

This does create a card with a time remaining, but it does not display any kind of bar, just a numerical value, like this:

I’ve poured through the documents on your Git (which is really clear, thank you!) but I can’t really see anything that would force a bar to appear.

Am I missing something?

Thank you.