TrashCard is a custom Home Assistant card that displays the your current and upcoming trash collection schedule. It uses events contained within the local calendar integration to display the information.
Features
- Colors, icons and text for residual, organic, paper waste and recycling events.
- Colors and icons for all custom events.
- A filter for events.
TrashCard requires:
Once you have both of these installed, you can install TashCard either:
- Through HACS.
- Manually.
TrashCard is available in HACS (Home Assistant Community Store).
- Install HACS if you havenโt already.
- Open HACS in Home Assistant.
- Go to the "Frontend" section.
- Click the "+" icon.
- Search for "TrashCard".
- Download the latest latest release of
trashcard.js
from the GitHub repository. - Add
trashcard.js
into your config/www folder.
You must then add a reference to trashcard.js
in your Dashboard. There are two methods for doing this:
Using the UI:
- Settings โ Dashboards โ More Options icon โ Resources โ Add Resource โ Set Url as
/local/trashcard.js
โ Set Resource type asJavaScript Module
.
Note: If you do not see the Resources menu, you will need to enable Advanced Mode in your User Profile
Using YAML:
Add following code to the lovelace
section in configuration.yaml:
```yaml
resources:
- url: /local/trashcard.js
type: module
```
In order for TrashCard to display information, your garbage collection schedule needs to be added in the local calendar. Creating a dedicated โGarbage collectionโ calendar for this purpose is a good way to keep things organised.
Note:
- When adding the dates, the events must be set to โFull dayโ.
- The event name (in the โsummaryโ field) must be the same name as the type of collection event.
- Up to five different types of collection events are supported (Garbage, recycling, organic waste etc.).
- Repeating events are supported.
The TrashCard cards can be configured using the Dashboard UI editor.
- In the Dashboard UI, select "Edit Dashboard" in top right corner.
- Click the "+Add Card" button.
- Find the Custom: TrashCard card in the list.
- Set the entity to the calendar that contains the collection events.
- Configure the display settings of the card using the options.
All the options listed below are available in the lovelace editor, but configuring via yaml
is supported too.
Name | Type | Default | Description |
---|---|---|---|
entities |
array of strings | Required | The calendar(s) containing the collection events. |
layout |
string | Optional | Layout of the card. Vertical, horizontal and default layouts are supported. |
fill_container |
boolean | false |
Fill container or not. Useful when card is in a grid, vertical or horizontal layout. |
filter_events |
boolean | false |
Filter and display events from the calendar by names (if at least one is defined). |
full_size |
boolean | false |
Show the card without the default card margins. |
drop_todayevents_from |
time | 10:00:00 |
From what time to hide all-day event (Format hh:mm:ss ). |
use_summary |
boolean | false |
Shows the event summary instead of matched label. |
hide_time_range |
boolean | false |
Option to hide the time on events that aren't full day events. |
event_grouping |
boolean | true |
Only display the next event per pattern, otherwise all events during the selected time will be displayed. |
next_days |
number | 2 | How many times the card will look into the future to find the next event. |
day_style |
default or counter |
default |
Option for how the date of an event should be displayed. default shows the date in date format and counter shows the number of days remaining before the event. |
card_style |
card , chip or icon |
card |
Switch between the events style Standard card , Chip card or a new Icon predefined layout. |
alignment_style |
left , center , right or space |
left |
Switch between alignments on Chip card card_style. |
color_mode |
background or icon |
background |
Select whether the color settings should be applied to the background or to the icon. |
refresh_rate |
integer | 60 | Check for changes in the calendar every x minutes. By default it will check every 60 minutes. Values can be set from 5 to 1440. |
debug |
boolean | false |
Option to enable debug mode to help fixing bugs ;) . |
icon_size |
integer | 40 | Size of the icons in px if you choose card_style as icon . |
with_label |
boolean | true |
Option to display the label in the card or chip style. |
pattern |
array of Pattern | Required | Pattern to detect the kind of trash and how to display it. |
Name | Type | Default | Description |
---|---|---|---|
type |
organic , paper , recycle , waste , others , custom |
Required | Label which should be shown. |
label |
string | Required | The label that will be displayed. |
icon |
string | Required | The icon that will be displayed. |
color |
string | Required | The background color of the card. |
pattern |
string | Required | Pattern used to detect and display an event type. (Is tested against the calendar entry title). |
picture |
string | Optional | Picture URL do display an image instead of an icon. |
Name | Type | Default | Description |
---|---|---|---|
icon |
string | Required | The icon that will be displayed. |
color |
string | Required | The background color of the card. |
The red and yellow bins are collected every fortnight on Thursdays. The red and green bins are collected every other fortnight on Thursdays.
type: custom:trash-card
entities:
- calendar.mags_abfuhrtermine
layout: vertical
event_grouping: true
drop_todayevents_from: '10:00:00'
next_days: 300
day_style: counter
card_style: card
color_mode: background
items_per_row: 4
refresh_rate: 60
with_label: true
filter_events: false
use_summary: false
hide_time_range: false
pattern:
- label: Organic
icon: mdi:flower
pattern: braun
color: light-green
type: organic
- label: Paper
icon: mdi:newspaper-variant-multiple-outline
color: indigo
pattern: blau
type: paper
- label: Recycling
pattern: gelb
icon: mdi:recycle-variant
color: amber
type: recycle
- pattern: grau
icon: mdi:trash-can
label: Waste
color: dark-grey
type: waste
- icon: mdi:dump-truck
color: purple
type: others
- label: Electric
icon: mdi:electron-framework
color: pink
type: custom
pattern: elektro