@bhuebschen/lawn-mower-card
v1.0.0
Published
Lawn Mower cleaner card for Home Assistant Lovelace UI
Downloads
8
Maintainers
Readme
Lawn Mower Card
Based on https://github.com/denysdovhan/vacuum-card
Lawn Mower cleaner card for Home Assistant Lovelace UI
By default, Home Assistant does not provide any card for controlling lawn mowers. This card displays the state and allows to control your robot.
![Preview of lawn-mower-card][preview-image]
Installing
HACS
This card is available in HACS (Home Assistant Community Store).
Just search for Lawn Mower Card
in plugins tab.
Manual
Download
lawn-mower-card.js
file from the latest-release.Put
lawn-mower-card.js
file into yourconfig/www
folder.Add reference to
lawn-mower-card.js
in Lovelace. There's two way to do that:Using UI: Configuration → Lovelace Dashboards → Resources Tab → Click Plus button → Set Url as
/local/lawn-mower-card.js
→ Set Resource type asJavaScript Module
. Note: If you do not see the Resources Tab, you will need to enable Advanced Mode in your User ProfileUsing YAML: Add following code to
lovelace
section.resources: - url: /local/lawn-mower-card.js type: module
Add
custom:lawn-mower-card
to Lovelace UI as any other card (using either editor or YAML configuration).
Usage
This card can be configured using Lovelace UI editor.
- In Lovelace UI, click 3 dots in top left corner.
- Click Configure UI.
- Click Plus button to add a new card.
- Find Custom: Lawn Mower Card in the list.
- Choose
entity
. - Now you should see the preview of the card!
Sorry, no support for actions
, shortcuts
and stats
in visual config yet.
Typical example of using this card in YAML config would look like this:
type: custom:lawn-mower-card
entity: lawn_mower.lawn_mower
battery: sensor.lawn_mower_battery
actions:
start:
service: lawn_mower.start_mowing
service_data:
entity_id: lawn_mover.sedat
stats:
default:
- entity_id: sensor.lawn_mower_bladeslifetime
unit: '%'
subtitle: Blades
- entity_id: sensor.lawn_mower_lensbruh
unit: '%'
subtitle: Lens brush
mowing:
- entity_id: sensor.lawn_mower_area_mowed
subtitle: Area mowed
unit: m²
- entity_id: sensor.lawn_mower_mwingtime
unit: minutes
subtitle: Mowing time
shortcuts:
- name: Mow backyard
service: script.startmow_backyard
icon: mdi:mower-on
- name: Mow frontyard
service: script.startmow_frontyard
icon: mdi:mower-on
Here is what every option means:
| Name | Type | Default | Description |
| -------------- | :-------: | ------------ | ----------------------------------------------------------------------------------------------------- |
| type
| string
| Required | custom:lawn-mower-card
|
| entity
| string
| Required | An entity_id within the lawn-mover
domain. |
| map
| string
| Optional | An entity_id within the camera
domain, for streaming live lawn mower map. |
| map_refresh
| integer
| 5
| Update interval for map camera in seconds |
| image
| string
| default
| Path to image of your lawn mower. Better to have png
or svg
. |
| battery
| string
| default
| An entity_id within the battery
of your lawn mower |
| show_name
| boolean
| true
| Show friendly name of the lawn mower. |
| show_status
| boolean
| true
| Show status of the lawn mower. |
| show_toolbar
| boolean
| true
| Show toolbar with actions. |
| compact_view
| boolean
| false
| Compact view without image. |
| stats
| object
| Optional | Custom per state stats for your lawn mower |
| actions
| object
| Optional | Override default actions behavior with service invocations. |
| shortcuts
| array
| Optional | List of shortcuts shown at the right bottom part of the card with custom actions for your lawn mower. |
stats
object
You can use any attribute of lawn mower or even any entity by entity_id
to display by stats section. You can also combine attribute
with entity_id
to extract an attribute value of specific entity:
| Name | Type | Default | Description |
| ---------------- | :------: | -------- | ---------------------------------------------------------------------------------------------------- |
| entity_id
| string
| Optional | An entity_id with state, i.e. sensor.lawn-mower
. |
| attribute
| string
| Optional | Attribute name of the stat, i.e. filter_left
. |
| value_template
| string
| Optional | Jinja2 template returning a value. value
variable represents the entity_id
or attribute
state. |
| unit
| string
| Optional | Unit of measure, i.e. hours
. |
| subtitle
| string
| Optional | Friendly name of the stat, i.e. Filter
. |
actions
object
You can defined service invocations to override default actions behavior. Available actions to override are start
, pause
, resume
, stop
, locate
and return_to_base
.
| Name | Type | Default | Description |
| -------------- | :------: | --------------------------------- | ----------------------------------------------- |
| service
| string
| Optional | A service to call, i.e. script.clean_bedroom
. |
| service_data
| object
| service_data
for service
call |
shortcuts
object
You can defined custom scripts for custom actions i.e cleaning specific room and add them to this card with shortcuts
option.
| Name | Type | Default | Description |
| -------------- | :------: | --------------------------------- | -------------------------------------------------- |
| name
| string
| Optional | Friendly name of the action, i.e. Clean bedroom
. |
| service
| string
| Optional | A service to call, i.e. script.clean_bedroom
. |
| icon
| string
| Optional | Any icon for action button. |
| service_data
| object
| service_data
for service
call |
Theming
This card can be styled by changing the values of these CSS properties (globally or per-card via card-mod
):
| Variable | Default value | Description |
| --------------------------- | ---------------------------------------------------------------- | ------------------------------------ |
| --vc-background
| var(--ha-card-background, var(--card-background-color, white))
| Background of the card |
| --vc-primary-text-color
| var(--primary-text-color)
| Lawn Mower name, stats values, etc |
| --vc-secondary-text-color
| var(--secondary-text-color)
| Status, stats units and titles, etc |
| --vc-icon-color
| var(--secondary-text-color)
| Colors of icons |
| --vc-toolbar-background
| var(--vc-background)
| Background of the toolbar |
| --vc-toolbar-text-color
| var(--secondary-text-color)
| Color of the toolbar texts |
| --vc-toolbar-icon-color
| var(--secondary-text-color)
| Color of the toolbar icons |
| --vc-divider-color
| var(--entities-divider-color, var(--divider-color))
| Color of dividers |
| --vc-spacing
| 10px
| Paddings and margins inside the card |
Styling via theme
Here is an example of customization via theme. Read more in the Frontend documentation.
my-custom-theme:
vc-background: '#17A8F4'
vc-spacing: 5px
Styling via card-mod
You can use card-mod
to customize the card on per-card basis, like this:
type: 'custom:lawn-mower-card'
style: |
ha-card {
--vc-background: #17A8F4;
--vc-spacing: 5px;
}
...
Animations
I've added some animations for this card to make it alive. Animations are applied only for image
property. Here's how they look like:
| Cleaning | Docking | | :-------------------------: | :-------------------------------: | | | |
Supported languages
This card supports translations. Please, help to add more translations and improve existing ones. Here's a list of supported languages:
- English
- Українська (Ukrainian)
- Deutsch (German)
- Français (French)
- Italiano (Italian)
- Nederlands (Dutch)
- Polski (Polish)
- Русский (Russian)
- Español (Spanish)
- Čeština (Czech)
- Magyar (Hungarian)
- עִבְרִית (Hebrew)
- Português (Portuguese)
- Português Brasileiro (Brazilian Portuguese)
- Svenska (Swedish)
- Norsk bokmål (Norwegian)
- Norsk nynorsk (Norwegian)
- Dansk (Danish)
- 한국어 (Korean)
- Suomi (Finnish)
- Català (Catalan)
- 正體中文 (Traditional Chinese)
- Việt Nam (Vietnamese)
- Lietuvių (Lithuanian)
- Română (Romanian)
- 简体中文 (Simplified Chinese)
- 日本語 (Japanese)
- Your language?
Supported models
This card relies on basic lawn-mower services, like pause
, start
, stop
, return_to_base
, etc. It should work with any robot lawn mover, however I can physically test it only with my own robot lawn mower.
If this card works with your lawn mower, please open a PR and your model to the list.
EcoVacs GOAT G1, GOAT G1-800, GOAT G1-2000, GOAT GX-600
Development
Want to contribute to the project?
First of all, thanks! Check contributing guideline for more information.
Inspiration
This project is heavily inspired by:
- Denys Dovhan — basically, this project is a modified vacuum-card.
Huge thanks for their ideas and efforts 👍
License
MIT © [Benedikt Hübschen][bhuebschen]