Inspired by Home-Assistant Pool Monitor Card v2 I created this openHAB Widget.
Screenshots
t.b.d.
Changelog
- v0.1
- initial beta version - using hard coded items
- v0.2
- show target values (time and ORP), only when active
Resources
uid: pool_monitor_card
tags: []
props:
parameters: []
parameterGroups: []
timestamp: Jun 29, 2025, 8:46:58 AM
component: f7-card
config:
style:
border-radius: 12px
padding: 2%
width: 196%
title: 🏊 Pool Monitor
slots:
default:
- component: f7-block
config:
style:
padding: 0
slots:
default:
- component: Label
config:
style:
font-size: 1em
font-weight: bold
margin-top: 12px
text: "='🌡️ Water Temperature: ' + items.ICOpool_Temperature.state"
- component: f7-block
config:
style:
background: linear-gradient(to right, blue 0%, green 25%, orange 50%, red 100%)
border-radius: 8px
height: 20px
margin-bottom: -19px
position: relative
z-index: 5
- component: oh-slider
config:
color: "=(Number.parseFloat(items.ICOpool_Temperature.state.split(' ')[0]) < 25)
? 'orange' :
((Number.parseFloat(items.ICOpool_Temperature.state.split('
')[0]) > 28) ? 'orange' : 'green')"
disabled: true
item: ICOpool_Temperature
max: 40
min: 5
style:
margin-bottom: 12px
position: relative
z-index: 50
- component: Label
config:
style:
font-size: 1em
font-weight: bold
text: "='🧪 PH level: ' + items.ICOpool_PH.state"
- component: f7-block
config:
style:
background: linear-gradient(to right, red 20%, green 50%, red 80%)
border-radius: 8px
height: 20px
margin-bottom: -19px
z-index: 5
- component: oh-slider
config:
color: "=(Number.parseFloat(items.ICOpool_PH.state.split(' ')[0]) < 7.2) ?
'orange' : ((Number.parseFloat(items.ICOpool_PH.state.split('
')[0]) > 7.6) ? 'orange' : 'green')"
disabled: true
item: ICOpool_PH
max: 8.6
min: 6.2
step: 0.1
style:
margin-bottom: 12px
z-index: 50
- component: Label
config:
style:
font-size: 1em
font-weight: bold
text: "='🧼 ORP: ' + items.ICOpool_OxydoReductionPotential.state"
- component: f7-block
config:
style:
background: linear-gradient(to right, red 0%, green 50%, red 100%)
border-radius: 8px
height: 20px
margin-bottom: -19px
z-index: 5
- component: oh-slider
config:
color: "=(Number.parseFloat(items.ICOpool_OxydoReductionPotential.state.split('
')[0]) < 650) ? 'orange' :
((Number.parseFloat(items.ICOpool_OxydoReductionPotential.state\
.split(' ')[0]) > 750) ? 'orange' : 'green')"
disabled: true
item: ICOpool_OxydoReductionPotential
max: 800
min: 500
step: 0.1
style:
margin-bottom: 12px
z-index: 50
- component: Label
config:
style:
font-size: 1em
font-weight: bold
text: "='🧂 Salinity: ' + items.ICOpool_Salt.state"
- component: f7-block
config:
style:
background: linear-gradient(to right, red 0%, green 50%, red 100%)
border-radius: 8px
height: 20px
margin-bottom: -19px
z-index: 5
- component: oh-slider
config:
color: "=(Number.parseFloat(items.ICOpool_Salt.state.split(' ')[0]) < 2500) ?
'orange' : ((Number.parseFloat(items.ICOpool_Salt.state.split('
')[0]) > 3500) ? 'orange' : 'green')"
disabled: true
item: ICOpool_Salt
max: 4000
min: 2000
step: 0.1
style:
margin-bottom: 12px
z-index: 50
- component: f7-row
slots:
default:
- component: f7-col
config:
align: right
width: auto
slots:
default:
- component: Label
config:
style:
font-size: 1em
font-weight: bold
text: 💦
- component: f7-col
config:
width: auto
slots:
default:
- component: oh-toggle
config:
color: blue
item: ShellyPoolControl_FlowPower_Power
action: rule
actionRule: PoolControl_StartStopFlow
- component: f7-col
config:
align: right
width: auto
slots:
default:
- component: Label
config:
style:
font-size: 1em
font-weight: bold
text: 🧼
- component: f7-col
config:
width: auto
slots:
default:
- component: oh-toggle
config:
color: pink
item: ShellyPoolControl_ChlorinatorPower_Power
action: rule
actionRule: PoolControl_StartStopChlorinator
- component: f7-col
config:
align: right
width: auto
slots:
default:
- component: Label
config:
style:
font-size: 1em
font-weight: bold
text: 🔋
- component: f7-col
config:
width: auto
slots:
default:
- component: oh-toggle
config:
color: green
disabled: true
item: ShellyPoolControl_ChlorinatorPhase_Power
- component: f7-row
slots:
default:
- component: f7-col
config:
align: right
width: auto
slots:
default:
- component: Label
config:
style:
font-size: 1em
font-weight: bold
text: "=(items.PoolControl_CurrentEnd.state !== 'NULL' &&
items.PoolControl_CurrentEnd.state !== 'UNDEF') ?
'⏲' : ''"
- component: f7-col
config:
align: left
width: auto
slots:
default:
- component: Label
config:
style:
color: gray
font-size: 1em
font-weight: bold
text: =items.PoolControl_CurrentEnd.displayState
- component: f7-col
config:
align: right
width: auto
slots:
default:
- component: Label
config:
style:
font-size: 1em
font-weight: bold
text: "=(items.ShellyPoolControl_ChlorinatorPower_Power.state == 'ON') ? '🎯' :
''"
- component: f7-col
config:
align: left
width: auto
slots:
default:
- component: Label
config:
style:
color: gray
font-size: 1em
font-weight: bold
text: "=(items.ShellyPoolControl_ChlorinatorPower_Power.state == 'ON') ?
items.PoolControl_ORPTarget.state : ''"
- component: f7-col
config:
align: right
width: auto
slots:
default:
- component: Label
config:
style:
font-size: 1em
font-weight: bold
text: 🔌
- component: f7-col
config:
align: left
width: auto
slots:
default:
- component: Label
config:
style:
color: gray
font-weight: bold
font-size: 1em
text: =items.ShellyPool_PowerConsumption.state