Creating a kid friendly timer for my kids

Configuration
1

trying to get this time to display the right info when the timer is active and finishes. when it runs it says “undefined” for info. I followed this guy tutorial and cant seem to figure out what is wrong with the code.
(389) How to Create a Countdown Card in Home Assistant - YouTube

image
image812×413 14.2 KB


type: custom:button-card
entity: timer.kids_game_timer
show_entity_picture: true
name: Break Time
show_label: true
label: |
  [[[
    if (entity.state == "active")
      return (entity.attributes.current_course) + " / " + (entity.attributes.run_state) + "<br />" + 'Time left: ' + (entity.attributes.remaining);
    if (entity.state == "idle")
      return "Turned off"
  ]]]
styles:
  icon:
    - width: 30px
    - color: black
  img_cell:
    - justify-content: flex-start
    - margin-top: '-4px'
  card:
    - height: 130px
    - padding: 12px 0 12px 18px
  name:
    - justify-self: start
    - font-size: 12px
    - color: black
    - opacity: '0.5'
    - padding-top: 10px
  label:
    - justify-self: start
    - font-size: 14px
    - font-weight: 500
    - margin-bottom: 0px
    - text-align: left
    - padding-top: 5px
2

Timers don’t have attributes called current_course, remaining, or run_state. You have told it to provide you 3 pieces of information that don’t exist, and it is telling you it doesn’t have defined values for those variables.

You need to change the js template in the label section to return values that exist. If you explain what information you would like to have displayed we can help you update the configuration.

3

That video is using attributes from his washing machine. Not a timer.