Lovelace: Simple Xiaomi Vacuum Card

benct · April 8, 2019, 11:20pm

Xiaomi Vaccum Card

After having a read through this thread I thought I’d make a simple lovelace card for the Xiaomi (Roborock) vacuums, as the examples in the thread included quite a lot of configuration and manual setup. To avoid having to set up a lot of scripts, template sensors and complicated picture-elements cards, this card displays by default most of the same data as many of the thread examples by using attribute data.

Features

Display basic status and information about your vacuum cleaner
Buttons for easy control of vacuum functions
Optional background image

default

Options

Name	Type	Default	Description
type	string	Required	`custom:xiaomi-vacuum-card`
entity	string	Required	`vacuum.my_xiaomi_vacuum`
name	string/bool	`friendly_name`	Override entity friendly name (set to `false` to hide title)
image	string/bool	`/local/img/vacuum.png`	Custom path/name of background image (set to `false` to disable background)
buttons	bool	`true`	Set to `false` to hide button row

- type: custom:xiaomi-vacuum-card
  entity: vacuum.xiaomi_vacuum_cleaner
  background: /local/custom/folder/file.png
  name: Xiaomi Vacuum

CountParadox · April 9, 2019, 12:09am

Thanks dude! looks great and so much easier!

an20dei · April 9, 2019, 2:39pm

Would be nice if you can include an input_select in it, a lot of us are using input_select to start some zoned cleanups. Great work! Cheers

benct · April 9, 2019, 2:48pm

Good to know, I’ll try to add that in a future version

uiguy · April 11, 2019, 1:24pm

legend, much easier… thanks

mase · April 11, 2019, 6:25pm

awesome card, but it looks like that it has a problem with mobile or is it me?

roflcoopter · April 11, 2019, 8:07pm

I keep getting the same, not just on mobile tho.

I keep it in the same folder as all my other custom cards, no idea what’s wrong

benct · April 11, 2019, 9:08pm

Hmm… it is working fine here both on mobile and desktop. Have you added the following to your ui-lovelace.yaml file (if in yaml mode) or in the raw config editor (UI mode)?

resources:
  - url: /local/xiaomi-vacuum-card.js?v=1.1.0
    type: js

If so, can you see any error messages in the browser console window?

sirfalo · April 11, 2019, 9:19pm

I have exaclu same problem. I added of course resource in RAW EDITOR, but it doesn’t work - custom card not exists…

sirfalo · April 11, 2019, 9:22pm

benct · April 11, 2019, 9:52pm

Seems like I was using some code syntax that is not supported by all browsers or something… Try updating the script with the new version in the GitHub repository.

sirfalo · April 11, 2019, 9:56pm

I just checked and it works on CHROME, but not on OPERA…

pergola.fabio · April 12, 2019, 4:34am

Yeah, I miss the zone select too

uiguy · April 12, 2019, 9:10am

Yea, that fixed issue on mobile for me… Do you recon you can add this to custom updater?

mase · April 12, 2019, 12:37pm

i added it into the raw config editor. i don´t use the lovelace.yaml file

mase · April 12, 2019, 12:43pm

this fixed it for me on mobile. thanks!
any way to get rid of the shadow effect around the text?

koekerdt · April 13, 2019, 5:57pm

Looks fantastic! A minor issue though is the buttons are ‘black’… is there any way to make them appear in white (as by your screenshot)? Cheers!

mase · April 13, 2019, 10:26pm

i guess they are black because of the theme you are using. they´re light gray for me.

sirfalo · April 14, 2019, 7:52pm

Hi
Just to update, v1.1.1 have same issue on Opera as 1.1.0

benct · April 18, 2019, 8:47pm

Sorry for the late reply, I’m currently away on vacation. I cannot seem to reproduce the issue in Opera or any other browser. Have you tried updating your browser to the latest version? Are thereny more errors showing up in the browser console?