GarageDoorButton: a simple widget to display status of a garage door and a button to activate its operation

Header

A simple widget showing the status of a garage door (opened or closed) and a single button for activating the door’s operation.

The widget offers the following configuration options:

  • Control Item: control Item to operate the gates.
  • Command: the command to be sent to the Control Item on activation.
  • Sensor Item: sensor Item to determine the gates open/close status.
  • Sensor state when closed: The state of the Sensor Item when the door is closed. Any other state than closed or moving will be interpreted as opened.
  • Sensor state when moving: The state of the Sensor Item when the door is moving. Any other state than closed or moving will be interpreted as opened.
  • Title: text to show as title.
  • Button Label: text to show on the button.
  • Open Label: text to show on the status indicator if the gate is open.
  • Moving Label: text to show on the status indicator while the gate is moving.
  • Closed Label: text to show on the status indicator if the gate is closed.

Screenshots

The status badge when the door is opened:

Widget - Open

The configuration:

Changelog

Version 0.2

  • added support for an optional third state to be shown while the garage door/gates are for moving between open and close.

Version 0.1

  • initial release

Resources

The YAML code for the widget:

uid: GarageDoorButton
tags:
  - button
  - cell
  - garagedoor
  - status
props:
  parameters:
    - context: item
      description: Control Item to operate the gates.
      label: Control Item
      name: control_item
      required: true
      type: TEXT
      groupName: items
    - default: ON
      description: The command to be sent to the Control Item on activation.
      label: Command
      name: control_item_command
      required: true
      type: TEXT
      groupName: items
    - context: item
      description: Sensor Item to determine the gates open/close status.
      label: Sensor Item
      name: sensor_item
      required: true
      type: TEXT
      groupName: items
    - default: CLOSED
      description: The state of the Sensor Item when the door is closed. Any other state than closed or moving will be interpreted as opened.
      label: Sensor state when closed
      name: sensor_state_closed
      required: true
      type: TEXT
      groupName: items
    - default: MOVING
      description: The state of the Sensor Item when the door is moving. Any other state than closed or moving will be interpreted as opened.
      label: Sensor state when moving
      name: sensor_state_moving
      required: false
      type: TEXT
      groupName: items
    - default: Garage Door
      description: Text to show as title.
      label: Title
      name: title
      required: true
      type: TEXT
      groupName: labels
    - default: Activate
      description: Text to show on the button.
      label: Button Label
      name: button_label
      required: true
      type: TEXT
      groupName: labels
    - default: Open
      description: Text to show on the status indicator if the gate is open.
      label: Open Label
      name: open_label
      required: true
      type: TEXT
      groupName: labels
    - default: Moving
      description: Text to show on the status indicator when the gate is moving. Leave blank if your sensor item does not have a status for moving.
      label: Moving Label
      name: moving_label
      required: false
      type: TEXT
      groupName: labels
    - default: Closed
      description: Text to show on the status indicator if the gate is closed.
      label: Closed Label
      name: closed_label
      required: true
      type: TEXT
      groupName: labels
  parameterGroups:
    - name: items
      label: Items
    - name: labels
      label: Labels
timestamp: Jan 23, 2023, 2:25:48 PM
component: f7-card
config:
  title: =props.title
slots:
  default:
    - component: f7-block
      config:
        class: bog
        style:
          align-content: space-between
          align-items: center
          display: flex
          flex-wrap: wrap
          justify-content: flex-start
          padding: 10px
      slots:
        default:
          - component: oh-button
            config:
              color: '=(items[props.sensor_item].state == props.sensor_state_closed) ? "green" : ((items[props.sensor_item].state == props.sensor_state_moving) ? "yellow" : "red")'
              disabled: true
              fill: true
              outline: true
              style:
                margin: 10px
                opacity: 1 !important
                width: 100px
              text: "=(items[props.sensor_item].state == props.sensor_state_closed) ? props.closed_label : ((items[props.sensor_item].state == props.sensor_state_moving) ? props.moving_label : props.open_label)"
          - component: oh-button
            config:
              action: command
              actionCommand: =props.control_item_command
              actionItem: =props.control_item
              active: =(items[props.control_item].state === props.control_item_command)
              outline: true
              style:
                margin: 10px
                width: 100px
              text: =props.button_label
1 Like