My Lovelace Plugins


#287

Excellent job! I’m already using it in my settings and it works great!


#288

Thanks, that is working great!

Is it possible to add a default value for entities other than user as well?
I have a device_tracker with multiple states and would like to switch between state home and default to all other states (away, work, etc).


#289

I try to enlarge the picture, but I can not. Here is my code:

The image is: /local/lovelace/home/xiaomi_vacuum_03.jpg

  - id: 9  # Automatically created id
icon: mdi:robot-vacuum-variant
background: center / cover no-repeat url("/local/lovelace/background/back01.jpg") fixed
type: custom:layout-card
layout: horizontal
cards:
  - type: custom:card-modder
    card:
      type: picture-elements
      image: /local/lovelace/home/xiaomi_vacuum_03.jpg
      elements:
        - type: icon
          icon: mdi:bell-ring
          tap_action: call-service
          entity: vacuum.xiaomi_vacuum_cleaner
          service: vacuum.locate
          style:
           top: 93%
           left: 80%
           color: '#ffffff'
        - type: icon
          icon: mdi:crosshairs
          tap_action: call-service
          entity: vacuum.xiaomi_vacuum_cleaner
          service: vacuum.clean_spot
          style:
           top: 93%
           left: 65%
           color: '#ffffff'
        - type: icon
          tap_action: call-service
          icon: mdi:home
          entity: vacuum.xiaomi_vacuum_cleaner
          service: vacuum.return_to_base
          style:
           top: 93%
           left: 50%
           color: '#ffffff'
        - type: icon
          icon: mdi:stop
          tap_action: call-service
          entity: vacuum.xiaomi_vacuum_cleaner
          service: vacuum.stop
          style:
           top: 93%
           left: 35%
           color: '#ffffff'
        - type: icon
          icon: mdi:play
          tap_action: call-service
          entity: vacuum.xiaomi_vacuum_cleaner
          service: vacuum.start
          style:
           top: 93%
           left: 20%
           color: '#ffffff'
        - type: state-label
          entity: sensor.vacuum_operation
          style:
           top: 10%
           left: 1%
           color: rgb(255, 255, 255)
           transform: translate(0%,-50%)
           pointer-events: none
           font-family: Trebuchet MS
           font-size: 90%
           font-weight: bold
        - type: state-label
          entity: sensor.vacuum_accessories
          style:
           top: 10%
           right: 1%
           color: rgb(255, 255, 255)
           transform: translate(0%,-50%)
           pointer-events: none
           font-family: Trebuchet MS
           font-size: 90%
           font-weight: bold
        - type: state-label
          tap_action: more-info
          entity: vacuum.xiaomi_vacuum_cleaner
          style:
           top: 10%
           right: 43%
           color: rgb(255, 255, 255)
           transform: translate(0%,-50%)
           font-family: Trebuchet MS
           font-size: 150%
           font-weight: bold
        - type: state-label
          entity: sensor.vacuum_cleanmainbrush
          style:
            top: 33%
            right: 2%
            color: '#ffffff'
            transform: translate(0%,-50%)
            pointer-events: none
            font-family: Trebuchet MS
            font-size: 76%
            font-weight: bold
        - type: state-label
          entity: sensor.vacuum_cleansidebrush
          style:
            top: 40%
            right: 0%
            color: '#ffffff'
            transform: translate(0%,-50%)
            pointer-events: none
            font-family: Trebuchet MS
            font-size: 76%
            font-weight: bold
        - type: state-label
          entity: sensor.vacuum_cleanfilter
          style:
            top: 57%
            right: 3%
            color: '#ffffff'
            transform: translate(0%,-50%)
            pointer-events: none
            font-family: Trebuchet MS
            font-size: 76%
            font-weight: bold
            opacity: 0.8
        - type: state-label
          entity: sensor.vacuum_sensordirtyleft
          style:
            top: 74%
            right: 5%
            color: '#ffffff'
            transform: translate(0%,-50%)
            pointer-events: none
            font-family: Trebuchet MS
            font-size: 76%
            font-weight: bold
        - type: state-label
          entity: sensor.vacuum_status
          style:
            top: 33%
            left: 2%
            color: '#ffffff'
            transform: translate(0%,-50%)
            pointer-events: none
            font-family: Trebuchet MS
            font-size: 80%
            font-weight: bold
        - type: state-label
          entity: sensor.vacuum_battery
          style:
            top: 54%
            left: -1%
            color: '#ffffff'
            transform: translate(0%,-50%)
            pointer-events: none
            font-family: Trebuchet MS
            font-size: 80%
            font-weight: bold
        - type: state-label
          entity: sensor.vacuum_fan_speed
          style:
            top: 65%
            left: 1%
            color: '#ffffff'
            transform: translate(0%,-50%)
            pointer-events: none
            font-family: Trebuchet MS
            font-size: 80%
            font-weight: bold
        - type: state-label
          entity: sensor.vacuum_cleaned_area
          prefix: "Area:"
          style:
            top: 25%
            left: 26%
            color: '#ffffff'
            transform: translate(0%,-50%)
            pointer-events: none
            font-family: Trebuchet MS
            font-size: 80%
            font-weight: bold
        - type: state-label
          entity: sensor.vacuum_cleaning_time
          prefix: "Time:"
          style:
            top: 25%
            left: 60%
            color: '#ffffff'
            transform: translate(0%,-50%)
            pointer-events: none
            font-family: Trebuchet MS
            font-size: 80%
            font-weight: bold
    style:
      border-radius: 15px
      border: solid 1px rgba(100,100,100,0.3)
      box-shadow: 3px 3px rgba(0,0,0,0.4)
  

  - type: custom:layout-card
    layout: horizontal
    cards:
      - type: custom:card-modder
        card:
          type: glance
          entities:
            - entity: input_boolean.disable_dustbin_notification
              name: Disable Notification
            - entity: input_boolean.disable_daily_vacuum
              name: Disable Daily Cleanup
        style:
          background-image: url("/local/lovelace/background/cardbackK.png")
          background-repeat: no-repeat
          background-color: rgba(50,50,50,0.3)
          background-size: 100% 150px
          border-radius: 15px
          border: solid 1px rgba(100,100,100,0.3)
          box-shadow: 3px 3px rgba(0,0,0,0.4)  
          
      - type: custom:card-modder
        card:
          type: entities
          entities:
            - input_select.vacuum_room
        style:
          background-image: url("/local/lovelace/background/cardbackK.png")
          background-repeat: no-repeat
          background-color: rgba(50,50,50,0.3)
          background-size: 100% 150px
          border-radius: 15px
          border: solid 1px rgba(100,100,100,0.3)
          box-shadow: 3px 3px rgba(0,0,0,0.4)

#290

Try it and see what happens.

Spoiler alert: It works.


#291

I did try it and it didn’t work.

Will try again to see what went wrong :thinking:

Edit
Just tried some settings but can’t get it to work. Any hints are appreciated.
This is my ui-lovelace

- type: vertical-stack
  cards:
    - type: custom:state-switch
      entity: device_tracker.gerard
      default: default
      states:
        home:
          type: vertical-stack
          cards:
            - [cards here]
        default:
          type: vertical-stack
          cards:
            - [cards here]

#292

Love the new rework of slider-entity-row and the new state-switch card.
Would love to see them in core HA in the future.
Thanks for sharing!


#293

Is there a way to get icons to render in your markdown card? I’m doing a super condensed view and would love to not have labels for the rows.


#294

Oh darn! You’re right. Sorry about that.

Should be fixed now.


#295

Yes it works now :grinning: thanks!


#296

Afraid not, but I think you can include pictures.


#297

I’ve heard some people have had problems with some of my cards and the custom_updater.

If you have a problem and are using the fold-entity-row, make sure it’s entered correctly in your resources section. I renamed the card a while ago from folding-group-entity-row.js to fold-entity-row.js.

So, if your resources section says folding-group-entity-row.js try changing it to fold-entity-row.js and also rename the file. Then press update.


#298

Nice, what does the loveclace look like for your card?


#300

To give a bit of history I started off with two glance card b/c I wanted to see how the temperature and humidity was trending around the house, as we have a young baby and want to keep it more comfortable.

The problem with the glace cards is they take up a lot of space and I don’t care for the duplication of icons (wasted screen realestate IMHO).

So, I switched to the mark-down card to just make a simple table.

image

- type: custom:useful-markdown-card
    content: >
      | | DS | Outside | 2nd | 1st | Base |

      | -----|---------|------|-----|-----|-----|

      | ![Temperature](https://[youdomain].duckdns.org:8123/local/lovelace_ui/thermometer.svg) 
      | [[weather.dark_sky.attributes.temperature]][[sensor.weather_temperature.attributes.unit_of_measurement]] 
      | [[sensor.weather_temperature.state]][[sensor.weather_temperature.attributes.unit_of_measurement]] 
      | [[sensor.ms2_temp_sensor_63.state]][[sensor.weather_temperature.attributes.unit_of_measurement]] 
      | [[sensor.house_thermostat_temperature.state]][[sensor.weather_temperature.attributes.unit_of_measurement]] 
      | [[sensor.ms1_temp_sensor_54.state]][[sensor.weather_temperature.attributes.unit_of_measurement]] 
      |

      | ![Humidity](https://[youdomain].duckdns.org:8123/local/lovelace_ui/water-percent.svg) 
      | [[weather.dark_sky.attributes.humidity]][[sensor.weather_humidity.attributes.unit_of_measurement]] 
      | [[sensor.weather_humidity.state]][[sensor.weather_humidity.attributes.unit_of_measurement]] 
      | [[sensor.ms2_humidity_sensor_65.state]][[sensor.weather_humidity.attributes.unit_of_measurement]] 
      | [[sensor.house_thermostat_humidity.state]][[sensor.weather_humidity.attributes.unit_of_measurement]] 
      | [[sensor.ms1_humidity_sensor_56.state]][[sensor.weather_humidity.attributes.unit_of_measurement]] 
      |

The current problem is that the mark-down card must report as some giant size and the column ordering of the default algorithm doesn’t look nice. But I continue to use it as it handles the switch between mobile to desktop better.

Also DS is Darksky and Outside is the sun.sun temperature. I find that DS is more accurate for my location for whatever reason.

Where I finally landed was making a single view using layout-card with 4 columns and the mini-graph. So this is only good for tablet and up, which is sufficient for my needs. And mobile I can use the mark-down version.

Sorry for the 110% answer.


#301

@thomasloven First of all thanks for you plugins, I’m using a few of them already.

There’s something I can’t get to work and as far as I can see in this Github issue it should work or I misunderstood that issue. What I’m trying to do is have a slider-entity-row for a light group.

This is my config:

      - type: section
        label: Entrance
      - type: custom:slider-entity-row
        entity: group.entrance
      - type: custom:slider-entity-row
        entity: light.entrance_1
      - type: custom:slider-entity-row
        entity: light.entrance_2
      - type: custom:slider-entity-row
        entity: light.entrance_3

However this doesn’t work, since I’m getting an ‘Unsupported entity domain: group’ error. Just double checking here… is this supposed to work? Did you mean that in that Github issue?

If I can get a light group to show up with a slider, I would actually love to use it as a ‘head’ for a fold-entity-row, so that I can place the 3 lights that make up the group as items folded under it. If the above is possible… am I able to do this as well?

I tried to use fold-entity-row and I can have the light group as the head of the folded group and the lights underneath, but again there is no slider for the group in the head.


#302

Use the light group for the head of the fold-entity-row and the individual lights as items.


#303

can someone help please?


#304

Yeah, that’s what I tried. This was the config that I used:

- type: section
  label: Entrance
- type: custom:fold-entity-row
  head:
    type: custom:slider-entity-row
    entity: group.entrance
  group_config:
    type: custom:slider-entity-row
    secondary_info: last-changed

And this is the result:

27

As you can see… it does create a folded group with the individual lights hidden away. I can’t however make the group show up as a slider as well. It does work when it doesn’t use slider-entity-row, but than it shows only a toggle and I want to control the entire group with a single slider (like you would normally do in the more-info dialog).


#305

This is not a light group. :upside_down_face:


#306

card-modder can be used to change what size a card reports to the layout functions.

- type custom:card-modder
  report_size: 1
  card:
    type: markdown
    ... etc

The default behavior of the markdown card is to report about 50 pixels per line of code in its definition, which I guess are a lot in your case…


#307

Thanks! Do you have the code for the markdown card?