Does the opto isolated 5vdc relay module run fine if the IO input voltage is 3.3 vdc? Supply voltage 5vdc.
I have few relay modules with transistors and those does not run fine with 3.3 vdc. Have to have other transistor to drive 5vdc to relay from esp 3.3vdc pins.
Figured Iâd share my UI now that I finally got it all finished.
(The unavailable is because Iâm waiting on a new power supply so the controller isnât on right now.)
Thatâs awesome, care to share the final product code, would totally love to use what youâve developed here!
Super cool, very nice. If youâd be willing to share the code Iâd love to have a go with it. Just looking to move my irrigation into HA and that panel is amazing.
Of course! I use a bunch of custom components so those would all be needed as well.
Components from HACS
- icon: 'mdi:sprinkler'
path: sprinklers
title: Sprinklers
badges: []
cards:
- entities:
- cards:
- content: '## Front Yard'
style: |
ha-card {
background: rgba(0, 0, 0, 0);
box-shadow: none;
}
.markdown {
padding-left: 0px;
}
type: markdown
- entity: script.sprinkler_zone_front
layout: icon_name
name: Run Now
size: 30px
state:
- icon: 'mdi:play-circle'
value: 'off'
- icon: 'mdi:autorenew'
spin: true
styles:
card:
- box-shadow: 0 0 4px 2px var(--paper-item-icon-active-color)
value: 'on'
styles:
card:
- border-radius: 10px
- background-color: '#333'
tap_action:
action: call-service
service: script.toggle
service_data:
entity_id: script.sprinkler_zone_front
type: 'custom:button-card'
layout: horizontal
min_columns: 2
type: 'custom:layout-card'
- conditions:
- entity: script.sprinkler_zone_front
state: 'on'
name: Zone currently running
row:
entity: sensor.sprinkler_current_zone
icon: 'mdi:numeric'
type: conditional
- conditions:
- entity: script.sprinkler_zone_front
state: 'on'
row:
entity: sensor.sprinkler_zone_front_time_remaining
icon: 'mdi:progress-clock'
type: conditional
- conditions:
- entity: script.sprinkler_zone_front
state: 'off'
row:
entity: sensor.sprinkler_zone_front_last_cycle_time
icon: 'mdi:clock'
type: conditional
- type: divider
- cards:
- entity: automation.sprinkler_zone_front_am
gridcol: 1 / 3
gridrow: 1 / 3
name: AM Schedule
size: 20px
state:
- icon: 'mdi:cancel'
value: 'off'
- icon: 'mdi:check-circle'
styles:
card:
- box-shadow: 0 0 4px 2px var(--paper-item-icon-active-color)
value: 'on'
styles:
card:
- border-radius: 10px
- height: 100%
- background-color: '#333'
type: 'custom:button-card'
- entity: automation.sprinkler_zone_front_pm
gridcol: 3 / 5
gridrow: 1 / 3
name: PM Schedule
size: 20px
state:
- icon: 'mdi:cancel'
value: 'off'
- icon: 'mdi:check-circle'
styles:
card:
- box-shadow: 0 0 4px 2px var(--paper-item-icon-active-color)
value: 'on'
styles:
card:
- border-radius: 10px
- height: 100%
- background-color: '#333'
type: 'custom:button-card'
- entity: input_datetime.sprinkler_zone_front_am_on_time
gridcol: 1 / 3
gridrow: 3 / 3
layout: icon_state
show_name: false
show_state: true
size: 30px
styles:
card:
- border-radius: 10px
- background-color: '#333'
- height: 100%
type: 'custom:button-card'
- entity: input_datetime.sprinkler_zone_front_pm_on_time
gridcol: 3 / 5
gridrow: 3 / 3
layout: icon_state
show_name: false
show_state: true
size: 30px
styles:
card:
- border-radius: 10px
- background-color: '#333'
- height: 100%
type: 'custom:button-card'
- entity: input_boolean.sprinkler_zone_front_mon
gridcol: 1 / 1
gridrow: 4 / 6
name: Mon
size: 20px
state:
- icon: 'mdi:cancel'
value: 'off'
- icon: 'mdi:check-circle'
styles:
card:
- box-shadow: 0 0 4px 2px var(--paper-item-icon-active-color)
value: 'on'
styles:
card:
- border-radius: 10px
- height: 100%
- background-color: '#333'
type: 'custom:button-card'
- entity: input_boolean.sprinkler_zone_front_tue
gridcol: 2 / 2
gridrow: 4 / 6
name: Tue
size: 20px
state:
- icon: 'mdi:cancel'
value: 'off'
- icon: 'mdi:check-circle'
styles:
card:
- box-shadow: 0 0 4px 2px var(--paper-item-icon-active-color)
value: 'on'
styles:
card:
- border-radius: 10px
- height: 100%
- background-color: '#333'
type: 'custom:button-card'
- entity: input_boolean.sprinkler_zone_front_wed
gridcol: 3 / 3
gridrow: 4 / 6
name: Wed
size: 20px
state:
- icon: 'mdi:cancel'
value: 'off'
- icon: 'mdi:check-circle'
styles:
card:
- box-shadow: 0 0 4px 2px var(--paper-item-icon-active-color)
value: 'on'
styles:
card:
- border-radius: 10px
- height: 100%
- background-color: '#333'
type: 'custom:button-card'
- entity: input_boolean.sprinkler_zone_front_thu
gridcol: 4 / 4
gridrow: 4 / 6
name: Thu
size: 20px
state:
- icon: 'mdi:cancel'
value: 'off'
- icon: 'mdi:check-circle'
styles:
card:
- box-shadow: 0 0 4px 2px var(--paper-item-icon-active-color)
value: 'on'
styles:
card:
- border-radius: 10px
- height: 100%
- background-color: '#333'
type: 'custom:button-card'
- entity: input_boolean.sprinkler_zone_front_fri
gridcol: 1 / 1
gridrow: 6 / 8
name: Fri
size: 20px
state:
- icon: 'mdi:cancel'
value: 'off'
- icon: 'mdi:check-circle'
styles:
card:
- box-shadow: 0 0 4px 2px var(--paper-item-icon-active-color)
value: 'on'
styles:
card:
- border-radius: 10px
- height: 100%
- background-color: '#333'
type: 'custom:button-card'
- entity: input_boolean.sprinkler_zone_front_sat
gridcol: 2 / 2
gridrow: 6 / 8
name: Sat
size: 20px
state:
- icon: 'mdi:cancel'
value: 'off'
- icon: 'mdi:check-circle'
styles:
card:
- box-shadow: 0 0 4px 2px var(--paper-item-icon-active-color)
value: 'on'
styles:
card:
- border-radius: 10px
- height: 100%
- background-color: '#333'
type: 'custom:button-card'
- entity: input_boolean.sprinkler_zone_front_sun
gridcol: 3 / 3
gridrow: 6 / 8
name: Sun
size: 20px
state:
- icon: 'mdi:cancel'
value: 'off'
- icon: 'mdi:check-circle'
styles:
card:
- box-shadow: 0 0 4px 2px var(--paper-item-icon-active-color)
value: 'on'
styles:
card:
- border-radius: 10px
- height: 100%
- background-color: '#333'
type: 'custom:button-card'
- gridcol: 4 / 4
gridrow: 6 / 6
name: Clear
styles:
card:
- border-radius: 10px
- height: 100%
- background-color: '#333'
tap_action:
action: call-service
service: input_boolean.turn_off
service_data:
entity_id:
- input_boolean.sprinkler_zone_front_mon
- input_boolean.sprinkler_zone_front_tue
- input_boolean.sprinkler_zone_front_wed
- input_boolean.sprinkler_zone_front_thu
- input_boolean.sprinkler_zone_front_fri
- input_boolean.sprinkler_zone_front_sat
- input_boolean.sprinkler_zone_front_sun
type: 'custom:button-card'
- gridcol: 4 / 4
gridrow: 7 / 7
name: All
styles:
card:
- border-radius: 10px
- height: 100%
- background-color: '#333'
tap_action:
action: call-service
service: input_boolean.turn_on
service_data:
entity_id:
- input_boolean.sprinkler_zone_front_mon
- input_boolean.sprinkler_zone_front_tue
- input_boolean.sprinkler_zone_front_wed
- input_boolean.sprinkler_zone_front_thu
- input_boolean.sprinkler_zone_front_fri
- input_boolean.sprinkler_zone_front_sat
- input_boolean.sprinkler_zone_front_sun
type: 'custom:button-card'
column_width: 100%
gridcols: 25% 25% 25% 25%
gridrows: 35px 35px 50px 35px 35px 35px 35px
layout: grid
type: 'custom:layout-card'
- type: divider
- entity: input_number.sprinkler_zone_1_run_time
icon: 'mdi:sprinkler'
name: Zone 1
- entity: input_number.sprinkler_zone_2_run_time
icon: 'mdi:sprinkler'
name: Zone 2
show_header_toggle: false
style: |
ha-card layout-card {
padding: 3px;
}
type: entities
- entities:
- cards:
- content: '## Back Yard'
style: |
ha-card {
background: rgba(0, 0, 0, 0);
box-shadow: none;
}
.markdown {
padding-left: 0px;
}
type: markdown
- entity: script.sprinkler_zone_back
layout: icon_name
name: Run Now
size: 30px
state:
- icon: 'mdi:play-circle'
value: 'off'
- icon: 'mdi:autorenew'
spin: true
styles:
card:
- box-shadow: 0 0 4px 2px var(--paper-item-icon-active-color)
value: 'on'
styles:
card:
- border-radius: 10px
- background-color: '#333'
tap_action:
action: call-service
service: script.toggle
service_data:
entity_id: script.sprinkler_zone_back
type: 'custom:button-card'
layout: horizontal
min_columns: 2
type: 'custom:layout-card'
- conditions:
- entity: script.sprinkler_zone_back
state: 'on'
name: Zone currently running
row:
entity: sensor.sprinkler_current_zone
icon: 'mdi:numeric'
type: conditional
- conditions:
- entity: script.sprinkler_zone_back
state: 'on'
row:
entity: sensor.sprinkler_zone_back_time_remaining
icon: 'mdi:progress-clock'
type: conditional
- conditions:
- entity: script.sprinkler_zone_back
state: 'off'
row:
entity: sensor.sprinkler_zone_back_last_cycle_time
icon: 'mdi:clock'
type: conditional
- type: divider
- cards:
- entity: automation.sprinkler_zone_back_am
gridcol: 1 / 3
gridrow: 1 / 3
name: AM Schedule
size: 20px
state:
- icon: 'mdi:cancel'
value: 'off'
- icon: 'mdi:check-circle'
styles:
card:
- box-shadow: 0 0 4px 2px var(--paper-item-icon-active-color)
value: 'on'
styles:
card:
- border-radius: 10px
- height: 100%
- background-color: '#333'
type: 'custom:button-card'
- entity: automation.sprinkler_zone_back_pm
gridcol: 3 / 5
gridrow: 1 / 3
name: PM Schedule
size: 20px
state:
- icon: 'mdi:cancel'
value: 'off'
- icon: 'mdi:check-circle'
styles:
card:
- box-shadow: 0 0 4px 2px var(--paper-item-icon-active-color)
value: 'on'
styles:
card:
- border-radius: 10px
- height: 100%
- background-color: '#333'
type: 'custom:button-card'
- entity: input_datetime.sprinkler_zone_back_am_on_time
gridcol: 1 / 3
gridrow: 3 / 3
layout: icon_state
show_name: false
show_state: true
size: 30px
styles:
card:
- border-radius: 10px
- background-color: '#333'
- height: 100%
type: 'custom:button-card'
- entity: input_datetime.sprinkler_zone_back_pm_on_time
gridcol: 3 / 5
gridrow: 3 / 3
layout: icon_state
show_name: false
show_state: true
size: 30px
styles:
card:
- border-radius: 10px
- background-color: '#333'
- height: 100%
type: 'custom:button-card'
- entity: input_boolean.sprinkler_zone_back_mon
gridcol: 1 / 1
gridrow: 4 / 6
name: Mon
size: 20px
state:
- icon: 'mdi:cancel'
value: 'off'
- icon: 'mdi:check-circle'
styles:
card:
- box-shadow: 0 0 4px 2px var(--paper-item-icon-active-color)
value: 'on'
styles:
card:
- border-radius: 10px
- height: 100%
- background-color: '#333'
type: 'custom:button-card'
- entity: input_boolean.sprinkler_zone_back_tue
gridcol: 2 / 2
gridrow: 4 / 6
name: Tue
size: 20px
state:
- icon: 'mdi:cancel'
value: 'off'
- icon: 'mdi:check-circle'
styles:
card:
- box-shadow: 0 0 4px 2px var(--paper-item-icon-active-color)
value: 'on'
styles:
card:
- border-radius: 10px
- height: 100%
- background-color: '#333'
type: 'custom:button-card'
- entity: input_boolean.sprinkler_zone_back_wed
gridcol: 3 / 3
gridrow: 4 / 6
name: Wed
size: 20px
state:
- icon: 'mdi:cancel'
value: 'off'
- icon: 'mdi:check-circle'
styles:
card:
- box-shadow: 0 0 4px 2px var(--paper-item-icon-active-color)
value: 'on'
styles:
card:
- border-radius: 10px
- height: 100%
- background-color: '#333'
type: 'custom:button-card'
- entity: input_boolean.sprinkler_zone_back_thu
gridcol: 4 / 4
gridrow: 4 / 6
name: Thu
size: 20px
state:
- icon: 'mdi:cancel'
value: 'off'
- icon: 'mdi:check-circle'
styles:
card:
- box-shadow: 0 0 4px 2px var(--paper-item-icon-active-color)
value: 'on'
styles:
card:
- border-radius: 10px
- height: 100%
- background-color: '#333'
type: 'custom:button-card'
- entity: input_boolean.sprinkler_zone_back_fri
gridcol: 1 / 1
gridrow: 6 / 8
name: Fri
size: 20px
state:
- icon: 'mdi:cancel'
value: 'off'
- icon: 'mdi:check-circle'
styles:
card:
- box-shadow: 0 0 4px 2px var(--paper-item-icon-active-color)
value: 'on'
styles:
card:
- border-radius: 10px
- height: 100%
- background-color: '#333'
type: 'custom:button-card'
- entity: input_boolean.sprinkler_zone_back_sat
gridcol: 2 / 2
gridrow: 6 / 8
name: Sat
size: 20px
state:
- icon: 'mdi:cancel'
value: 'off'
- icon: 'mdi:check-circle'
styles:
card:
- box-shadow: 0 0 4px 2px var(--paper-item-icon-active-color)
value: 'on'
styles:
card:
- border-radius: 10px
- height: 100%
- background-color: '#333'
type: 'custom:button-card'
- entity: input_boolean.sprinkler_zone_back_sun
gridcol: 3 / 3
gridrow: 6 / 8
name: Sun
size: 20px
state:
- icon: 'mdi:cancel'
value: 'off'
- icon: 'mdi:check-circle'
styles:
card:
- box-shadow: 0 0 4px 2px var(--paper-item-icon-active-color)
value: 'on'
styles:
card:
- border-radius: 10px
- height: 100%
- background-color: '#333'
type: 'custom:button-card'
- gridcol: 4 / 4
gridrow: 6 / 6
name: Clear
styles:
card:
- border-radius: 10px
- height: 100%
- background-color: '#333'
tap_action:
action: call-service
service: input_boolean.turn_off
service_data:
entity_id:
- input_boolean.sprinkler_zone_back_mon
- input_boolean.sprinkler_zone_back_tue
- input_boolean.sprinkler_zone_back_wed
- input_boolean.sprinkler_zone_back_thu
- input_boolean.sprinkler_zone_back_fri
- input_boolean.sprinkler_zone_back_sat
- input_boolean.sprinkler_zone_back_sun
type: 'custom:button-card'
- gridcol: 4 / 4
gridrow: 7 / 7
name: All
styles:
card:
- border-radius: 10px
- height: 100%
- background-color: '#333'
tap_action:
action: call-service
service: input_boolean.turn_on
service_data:
entity_id:
- input_boolean.sprinkler_zone_back_mon
- input_boolean.sprinkler_zone_back_tue
- input_boolean.sprinkler_zone_back_wed
- input_boolean.sprinkler_zone_back_thu
- input_boolean.sprinkler_zone_back_fri
- input_boolean.sprinkler_zone_back_sat
- input_boolean.sprinkler_zone_back_sun
type: 'custom:button-card'
column_width: 100%
gridcols: 25% 25% 25% 25%
gridrows: 35px 35px 50px 35px 35px 35px 35px
layout: grid
type: 'custom:layout-card'
- type: divider
- entity: input_number.sprinkler_zone_3_run_time
icon: 'mdi:sprinkler'
name: Zone 3
- entity: input_number.sprinkler_zone_4_run_time
icon: 'mdi:sprinkler'
name: Zone 4
- entity: input_number.sprinkler_zone_5_run_time
icon: 'mdi:sprinkler'
name: Zone 5
- entity: input_number.sprinkler_zone_6_run_time
icon: 'mdi:sprinkler'
name: Zone 6
show_header_toggle: false
style: |
ha-card layout-card {
padding: 3px;
}
type: entities
- cards:
- entities:
- script.sprinkler_zone_front
- sscript.sprinkler_zone_back
gridcol: 1 / 3
gridrow: 1
icon: 'mdi:power'
name: Master Switch
size: 30px
state:
- color: var(--paper-item-icon-active-color)
icon: 'mdi:power'
value: 'on'
styles:
card:
- border-radius: 10px
- background-color: '#333'
tap_action:
action: call-service
service: script.turn_on
service_data:
entity_id: script.sprinkler_stop_all
type: 'custom:button-card'
- entity: switch.sprinkler_zone_1
gridcol: 1
gridrow: 2
name: Zone 1
size: 30px
styles:
card:
- border-radius: 10px
- background-color: '#333'
type: 'custom:button-card'
- entity: switch.sprinkler_zone_2
gridcol: 2
gridrow: 2
name: Zone 2
size: 30px
styles:
card:
- border-radius: 10px
- background-color: '#333'
type: 'custom:button-card'
- entity: switch.sprinkler_zone_3
gridcol: 1
gridrow: 3
name: Zone 3
size: 30px
styles:
card:
- border-radius: 10px
- background-color: '#333'
type: 'custom:button-card'
- entity: switch.sprinkler_zone_4
gridcol: 2
gridrow: 3
name: Zone 4
size: 30px
styles:
card:
- border-radius: 10px
- background-color: '#333'
type: 'custom:button-card'
- entity: switch.sprinkler_zone_5
gridcol: 1
gridrow: 4
name: Zone 5
size: 30px
styles:
card:
- border-radius: 10px
- background-color: '#333'
type: 'custom:button-card'
- entity: switch.sprinkler_zone_6
gridcol: 2
gridrow: 4
name: Zone 6
size: 30px
styles:
card:
- border-radius: 10px
- background-color: '#333'
type: 'custom:button-card'
column_width: 100%
gridcols: 50% 50%
gridrows: auto
layout: grid
type: 'custom:layout-card'
- animate: true
entities:
- entity: sensor.dark_sky_temperature
hours_to_show: 72
name: Outside Temperature
type: 'custom:mini-graph-card'
update_interval: 3600
You are totally changing the way I think about my future dashboard building here, spent the better part of the weekend familiarizing myself with this and started piecing mine together, thanks a ton for the share. Also, shout out to @tom_l for your share up top, definitely helpful as I build and familiarize with HA more and more.
Did Anyone design a PCB to reduce the wire need and make this clean ?
I am not good enough at pcb design for this 
That looks amazing @TJPoorman ! Iâm working on integrating my new ESPHome-based sprinkler node and think your Lovelace front-end is exactly what the doctor ordered!
Any chance you would share your supporting scripts, automations, inputs and sensor templates, etc. for this? I started looking at your SplHAsh YAML on GitHub, and tom_lâs examples above, as references to try and cobble something together in my HA instance. It didnât take long to convince me that your supporting scripts and components would far exceed anything I could hack together, judging from the quality and detail in your front end.
Great work, and thank you for sharing with the community!
Hey guys, I wanted to sincerely thank you for your hard work and sharing it all.
I am transforming a âdumbâ 8 zone Rain Bird system (6 zones used) into an ESP driven one. I am pretty experienced with Arduino, ESP, MQTT etc, and was finished designing the hardware part. I have plenty of Arduino board laying around, so I connected an ESP8266 to the Arduino via I2c, used the ESP as the âWiFi controllerâ and the Arduino as the I/O control (instead of the 74HC595), connected to a 8 channel relay.
I got all the switches implemented in HA, and got to a point of âsomeone in the community must have automated all thisâ. Looked in addons, HACS, and finally found this page. @tom_l, your automation scripts, sensor templates etc were a massive boost in getting this project done. Those templates arenât easy to figure out, thank you!
NowâŚof course I did scratch my head for a couple hours of templating troubleshootingâŚso my turn to share.
- platform: time_date
display_options:
- 'time'
- 'date'
This sensor need to be added to the config.Without it the âremaining timeâ doesnât work and the automation wonât trigger, but no error message will be displayed either.
AnyhowâŚonce again, thank you!!
@TJPoorman
I am very new at HA and have followed your guide for hardware and all your code you have provided. I am having one last issue though. I donât seem to have the sensor configuration for sensor.sprinkler_current_zone
Is there any way you could share that sensor config? Thank you in advance.
Iâve actually switched over to an ESP-home based approach rather than the custom code from my repo (Easier to maintain and update while Iâm trying to get everything playing nice together). This was the sensor configuration I had for the sprinkler_current_zone:
- platform: mqtt
name: "Sprinkler Current Zone"
state_topic: "yard/sprinkler/status"
availability_topic: "SplHAsh/availability"
qos: 0
payload_available: "online"
payload_not_available: "offline"
Thank you. Are you creating your own project of following someone elseâs? Was maintenance the only factor for moving away from this code? Was there reliability issues or anything?
Should be âsensorsâ not âsensorâ. Like this:
binary_sensor:
- platform: template
sensors:
zone_1_day_active:
Thanks! Ill test tomorrow and report back
Move everything on lines 7 through 24 to the right by 4 spaces.
This Template Binary Sensor will be affected by an upcoming change to the Template integration:
In a nutshell, the entity_id option is deprecated so you will have to incorporate sensor.date within the template.
What component or method are you using to get rainfall data?
