phrz/lg-washer-dryer-card

Lovelace cards for use with the Home Assistant LG ThinQ Integration

lg-washer-dryer-card's Issues

Instruction Improvement

I think it would be worth adding a note to the setup instructions that if "Manage Resources" does not show up, the user will have to make sure they turn on Advanced Mode in their user profile. This had be stumped for awhile till I found this post https://community.home-assistant.io/t/adding-resources-to-lovelace/180729

Unable to get images to display properly

I’ve gotten the the washer and dryer cards added. However, the images don't appear correctly:

The images are saved in this directory per the instructions:

What's interesting is that the dryer image shows but all others do not. I went back into washer-card.yaml and dryer-card.yaml to made sure all images reference the same directory path.

[BUG] 7segment font not used in iOS

Describe the bug
The washer and dryer cards are working fine except when viewing the card in the Home Assistant app for my iOS device, the 7segment font used for the timer display is not used; seems like just a regular font. Works fine in both desktop and microsoft edge for iOS browsers, and even though the font is incorrect, the remaining time does display correctly.

What I have tried (required)

• I checked what the entity name of my washer/dryer/machine is, and it either matches what's in the default configuration (i.e. sensor.washer, sensor.dryer) or, if it's different, I've modified both configuration.yaml and the Lovelace configuration for this card to make it match.
• My LG account is in English, and the state names returned by the LG ThinQ integration are in English, or I've gone through configuration.yaml and the Lovelace configuration to change the state tests to the appropriate state strings in my language.
• If my washer/dryer does not look like the one in the default card picture, I've checked that the state names returned by my machine matches the ones in the code, such as showing a hyphen ('-') as the run_state entity value when the machine is not running.

Screenshots
Sensors:

HA iOS App Cards

HA Desktop Browser App Cards

iOS MS Edge Cards

Template Configuration

- name: washer_door_lock
    #friendly_name: "Washer Door Lock"
    state: "{{ state_attr('sensor.washer','child_lock') }}"

  - name: washer_time_display
    #friendly_name: "Washer Time Display"
    state: >
      {% if is_state('sensor.washer_run_state', '-') %}
      {% elif is_state('sensor.washer_run_state', 'unavailable') %}
      {% elif is_state('sensor.washer_run_state', 'Standby') %}
        -:--
      {% else %}
        {{ state_attr("sensor.washer","remain_time").split(":")[:-1] | join(':') }}   
      {% endif %}
  
  - name: dryer_time_display
    #friendly_name: "Dryer Time Display"
    state: >
        {% if is_state('sensor.dryer_run_state', '-') %}
        {% elif is_state('sensor.dryer_run_state', 'unavailable') %}
        {% elif is_state('sensor.dryer_run_state', 'Standby') %}
          -:--
        {% else %}
          {{ state_attr("sensor.dryer","remain_time").split(":")[:-1] | join(':') }}
        {% endif %}

  - name: blank
    #friendly_name: "Blank Sensor"
    state: ""

Card Configuration

type: picture-elements
elements:
  - type: image
    entity: sensor.washer_run_state
    image: /hacsfiles/lg-wash-dry-card/lg-icons/sensing.png
    state_image:
      Detecting: /hacsfiles/lg-wash-dry-card/lg-icons/sensing-on.png
    style:
      top: 33%
      left: 33%
      width: 20%
      image-rendering: crisp
  - type: image
    entity: sensor.washer_run_state
    image: /hacsfiles/lg-wash-dry-card/lg-icons/wash.png
    state_image:
      Washing: /hacsfiles/lg-wash-dry-card/lg-icons/wash-on.png
    style:
      top: 33%
      left: 51%
      width: 20%
      image-rendering: crisp
  - type: image
    entity: sensor.washer_run_state
    image: /hacsfiles/lg-wash-dry-card/lg-icons/rinse.png
    state_image:
      Rinsing: /hacsfiles/lg-wash-dry-card/lg-icons/rinse-on.png
    style:
      top: 33%
      left: 69%
      width: 20%
      image-rendering: crisp
  - type: image
    entity: sensor.washer_run_state
    image: /hacsfiles/lg-wash-dry-card/lg-icons/spin.png
    state_image:
      Spinning: /hacsfiles/lg-wash-dry-card/lg-icons/spin-on.png
    style:
      top: 33%
      left: 87%
      width: 20%
      image-rendering: crisp
  - type: image
    entity: sensor.washer
    image: /hacsfiles/lg-wash-dry-card/lg-icons/wifi.png
    state_image:
      'on': /hacsfiles/lg-wash-dry-card/lg-icons/wifi-on.png
    style:
      top: 73%
      left: 32%
      width: 10%
      image-rendering: crisp
  - type: image
    entity: sensor.washer_door_lock
    image: /hacsfiles/lg-wash-dry-card/lg-icons/lock.png
    state_image:
      'on': /hacsfiles/lg-wash-dry-card/lg-icons/lock-on.png
    style:
      top: 73%
      left: 45%
      width: 10%
      image-rendering: crisp
  - type: state-label
    entity: sensor.blank
    prefix: '18:88'
    style:
      color: '#555'
      font-family: segment7
      font-size: 50px
      left: 95%
      top: 74%
      transform: translate(-100%,-50%)
  - type: state-label
    entity: sensor.washer_time_display
    style:
      color: '#8df427'
      font-family: segment7
      font-size: 50px
      left: 95%
      top: 74%
      transform: translate(-100%,-50%)
image: /hacsfiles/lg-wash-dry-card/hass-washer-alt-card-bg.png

State_Image not showing, if dryer/washer is configured in a language different from english.

I found, that the dryer .yaml and washer .yaml template files, had to be changed for the state images to work. Might be a good thing to add to the description or maybe solve this in a different way.

In my local language (Danish) - Some state values, are in the local language, if the washer and/or dryer is setup in that language.

For the dryer, i changed the state values in the yaml from:
Drying -> Tørrer
Cooling -> Køler

For the washer i changed:
Washing -> Vasker
Rinsing -> Skyller
Spinning -> Centrifugerer

I could not find an event for "Sensing" for my washer. It does have this feature, but the log never showed a value for this.

Sensor Missing

I think there might be an error within the washer-card.yaml & dryer-card.yaml. On line 46 of the dryer card it calls for entity "sensor.dryer_time_display" but there is none. I switched mine to "sensor.dryer_remaining_time" and it works, but there is an yellow explanation mark in a triangle behind the time, don't know if one thing has to do with the other.

I see in the configuration.yaml, there appears to be entities setup for them, but they don't show under Integrations, LGE Devices, Entities, Here is my configuration.yaml

`- platform: template
sensors:
washer_door_lock:
friendly_name: "Washer Door Lock"
value_template: "{{ state_attr('sensor.front_load_washer','door_lock') }}"

washer_time_display:
  friendly_name: "Washer Time Display"
  value_template: >
    {% if is_state('sensor.front_load_washer_run_state', '-') %}
    {% elif is_state('sensor.front_load_washer_run_state', 'Standby') %}
      -:--
    {% else %}
      {{ as_timestamp(strptime(state_attr('sensor.front_load_washer', 'remain_time'), '%H:%M:%S')) | timestamp_custom('%-H:%M') }}
    {% endif %}

dryer_time_display:
  friendly_name: "Dryer Time Display"
  value_template: >
      {% if is_state('sensor.dryer_run_state', '-') %}
      {% elif is_state('sensor.dryer_run_state', 'Standby') %}
        -:--
      {% else %}
        {{ as_timestamp(strptime(state_attr('sensor.dryer', 'remain_time'), '%H:%M:%S')) | timestamp_custom('%-H:%M') }}
      {% endif %}

      blank:
  friendly_name: "Blank Sensor"
  value_template: ""`

trouble setting up card(s)

I keep getting complaints about "bad mapping of an entity" on the first line of either the washer or dryer card.

The instructions tell me to rename sensor.washer (and some other sensors) to corresponding entity IDs or run state sensors. Can you provide some examples?

Add icon in French

Hello,
it's possible to add French icon for

Sensing = Pesée
wash = Lavage
spin = Essorage
Rinse = Rinçage

Thank you

HACs compatible

Any way to make this HACs compatible?

README.md image links are b0rked

There are two embedded images at the top of the README.md which don't load.

Currently they display this text:
![IMG_1843 2](https://user-images.githubusercontent.com/2007088/112699616-35751b00-8e5a-11eb-9bf8-cc09af4847a9.PNG | width=100) ![MiniWasher](https://user-images.githubusercontent.com/3220618/136715514-d1cb86ac-4278-4012-b7d5-25300a313fcf.png | width=100) ![DishWasher](https://user-images.githubusercontent.com/3220618/138618307-c7b6a9f0-073e-44df-a70a-8c0acbcb033b.png | width=100)

Most of the forks of this project that are 14 commits behind display the images properly; other forks which are two commits behind have the same problem.

remain_time or reserve_time?

Thanks for the update to fix the time issue - the new changes work great.
However, I'm wondering whether we should be using reserve_time instead of remain_time in washer_time_display.
The reason I suggest it is if you use the Time Delay feature on your Washer, the display shows "Time to end" including the delay time.
If we want the card to mimic the actual washer display, then I think we should be using reserve_time.

Power usage information

The app has the power usage info, is it possible to get this info as an entity?

How do I remove this error logo from the cards? I don't have any errors with the integration so not sure why they're there.

Multiple images not showing u p

Have I missed an image?

Please let me know what I am doing wrong.

Feature request: Child lock icons/status

Thanks for a beautiful card, it looks great on the kitchen display.

one thing I would love to see is the child-lock status at a glance when my 2yr old disappears for more than 10seconds!

Following the way you created the other template sensors I created this

washer_child_lock:
  friendly_name: "Washer Child Lock"
  value_template: "{{ state_attr('sensor.washer','child_lock') }}"

and can see how to update the card to display the icons, that's pretty simple

Are you able to create some icons in the same style and colors of the others? I can't seem to figure out transparency

Format time from 0:00:00 to -:–:– for washer when complete and system is off

When the unit is no longer washing and the status is off, the remaining time should reset to -:--:-- indicating that it's completely done? Would be different than no time remaining, it's done.

Pictures disappeared in Lovelace

Hi.

First of all thanks for this awesome work!
I ran into a problem after updating HA. The connection is still there but it wont show the pictures in vertical stack.
I've tried to restore the backup and then pictures show perfectly again. I loved this integration to my dashboard and now its a bit crumpled without the beautyness of the pictures and icons.
Can you come up with any idea or maybe changed been made to the vertical stack card that created this problem?
Like I said, connection is still there, showing all the data, but just not possible to see the picture of eg. hass-fl-washer-steel-card-bg or any of the icons anymore.

If you need further from me please write me. first time I'm creating an issue here.

Still can't get remaining time to be -:-- when state is Off/Standby/-

@phrz - I've reset the Wifi and now the card is much closer to correct and updates at regular intervals - Thanks!

However, the display is still not working. Please see screen shots below:

I've made the changes to the sensor in config.yml

• platform: template
  sensors:
  washer_door_lock:
  friendly_name: "Washer Door Lock"
  value_template: "{{ state_attr('sensor.front_load_washer','door_lock') }}"

  washer_time_display:
  friendly_name: "Washer Time Display"
  value_template: >
  {% if is_state('sensor.front_load_washer_run_state', '-') %}
  {% elif is_state('sensor.front_load_washer_run_state', 'Off') %}
  {% elif is_state('sensor.front_load_washer_run_state', 'Standby') %}
  -:--
  {% else %}
  {{ state_attr("sensor.front_load_washer","remain_time").split(":")[:-1] | join(':') }}
  {% endif %}

Still no joy! :(

Can't get the font to display properly

Hi,

I've tried to reconfigure this many times.
I can't get the 7segment font to display - it only displays some default font which looks ugly.
Does anyone have any ideas on how can I properly set this font up and/or how to debug this issue?

Best regards
Szafran

Feature request: Display hh:mm only for time remain

Hi, thanks for the awesome integration. I had a LG washer F2515RTGV which will output 'hh:mm:ss'. Is there away to remove the display of 'ss' ?

Everything works except the font

Not sure if it's just me, but I got everything to work except the "digital clock" style font. Any assistance would be appreciated.

type: vertical-stack
cards:

• type: picture-elements
  elements:
  • type: image
    entity: sensor.front_load_washer_run_state
    image: local/community/lg-washer-card/lg-icons/sensing.png
    state_image:
    Detecting: local/community/lg-washer-card/lg-icons/sensing-on.png
    style:
    top: 33%
    left: 33%
    width: 20%
    image-rendering: crisp
  • type: image
    entity: sensor.front_load_washer_run_state
    image: local/community/lg-washer-card/lg-icons/wash.png
    state_image:
    Washing: local/community/lg-washer-card/lg-icons/wash-on.png
    style:
    top: 33%
    left: 51%
    width: 20%
    image-rendering: crisp
  • type: image
    entity: sensor.front_load_washer_run_state
    image: local/community/lg-washer-card/lg-icons/rinse.png
    state_image:
    Rinsing: local/community/lg-washer-card/lg-icons/rinse-on.png
    style:
    top: 33%
    left: 69%
    width: 20%
    image-rendering: crisp
  • type: image
    entity: sensor.front_load_washer_run_state
    image: local/community/lg-washer-card/lg-icons/spin.png
    state_image:
    Spinning: local/community/lg-washer-card/lg-icons/spin-on.png
    style:
    top: 33%
    left: 87%
    width: 20%
    image-rendering: crisp
  • type: image
    entity: sensor.front_load_washer
    image: local/community/lg-washer-card/lg-icons/wifi.png
    state_image:
    'on': local/community/lg-washer-card/lg-icons/wifi-on.png
    style:
    top: 73%
    left: 32%
    width: 10%
    image-rendering: crisp
  • type: image
    entity: sensor.front_load_washer_door_lock
    image: local/community/lg-washer-card/lg-icons/lock.png
    state_image:
    'on': local/community/lg-washer-card/lg-icons/lock-on.png
    style:
    top: 73%
    left: 45%
    width: 10%
    image-rendering: crisp
  • type: state-label
    entity: sensor.front_load_washer_remaining_time
    style:
    color: '#8df427'
    font-family: 7segment
    font-size: 35px
    left: 95%
    top: 74%
    transform: translate(-100%,-50%)
    image: local/community/lg-washer-card/hass-combo-card-bg.png
• type: conditional
  conditions:
  • entity: sensor.front_load_washer_run_state
    state_not: '-'
    card:
    type: entities
    entities:
    • entity: sensor.front_load_washer
      type: attribute
      attribute: current_course
      name: Current Course
      icon: mdi:tune-vertical-variant
    • entity: sensor.front_load_washer
      type: attribute
      attribute: water_temp
      name: Water Temperature
      icon: mdi:coolant-temperature
    • entity: sensor.front_load_washer
      type: attribute
      attribute: spin_speed
      name: Spin Speed
      icon: mdi:rotate-right
      state_color: false

Card showing invalid status?

Hello,

Running the 31.3 LG integration and card is showing interesting things. First, I can't get the unit to show it's off/finished. The Wifi or sensing icon is on and the current course is really the last course it did. It is still showing 0:00:00 as the remaining time even though the unit is off? I must be stepping on something but not sure what. Not sure where to edit but I don't want to make it worse. This is an excellent integration - appreciate your hard work!

Please help!

p.s. - had to use a different font because the one you had referenced wasn't working for me for some reason - just fyi.

config.yml excerpt:
sensor:

• platform: template
  sensors:
  washer_door_lock:
  friendly_name: "Washer Door Lock"
  value_template: "{{ state_attr('sensor.front_load_washer','door_lock') }}"

  washer_time_display:
  friendly_name: "Washer Time Display"
  value_template: >
  {% if is_state('sensor.front_load_washer_run_state', 'Finished') %}
  {% elif is_state('sensor.front_load_washer_run_state', 'Standby') %}
  -:--
  {% else %}
  {{ state_attr('sensor.front_load_washer', 'remain_time') }}
  {% endif %}

  blank:
  friendly_name: "Blank Sensor"
  value_template: ""

Template card:
type: vertical-stack
cards:

• type: picture-elements
  elements:
  • type: image
    entity: sensor.front_load_washer_run_state
    image: local/community/lg-washer-card/lg-icons/sensing.png
    state_image:
    Detecting: local/community/lg-washer-card/lg-icons/sensing-on.png
    style:
    top: 33%
    left: 33%
    width: 20%
    image-rendering: crisp
  • type: image
    entity: sensor.front_load_washer_run_state
    image: local/community/lg-washer-card/lg-icons/wash.png
    state_image:
    Washing: local/community/lg-washer-card/lg-icons/wash-on.png
    style:
    top: 33%
    left: 51%
    width: 20%
    image-rendering: crisp
  • type: image
    entity: sensor.front_load_washer_run_state
    image: local/community/lg-washer-card/lg-icons/rinse.png
    state_image:
    Rinsing: local/community/lg-washer-card/lg-icons/rinse-on.png
    style:
    top: 33%
    left: 69%
    width: 20%
    image-rendering: crisp
  • type: image
    entity: sensor.front_load_washer_run_state
    image: local/community/lg-washer-card/lg-icons/spin.png
    state_image:
    Spinning: local/community/lg-washer-card/lg-icons/spin-on.png
    style:
    top: 33%
    left: 87%
    width: 20%
    image-rendering: crisp
  • type: image
    entity: sensor.front_load_washer
    image: local/community/lg-washer-card/lg-icons/wifi.png
    state_image:
    'on': local/community/lg-washer-card/lg-icons/wifi-on.png
    style:
    top: 73%
    left: 32%
    width: 10%
    image-rendering: crisp
  • type: image
    entity: sensor.front_load_washer_door_lock
    image: local/community/lg-washer-card/lg-icons/lock.png
    state_image:
    'on': local/community/lg-washer-card/lg-icons/lock-on.png
    style:
    top: 73%
    left: 45%
    width: 10%
    image-rendering: crisp
  • type: state-label
    entity: sensor.front_load_washer_remaining_time
    style:
    color: '#8df427'
    font-family: DJBGetDigital
    font-weight: normal
    font-size: 48px
    left: 95%
    top: 74%
    transform: translate(-100%,-50%)
    image: local/community/lg-washer-card/hass-combo-card-bg.png
• type: conditional
  conditions:
  • entity: sensor.front_load_washer_run_state
    state_not: '-'
    card:
    type: entities
    entities:
    • entity: sensor.front_load_washer
      type: attribute
      attribute: current_course
      name: Current Course
      icon: mdi:tune-vertical-variant
    • entity: sensor.front_load_washer
      type: attribute
      attribute: water_temp
      name: Water Temperature
      icon: mdi:coolant-temperature
    • entity: sensor.front_load_washer
      type: attribute
      attribute: spin_speed
      name: Spin Speed
      icon: mdi:rotate-right
      state_color: false

Wash status is not displayed

Hello all,

Unfortunately, the washing status is not displayed on the Virtual Dislpay.

Here is my code:

#LG washing machine YAML:

sensor:

• platform: template
  sensors:
  washer_door_lock:
  friendly_name: "Washer Door Lock"
  value_template: "{{ state_attr('sensor.washer','door_lock') }}"

  washer_time_display:
  friendly_name: "Washer Time Display"
  value_template: >
  {% if is_state('sensor.washer_run_state', '-') %}
  {% elif is_state('sensor.washer_run_state', 'Standby') %}
  -:--
  {% else %}
  {{ state_attr('sensor.washing_machine', 'remain_time') }}
  {% endif %}

  blank:
  friendly_name: "Blank Sensor"
  value_template: ""

Card Code:

type: picture-elements
elements:

• type: image
  entity: sensor.washing_machine_run_state
  image: /local/lg-icons/dry.png
  state_image:
  Drying: /local/lg-icons/dry-on.png
  style:
  top: 73%
  left: 59
  width: 10%
  image-rendering: crisp
• type: image
  entity: sensor.washing_machine_run_state
  image: /local/lg-icons/cool.png
  state_image:
  Cooling: /local/lg-icons/cool-on.png
  style:
  top: 73%
  left: 67
  width: 10%
  image-rendering: crisp
• type: image
  entity: sensor.washing_machine_run_state
  image: /local/lg-icons/sensing.png
  state_image:
  Detecting: /local/lg-icons/sensing-on.png
  style:
  top: 33%
  left: 33%
  width: 20%
  image-rendering: crisp
• type: image
  entity: sensor.washing_machine_run_state
  image: /local/lg-icons/wash.png
  state_image:
  Washing: /local/lg-icons/wash-on.png
  style:
  top: 33%
  left: 51
  width: 20%
  image-rendering: crisp
• type: image
  entity: sensor.washing_machine_run_state
  image: /local/lg-icons/rinse.png
  state_image:
  Rinsing: /local/lg-icons/rinse-on.png
  style:
  top: 33%
  left: 69
  width: 20%
  image-rendering: crisp
• type: image
  entity: sensor.washing_machine_run_state
  image: /local/lg-icons/spin.png
  state_image:
  Spinning: /local/lg-icons/spin-on.png
  style:
  top: 33%
  left: 87%
  width: 20%
  image-rendering: crisp
• type: image
  entity: sensor.washer
  image: /local/lg-icons/wifi.png
  state_image:
  'on': /local/lg-icons/wifi-on.png
  style:
  top: 73%
  left: 32
  width: 10%
  image-rendering: crisp
• type: image
  entity: sensor.washer_door_lock
  image: /local/lg-icons/lock.png
  state_image:
  'on': /local/lg-icons/lock-on.png
  style:
  'top': 73%
  left: 45
  width: 10%
  image-rendering: crisp
• type: state-label
  entity: sensor.blank
  prefix: '18:88'
  style:
  colour: '#555'
  font-family: segment7
  font-size: 50px
  left: 95%
  top: 74%
  transform: translate(-100%,-50%)
• type: state-label
  entity: sensor.washer_time_display
  style:
  colour: '#8df427'
  font-family: segment7
  font-size: 50px
  left: 95%
  top: 74%
  transform: translate(-100%,-50%)
  image: /local/hass-combo-card-bg.png

Icon/Image Source - Are there more?

Did you make the icons and image yoruself from scratch, or are they sourced from LG somewhere?

Reason I ask is I'm adapting the card to work with the LG Dish Washers with ThinQ. I just got a brand new dish-washer today, and I'm actually able to get a functional card (which I can contribute back here when completed if you want to expand this to cover more ThinQ devices), but of course with the washing-machine images.

States are very similar to the washing machine:

• Drying
• Washing
• Rinsing

And instead of "door lock", the door is tracked as Open/Close, so an icon for that would be good too.

Card Backgrounds for WM4000HWA and DLEX4000W

Not sure the best spot for this, but I've made some quick-and-dirty card backgrounds for the WM4000HWA washer and DLEX4000W dryer:

Add this repository to HACS

You've done great work on this cards, I really like these Lovelace cards! Have you considered to add your repo to HACS or adjust the folder structure, so one can install it manually using HACS? I guess this would make it accessible for many more people.

Seconds are displayed now

Since changes to the LG thinQ integration the 7 segment display now shows seconds and doesn't look as good as it used to

it related to this breaking change..
ollo69/ha-smartthinq-sensors#257

Any idea's how to fix this?