So close getting a cool "garage open/closed icon"

Configuration Frontend
1

Hi all

Im feeling so close to have the correct and cool icon so i can see if my garage door is closed or open. But i got a problem i hope you can help with :slight_smile:

The yaml is (Thanks for gimini and chatgpt ) :slight_smile:

type: custom:button-card
entity: switch.shelly_hojre_garage_port # Assuming this is your right garage door switch
name: Right Garage Door
show_state: false

tap_action:
  action: call-service
  service: switch.toggle
  service_data:
    entity_id: switch.shelly_hojre_garage_port
  
  # Conditional confirmation based on the sensor state
  confirmation:
    text: >
      [[[
        var contact_state = states['binary_sensor.garage_sensor_hojre_contact'].state;
        
        if (contact_state == 'off') {
          return 'Are you sure you want to **OPEN** the right door?';
        } else if (contact_state == 'on') {
          return 'Are you sure you want to **CLOSE** the right door?';
        } 
      ]]]

icon: mdi:garage
color: green                     # <-- Default color is GREEN
color_type: icon

state:
  # đź”´ STATE 1: GARAGE DOOR OPEN (ON)
  # This state overrides the default color and icon when the sensor is "on"
  - entity_id: binary_sensor.garage_sensor_hojre_contact
    value: "on"
    color: red                   # <-- Becomes RED when "on"
    icon: mdi:garage-open
    styles:
      icon:
        - animation: blink 1.5s infinite alternate
  
  # 🟢 STATE 2: GARAGE DOOR CLOSED (OFF)
  # This state enforces GREEN, even though it matches the default color
  - entity_id: binary_sensor.garage_sensor_hojre_contact
    value: "off"
    color: green
    icon: mdi:garage

But i when the garage door is finish “opening” it changes to “green”
Is it not possible to just have it “red” when the sensor is “on”?

I little confusion that the state is “on” and “off” but i Z2M it is “contact”: true og false.

image
image1011Ă—552 7.15 KB

Thanks!

2
3

Check the developer tools what sensors you have.
Then check the state and attributes of those sensors when the door is closed, closing, opening and open.
These values will tell you what is possible to achieve in relation to the automation.

4

But i only have “on” and “off” :slight_smile:
But my problem is that it changes back to “green closed” when the shelly is done after 30 sec.

5

Ah got this working!

type: custom:button-card
entity: binary_sensor.garage_sensor_hojre_contact
name: Højre garageport
show_state: false
tap_action:
  action: call-service
  service: switch.toggle
  service_data:
    entity_id: switch.shelly_hojre_garage_port
  confirmation:
    text: |
      [[[ 
        var contact_state = states['binary_sensor.garage_sensor_hojre_contact'].state;
        if (contact_state == 'off') {
          return 'Er du sikker på, at du vil **ÅBNE** højre port?';
        } else {
          return 'Er du sikker på, at du vil **LUKKE** højre port?';
        } 
      ]]]
icon: mdi:garage
color_type: icon
state:
  - value: "on"
    color: red
    icon: mdi:garage-open
    styles:
      icon:
        - animation: pulse 1.5s infinite
  - value: "off"
    color: green
    icon: mdi:garage
    styles:
      icon:
        - animation: none
styles:
  card:
    - transition: all 0.3s ease
extra_styles: |
  @keyframes pulse {
    0% { transform: scale(1); }
    50% { transform: scale(1.1); }
    100% { transform: scale(1); }
  }