Lovelace: Dark Thermostat (BETA)

novitibo · October 14, 2019, 7:28am

hello.
was there any changes in ha code recently, idle/heat status isn’t shown on card - no color changes.
my ui code:

                      - type: custom:thermostat-card
                        entity: climate.living_room_thermostat                    
                        step: 1    
                        highlight_tap: true
                        chevron_size: 100
                        hvac:
                          states:
                            'Off': 'off'
                            'Cooling': 'cool'
                            'Heating': 'heat'
                          attribute: operation_mode

au190 · November 7, 2019, 4:19pm

cdrom1028 · November 7, 2019, 7:30pm

will you be starting a new thread for this card specifically?

Se7enair · December 17, 2019, 10:47am

Is there an option to change the height?

daneboom · January 22, 2020, 11:06am

I’ve noticed that quite often the thermostat card doesn’t reflect the heating state or leaf state of the Nest. Recently this has been extra highlighted by the fact I’m currently and temporarily running two HA instances (connected to the same thermostat) while I try to manually upgrade to the latest version… this is such a large undertaking I couldn’t be without Home Assistant for the days while I get everything ready for the big switchover.

Anyway I’ve got HA instance one running at home on a Pi and HA instance two running at work on a Pi. But because Nest is hosted in the cloud they’re both able to collect the Nest info.

Weirdly, on my Home Pi, the thermostat card is currently showing current colouring and status for the fact my heating has been off for two hours.

dsasda

while my work Pi is showing a thermostat card giving every impression the heating is ON, when it isn’t.

dsadsad

Anyway as I say, I’ve noticed this before I was running two instances that the card sometimes doesn’t update the colour and the leaf to reflect the true state of the Nest - anyway I can help this? It’s not that the card isn’t aware of the correct underlying sensors, because as you can see, the temperature is correct and I’ve checked dev state and BOTH Pis know full well the thermostat is in " has leaf " mode.

.

Any tips welcome!!

EDIT I did some more reading and changed my lovelace config to add hvac status:

      - type: 'custom:thermostat-card'
        title: Thermostat
        entity: climate.upstairs
        chevron_size: 100
        hvac:
          states:
            'Off': 'off'
            Cooling: cool
            Heaing: heat
          attribute: operation_mode

this seems to have fixed the problem with incorrect colours, but now the leaf has gone! Not the end of the world, but strange, nonetheless.

Thanks!

hshir · May 9, 2020, 6:11pm

Hi all
Does anyone succeeded fixing the size of the card (without auto scaling)?
I’m trying to make mixed cards and the auto scale with this card is really a problem.
appreciate any help.

Nath · October 4, 2020, 1:19am

Hi guys, should be this card able to show “Auto” mode with two setpoints as shown in OP’s first post or not? I think it worked for me before but now i’m not able to manage that. Or am i going crazy?

dbrunt · November 6, 2020, 7:03pm

[au190] Thermostat card. Contribute to au190/au190_thermostat_card development by creating an account on GitHub.

HACS tells me this when I try to add your repository: “Repository is in the blacklist”

dbrunt · November 6, 2020, 7:20pm

I managed to get this added but…

I’m not seeing the display turning orange when in heating mode. My nest entity’s attributes are:

friendly_name: Living Room Nest Thermostat
entity_id: climate.living_room_nest_thermostat
unit_of_measure: °C
supported_features: 17
min_temp: 7
max_temp: 32
precision: 0.1
hvac_mode: heat
fan_mode: none
fan_timer_out: off
preset_mode: 
preset_modes: eco
hvac_modes: heat, off
current_temperature: 22.3
current_humidty: 46
hvac_action: heating
temperature: 24

My hvac_action options are ‘idle’ and ‘heating’
Card config:

type: 'custom:thermostat-card'
title: nest
entity: climate.living_room_nest_thermostat
step: 1
highlight_tap: true
chevron_size: 100
hvac:
  states:
    'Off': idle
    Cooling: cooling
    Heating: heating
  attribute: hvac_action

I’ve also tried:

hvac:
  states:
    idle: 'off'
    cooling: cool
    heating: heat
  attribute: hvac_action

dbrunt · November 10, 2020, 8:22am

Somehow I got the orange while heating to work…

ericp · November 20, 2020, 9:22pm

@dbrunt, how did you manage to change the color to orange? also, did you get yours from HACS? I got mine from HACS but it looks different because when I fill up the “title”, it appears inside the face of the thermostat, above the temperature. From the screenshots I see on here, the title should be outside the face of the thermostat.

ericp · November 20, 2020, 9:49pm

I uninstalled the one from HACS and manually copied the one from github and it’s working now.

dbrunt · November 21, 2020, 12:05am

Yes, the one in HACS is different: fineemb custom:thermostat-card. Too bad @ciotlosm doesn’t structure his repository with hacs.json so it could be added via HACS.

{
  "name": "Climate thermostat card",
  "render_readme": true,
  "filename":"main.js"
}

ciotlosm · November 21, 2020, 10:07am

I’ll have a look if I can make it work with hacs. Been busy times
I’ll try to post here once I have something working

ciotlosm · November 22, 2020, 2:44pm

This card is now managed in HACS. Latest refactoring found here: https://github.com/ciotlosm/lovelace-thermostat-dark-card

For those reporting bugs with state, this should be better supported out of the box, as the card now complies more with the standard hvac_action and action being heating & such.

Also for ‘leaf’ it uses preset_mode now with default triggers being eco and away.

cristi.costache · November 24, 2020, 10:51pm

Hi,

I want to use this implementation (only the graphics) with temperature and humidity sensors.
Is there any way to do that?

Cheers,

ciotlosm · November 25, 2020, 7:23am

Unfortunately this was built for climate entities. It would require too many mods to allow only temperature & humidity. Best would be to fork it and rebuild it, or to start over from the codepen source as a fresh card.

MaurizioB84 · November 25, 2020, 10:26pm

Hello,

how I can change the size of the card?

ciotlosm · December 3, 2020, 10:06pm

There should be a diameter property that you could use for sizing. Might not be as reliable, but you could give it a try.

github.com

ciotlosm/lovelace-thermostat-dark-card/blob/2362a1e8498207d692d62d453f9c8d22d5c3db92/src/thermostat-dark-card.ts#L114


if (!config) {
  throw new Error(localize('common.invalid_configuration'));
}

if (config.test_gui) {
  getLovelace().setEditMode(true);
}
// Prepare config defaults
const cardConfig = Object.assign({}, config);
cardConfig.hvac = Object.assign({}, config.hvac);
if (!cardConfig.diameter) cardConfig.diameter = 400;
if (!cardConfig.pending) cardConfig.pending = 3;
if (!cardConfig.idleZone) cardConfig.idleZone = 2;
if (!cardConfig.step) cardConfig.step = 0.5;
if (!cardConfig.highlight_tap) cardConfig.highlight_tap = false;
if (!cardConfig.chevron_size) cardConfig.chevron_size = 50;
if (!cardConfig.numTicks) cardConfig.numTicks = 150;
if (!cardConfig.tickDegrees) cardConfig.tickDegrees = 300;
if (!cardConfig.hvac.states)
  cardConfig.hvac.states = {
    idle: HVAC_IDLE,

Update: Apparently the diameter size is not working properly. There is an enhancement request to get this fixed, I will post here when resolved.

wideboys182 · December 5, 2020, 11:36am

Hi all, newbie here getting to grips with Home Assistant and very new to coding, yaml etc. so apologises if my questions are on the “dumb” side.

I have been able to add my Nest Thermostat to Home Assistant but come across this forum on making the Lovelace card look like the thermostat itself.

Is there a step by step guide on how to add this into my HA? Do I need to install HACS first to get this working?