This is my first post and hope to get some thoughts and constructive feedback. I am new to HA and am experimenting and playing around with lots of concepts. I am sure I have bucked conventions and best practices so I welcome those pointers.
I am using the hacs_waste_collection_schedule integration to get my city’s (Denver, CO) trash pickup schedule. The bins change each week and the weekly regulars can be skipped sometimes. I put together this display element using button-cards and button-card templates from Fun with custom:button-card by @ktownsend-personal.
The truck card shows the pickup date “ddd, mmm d”, “Tomorrow” with orange icon, or “Today” with red icon. While all possible bins are shown in the screenshot, only the bins being picked up on the next pickup date are shown. The colors correspond to the bin colors.
yaml
type: custom:button-card
template: container
color: "#EDE7B0"
name: Dining Room
show_name: false
width: 33%
custom_fields:
buttons:
card:
type: horizontal-stack
cards:
- type: custom:button-card
tempalte: standard
entity: calendar.recollect
name: Next Pickup
show_name: false
icon: mdi:dump-truck
icon_color: white
show_state: true
state_display: |
[[[
if (states['sensor.waste_collection_days_until_pickup'].state == 0) return 'TODAY';
if (states['sensor.waste_collection_days_until_pickup'].state == 1) return 'TOMORROW';
const raw = states['calendar.recollect'].attributes.start_time;
if (!raw) return '';
const myDate = new Date(raw); // <-- convert to Date object
if (isNaN(myDate)) return ''; // safety check
const days = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"];
const months = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
const dayOfWeek = days[myDate.getDay()];
const month = months[myDate.getMonth()];
const dayOfMonth = myDate.getDate();
return `${dayOfWeek}, ${month} ${dayOfMonth}`;
]]]
styles:
icon:
- color: white
state:
- font-size: 0.65em
- white-space: normal
state:
- operator: template
value: >-
[[[ return
states['sensor.waste_collection_days_until_pickup'].state == 0;
]]]
styles:
icon:
- color: red
- operator: template
value: >-
[[[ return
states['sensor.waste_collection_days_until_pickup'].state == 1;
]]]
styles:
icon:
- color: orange
- type: conditional
conditions:
- entity: binary_sensor.waste_collection_trash_pickup_this_week
state: "on"
card:
type: custom:button-card
tempalte: standard
entity: sensor.waste_collection_trash_pickup
name: Trash
icon: mdi:trash-can-outline
styles:
name:
- font-size: 0.65em
- white-space: normal
- type: conditional
conditions:
- entity: binary_sensor.waste_collection_compost_pickup_this_week
state: "on"
card:
type: custom:button-card
entity: sensor.waste_collection_compost_pickup
name: Compost
icon: mdi:trash-can
color: green
styles:
name:
- font-size: 0.65em
- white-space: normal
- type: conditional
conditions:
- condition: state
entity: binary_sensor.waste_collection_recycle_pickup_this_week
state: "on"
card:
type: custom:button-card
entity: sensor.waste_collection_recycle_pickup
name: Recycle
icon: mdi:trash-can
color: purple
styles:
name:
- font-size: 0.65em
- white-space: normal
- type: conditional
conditions:
- entity: binary_sensor.waste_collection_large_item_pickup_this_week
state: "on"
card:
type: custom:button-card
entity: sensor.waste_collection_large_item_pickup
name: Large Item
icon: phu:garbage-residual
color: grey
styles:
name:
- font-size: 0.65em
- white-space: normal
- type: conditional
conditions:
- entity: binary_sensor.waste_collection_trash_pickup_this_week
state: "off"
card:
type: custom:button-card
color_type: blank-card
- type: conditional
conditions:
- entity: binary_sensor.waste_collection_compost_pickup_this_week
state: "off"
card:
type: custom:button-card
color_type: blank-card
- type: conditional
conditions:
- entity: binary_sensor.waste_collection_recycle_pickup_this_week
state: "off"
card:
type: custom:button-card
color_type: blank-card
- type: conditional
conditions:
- entity: binary_sensor.waste_collection_large_item_pickup_this_week
state: "off"
card:
type: custom:button-card
color_type: blank-card
In addition, I have an automation to send me a notification the day before the scheduled pickup that indicates which bins should be put out to the curb.
yaml
alias: Notify which trash bins to put out when next day is trash pickup
description: |
Notify Jeffrey's iPhone and HA notifications which bins to put out.
triggers:
- entity_id: sensor.waste_collection_days_until_pickup
to: "1"
trigger: state
actions:
- data:
title: Waste Collection Tomorrow
message: "{{ message }}"
action: notify.mobile_app_jeffreys_iphone
- data:
title: Waste Collection Reminder
message: "{{ message }}"
notification_id: waste_collection_tomorrow
action: persistent_notification.create
mode: single
variables:
bins: >
{% set out = [] %} {% if
is_state('binary_sensor.waste_collection_trash_pickup_this_week', 'on') %}
{% set out = out + ['Trash'] %}
{% endif %} {% if
is_state('binary_sensor.waste_collection_compost_pickup_this_week', 'on') %}
{% set out = out + ['Compost'] %}
{% endif %} {% if
is_state('binary_sensor.waste_collection_recycle_pickup_this_week', 'on') %}
{% set out = out + ['Recycling'] %}
{% endif %} {% if
is_state('binary_sensor.waste_collection_large_item_pickup_this_week', 'on')
%}
{% set out = out + ['Large Items'] %}
{% endif %} {{ out }}
message: |
{% if bins | length == 0 %}
No bins need to be put out tomorrow.
{% elif bins | length == 10 %}
Put out the {{ bins[0] }} bin tomorrow.
{% else %}
Put out the following bin(s) tomorrow: {{ bins | join(', ') }}.
{% endif %}
Please let me know if you use any of this or if you have questions – I did not include the sensor configurations, but will add them if there is interest.
