Foldable menu using input boolean and conditional card

Share your Projects!
1

I was looking for a nice way to interact with my Raspberry Pi to quickly reboot services or shutdown/reboot the Pi. Before Lovelace I used an input_select element to trigger the actions. Yesterday I’ve fiddled around a bit and found a nice way to archieve this with a conditional card nested in a custom:vertical-stack-in-card. It’s basically a dropdown/foldable menu triggered by an input_boolean. It looks like this:

Dropdown
Dropdown505×629 52.4 KB

THE STEPS REQUIRED:

1. Create an input_boolean:

input_boolean:
  raspberrypi_menu:
  name: Services
  initial: off
  icon: mdi:menu-down-outline

2. Create a shell_command e.g. to shutdown the Pi:

shell_command:
  raspi_reboot: sudo shutdown -r now

3. Create a script to run the shell_command. For some reasons shell_commands cannot be run directly by ui-elements. So the script is a little workaround

script:
  raspi_reboot:
    alias: Pi Reboot
    sequence:
    - service: shell_command.raspi_reboot
    #  This part closes the foldable Menu after the tap_action was clicked in the HASS UI
    - service: input_boolean.turn_off
      data:
        entity_id: input_boolean.raspberrypi_menu

4. Nest all Elements inside a custom:vertical-stack-in-card. Please forgive me because I’m too lazy and will post the whole card including all nested cards:

- id: 12345  # Automatically created id
  type: custom:vertical-stack-in-card
  title: System
  cards:
    - type: picture-elements
      image: /local/entitypictures/raspberrypi.png
      elements:
        - type: custom:gauge-card
          entity: sensor.processor_use
          title: CPU
          scale: 26px
          severity:
            green: 0
            yellow: 60
            red: 85
          style:
            top: 24%
            left: 80%
            font-size: 100%
        - type: custom:gauge-card
          entity: sensor.memory_use_percent
          title: CPU
          scale: 26px
          severity:
            green: 0
            yellow: 60
            red: 85
          style:
            top: 68%
            left: 80%
            font-size: 100%
    - type: glance
      columns: 3
      entities:
        - entity: sensor.uptime
          name: Uptime
        - entity: sensor.last_boot_format
          name: Last Boot
        - entity: input_boolean.raspberrypi_menu
          tap_action: toggle
    - type: conditional
      conditions:
        - entity: input_boolean.raspberrypi_menu
          state: "on"
      card:
        type: glance
        columns: 3
        entities:
          - entity: script.hass_restart
            icon: mdi:home-assistant
            tap_action: toggle
          - entity: script.raspi_reboot
            icon: mdi:restart
            tap_action: toggle
          - entity: script.raspi_shutdown
            icon: mdi:power
            tap_action: toggle
          - entity: script.dasher_restart
            icon: mdi:radiobox-marked
            tap_action: toggle
          - entity: script.mosquitto_restart
            icon: mdi:cube-send
            tap_action: toggle
          - entity: script.gateway_restart
            icon: mdi:bluetooth-transfer
            tap_action: toggle

Maybe this is helpful to someone. Have fun!

9 Likes
2

Lovelace the card lol

1 Like
3

Hi, I’m fairly new with HA. Can someone tell me which yaml file i need to put these configurations please?

4

You can do it in the webinterface if you use Lovelace-UI. Make shure to have the custum card (custom:vertical-stack-in-card) installed. Link is in the original post. Good luck!

5

Thanks Jones! I’ll give it a try. Where do I put the input_boolean, shell_command and script? Do they go in the configuration.yaml?

6

hello again. you seem to be really new to homeassistant. it’s always a good idea to read the docs. you can put everything into the configuration.yaml (https://www.home-assistant.io/getting-started/configuration/) but I advice you to think about configuration splitting. That way your configuration.yaml don’t get bloated. See: https://www.home-assistant.io/docs/configuration/splitting_configuration/

7

Thanks. I do have my yaml files split. group.yaml, sensor.yaml, switch.yaml, automation.yaml, etc. But I just couldn’t find any read on which yaml file to put the Type and Script. Please pardon my ignorance as I really want to understand where each element goes before implementing it. Thanks again!

8

No problem. Just make another yaml and call it input_boolean.yaml and include it in your configuration. after that reboot homeassistant.