Garagedoor

[rlkoshak (Rich Koshak)]

A garage door widget that shows the open/closed state of a garage door and allows one to trigger the garage door opener. Clicking on the widget will trigger the opener. The color, icon, and badge on the right indicates the current state of the door. The widget requires two Items, a Contact Item that indicates the open/closed status of the door and a Switch Item that, when it receives an ON command will trigger the garage door opener.

Screenshots

Changelog

Version 0.1

• initial release

Resources

uid: rlk_garagedoor_list
tags:
  - list
  - garagedoor
props:
  parameters:
    - description: Door name
      label: Name
      name: name
      required: false
      type: TEXT
    - context: item
      description: Control Item
      label: Control Item
      name: control_item
      required: false
      type: TEXT
    - context: item
      description: Sensor Item
      label: Sensor Item
      name: sensor_item
      required: false
      type: TEXT
  parameterGroups: []
component: oh-list-item
config:
  icon: '=(items[props.sensor_item].state == "CLOSED") ? "f7:house" : "f7:house_fill"'
  iconColor: '=(items[props.sensor_item].state == "CLOSED") ? "green" : "red"'
  title: =props.name
  action: command
  actionItem: =props.control_item
  actionCommand: ON
  badgeColor: '=(items[props.sensor_item].state == "CLOSED") ? "green" : "red"'
  badge: '=(items[props.sensor_item].state == "CLOSED") ? "closed" : "open"'

[the-ninth (Robert)]

Thanks for creating this nice little widget!

A useful extension would be to be able to configure the sensor state value that indicates that the door is closed. I took the liberty to extend the code:

uid: rlk_garagedoor_list
tags:
  - marketplace:126585
  - garagedoor
  - list
props:
  parameters:
    - description: Door name
      label: Name
      name: name
      required: true
      type: TEXT
    - context: item
      description: Control Item
      label: Control Item
      name: control_item
      required: true
      type: TEXT
    - context: item
      description: Sensor Item
      label: Sensor Item
      name: sensor_item
      required: true
      type: TEXT
    - description: The state of the sensor item when the door is closed
      label: Sensor state when closed
      name: sensor_state_closed
      required: true
      type: TEXT
  parameterGroups: []
component: oh-list-item
config:
  icon: '=(items[props.sensor_item].state == props.sensor_state_closed) ? "f7:house" : "f7:house_fill"'
  iconColor: '=(items[props.sensor_item].state == props.sensor_state_closed) ? "green" : "red"'
  title: =props.name
  action: command
  actionItem: =props.control_item
  actionCommand: true
  badgeColor: '=(items[props.sensor_item].state == props.sensor_state_closed) ? "green" : "red"'
  badge: '=(items[props.sensor_item].state == props.sensor_state_closed) ? "closed" : "open"'

[the-ninth (Robert)]

I also have a question: when I use this widget in a cell, then the name of the door will be displayed in red, even if the door is closed and everything else is green. I did not find any config in the oh-list-item to set the text color. Is there a way to adapt it anyway?

When editing the page, the text is actually still displayed in black:

But then when showing the page, it is red:

[rlkoshak (Rich Koshak)]

@the-ninth

I took the liberty to extend the code:

I’ll add it to my list of todos to update the original with this enhancement.

@the-ninth

when I use this widget in a cell

That’s not a place this widget can be used. It’s a list item widget. It can only be used as an entry in a list card, not on its own or in a cell. The behavior of a list item widget used outside of that context is somewhat undefined and almost always not what you expect or desirable.

@the-ninth

But then when showing the page, it is red:

I suspect somewhere outside of the widget the font color is being set to red, or maybe red is the default font color or something.

That being said, all widgets support a style section where you can adjust the CSS properties of the widget. Under config adding a style and under that color: black I think should work.

config:
  style:
    color: black
  icon: ...

[the-ninth (Robert)]

@rlkoshak

That’s not a place this widget can be used. It’s a list item widget. It can only be used as an entry in a list card, not on its own or in a cell. The behavior of a list item widget used outside of that context is somewhat undefined and almost always not what you expect or desirable.

Ah, understand, thanks! I am just starting out with looking at the UI stuff so I was not aware of that difference.

[the-ninth (Robert)]

I have now created a similar widget, which can be used as standalone or cell widget. It shows the status in a badge and displays a button for activating the garage doors operation.

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 wil…

[Schultz007 (Chris Schultz)]

Hello
I used this widget for the first time; I linked it to the corresponding items, but I always get the message “Communication failed”.
What could be the reason?

Many thanks for the tips.