Bond Fan Lovelace Question

Hi there!

I’m new to home assistant and am looking for some help on creating a Lovelace card for my fans controlled by the Bond integration.

I’ve seen some options when it comes to making a template fan, but that seems to not be necessary since Bond already has the fan created rather than making a control from BroadLink.

What I’d like to do is just make a row of four buttons. Each button would be a different fan speed (high, medium, low, off). Preferably the buttons would shift in color to indicate which state the fan is in.

Custom cards are currently the area I’m least familiar with, so I’d appreciate any advice someone has!

Note: I am unable to get HACS to work right now. It refuses to start up after installing the integration. So if there is a way to not use it to get a community resource that’d be great.

1 Like

I’d like to know the same thing. I’ve got the Bond integration working but I’d like to include the function of switching the fan speed in a Picture Elements card, controlled by different fan speed icons. Can anyone tell me where can I find the command that actually makes this happen, so I can steal it and assign it to an icon?

I figured out a way that works for me. I’m using Picture Elements cards for my whole interface.

This is the code I have for my Picture Elements card for my FAN section. You wouldn’t need all the image placement info I have, but including it all here just in case it’s helpful:

          - type: custom:text-element
            text: "FAN"
            style: 
              color: "#bfbdbf"
              font-family: Saira
              font-size: 22px
              left: 10%
              top: 53.2%
          - image: /local/images/button_medium.svg
            style:
              left: 17.2%
              top: 58.2%
              width: 25.3125%
              pointer-events: none
            type: image
          - type: custom:text-element
            text: "LIGHT"
            style: 
              color: "#bfbdbf"
              font-family: Saira
              font-size: 22px
              left: 23%
              top: 53.2%
          - image: /local/images/button_small_half.svg
            style:
              left: 23%
              top: 53.2%
              width: 12.03125%
            tap_action:
              action: toggle
              entity_id: light.dining_room_2
            type: image
          - type: icon
            icon: mdi:fan-off
            style:
              left: 7%
              top: 60.2%
              transform: scale(2,2) 
            tap_action:
              action: call-service
              service: script.fan_speed_off
          - type: icon
            icon: mdi:fan-speed-1
            style:
              left: 13%
              top: 60.2%
              transform: scale(2,2)
            tap_action:
              action: call-service
              service: script.fan_speed_low
          - type: icon
            icon: mdi:fan-speed-2
            style:
              left: 19%
              top: 60.2%
              transform: scale(2,2) 
            tap_action: 
              action: call-service
              service: script.fan_speed_med
          - type: icon
            icon: mdi:fan-speed-3
            style:
              left: 25%
              top: 60.2%
              transform: scale(2,2) 
            tap_action: 
              action: call-service
              service: script.fan_speed_high

And this is what I have in my scripts.yaml file to drive those call-services:

fan_speed_off:
  alias: "Fan Speed Off"
  sequence:
    service: fan.set_speed
    target:
      entity_id: fan.dining_room_2
    data:
      speed: 'off'

fan_speed_low:
  alias: "Fan Speed Low"
  sequence:
    service: fan.set_speed
    target:
      entity_id: fan.dining_room_2
    data:
      speed: low

fan_speed_med:
  alias: "Fan Speed Med"
  sequence:
    service: fan.set_speed
    target:
      entity_id: fan.dining_room_2
    data:
      speed: med

fan_speed_high:
  alias: "Fan Speed High"
  sequence:
    service: fan.set_speed
    target:
      entity_id: fan.dining_room_2
    data:
      speed: high

And here’s a pic of how it all works out. (The borders around everything are custom svg images I created and place with the code on the page.)

I’ve actually come up with something similar only I use a row of 4 button cards with template switches.

Be advised, if you update to 2021.3.0 you now have to use set.fan_percentage instead of set.fan_speed!