Awesome thanks. Yeah I moved off the NAS too on to a NUCi7 much better response and clears up the NAS for all media stuff. I am noticing most people use ui-lovelace.yaml over letting HASSIO create it in the .store directory. I am wondering if this is a better way to do it and more flexible to break up each page to a separate yaml file.
Not shure about the UI editor. Haven´t tryed yet.
Started with YAML mode back in the days, so I think I´ll stick with it… ¯\_(ツ)_/¯
Thought about going with packages* next, but splitting up the ui-lovelace.yaml** looks quite interesting too.
THX 4 the idea! 
*https://www.home-assistant.io/docs/configuration/packages/
**Lovelace and !include
Packages are nice in bundling a bunch of things together for a specific task (i.e. weather, system monitor, recycle, and more). It seems everyone likes the lovelace.yaml over the editor. Only issue with editor it puts everything backwards compared to the yaml file. Do you have a github of your HA configs? Love to see what you have as a whole. I am still building so not at the uploading stage yet.
Not yet…
1 Like
Hello ObiKaiKenobi,
you have an interesting option in your configuration:
Think this is to switch on and off the guest wifiof your Fritz Box?
Can you give me more information about this? How do you do this?
Thanks a lot in advance!
/Ralf
Hi Ralf,
You‘r correct. It is used to enable guest WiFi on FritzBOX.
It is a custom component which can be found here:
You could also use it to reconnect your internet connection and also to switch internet profiles of devices (which i have not testet yet).
Thanks a lot! Didin’t know this component yet…
And thanks for your fast response!
/ Ralf
@Ralf Make sure to use the updated version with a lot of new features: https://github.com/mammuth/ha-fritzbox-tools
1 Like
please note that you can also use:
{{ states.automation | count }}
shorten the code a bit 
about the input_boolean: this also triggers the update when the boolean is turned_off?
1 Like
Correct, that way when you push the button it just refreshes no matter the state of the bool.
Sweet I’ll mod this when I get home. Thanks for the tip!
Thanks, found the component, many thanks for writing this!
/Ralf
@petro is there a clean way to add a filter to calculate the total number of devices on the network? I currently have a loop that sees if the device tracker is home and is from the router. I’d prefer to have shortened version.
{% for state in states.device_tracker if(state.state == 'home' and state.attributes.source_type == 'router') -%}
{% if loop.last -%}
{{ loop.index }}
{%- endif %}
{%- else %}
0
{%- endfor %}
Found this thread Counting Open Doors & Motion Sensors? (Solved by ranting at myself) and was able to apply it to my needs to get:
#------ Number of devices on WiFi Router
connected_devices:
friendly_name: "Devices on Network"
value_template: "{{ states.device_tracker | selectattr('state', 'eq', 'home') | selectattr('attributes.source_type', 'eq', 'router') | list | count }}"
3 Likes
glad you got it sorted out
LogisticalLux,
Love your system monitor page can you share the lovelace configs?Forgot that I can access with Nabu Casa. So here the lovelance config (complete, not only the sysmonitor part). Please note that you need some additional modules!
resources:
- type: js
url: 'https://cdn.jsdelivr.net/npm/rgb-light-card'
- type: module
url: /local/mini-graph-card-bundle.js?v=0.8.1
- type: module
url: /local/card-mod.js
- type: module
url: /local/slider-entity-row.js
- type: module
url: /local/battery-entity.js?v=0.1
- type: js
url: /local/light-entity-card.js
title: LOGLUX HASSIO
views:
- badges: []
cards:
- entities:
- colors:
- brightness_pct: 25
kelvin: 3670
transition: 1
white_value: 10
- brightness: 126
kelvin: 3670
transition: 1
white_value: 10
- brightness: 186
kelvin: 3670
transition: 1
white_value: 10
- brightness_pct: 100
kelvin: 3670
transition: 1
white_value: 10
- brightness_pct: 25
rgb_color:
- 215
- 150
- 35
transition: 1
- brightness_pct: 50
rgb_color:
- 215
- 150
- 35
transition: 1
- brightness_pct: 75
rgb_color:
- 215
- 150
- 35
transition: 1
- brightness_pct: 100
rgb_color:
- 215
- 150
- 35
transition: 1
- brightness_pct: 25
icon_color: '#1450d7'
rgb_color:
- 20
- 80
- 215
transition: 1
- brightness_pct: 50
icon_color: '#1450d7'
rgb_color:
- 20
- 80
- 215
transition: 1
- brightness_pct: 75
icon_color: '#1450d7'
rgb_color:
- 20
- 80
- 215
transition: 1
- brightness_pct: 100
icon_color: '#1450d7'
rgb_color:
- 20
- 80
- 215
transition: 1
entity: light.arbeitszimmer
justify: between
size: 23
type: 'custom:rgb-light-card'
- light.arbeitszimmer
- binary_sensor.presence_3
- entity: light.arbeitszimmer
full_row: false
hide_when_off: true
name: Dim
type: 'custom:slider-entity-row'
- attribute: color_temp
entity: light.arbeitszimmer
full_row: false
name: Temperature
type: 'custom:slider-entity-row'
show_header_toggle: false
style: |
ha-card {
border-radius: 10px;
}
type: entities
- entities:
- entity: scene.test
name: Gemütliches Orange
- entity: scene.azevening
name: Helleres Weiss
style: |
ha-card {
border-radius: 10px;
}
type: entities
- entities:
- light.stehlampe
- entity: light.stehlampe
full_row: false
hide_when_off: true
name: Dim
type: 'custom:slider-entity-row'
- attribute: color_temp
entity: light.stehlampe
full_row: false
name: Temperature
type: 'custom:slider-entity-row'
style: |
ha-card {
border-radius: 10px;
}
type: entities
- entities:
- light.kuchenschrank
- binary_sensor.bewegungsmelder_kueche
- entity: light.kuchenschrank
full_row: false
hide_when_off: true
name: Dim
type: 'custom:slider-entity-row'
- attribute: color_temp
entity: light.kuchenschrank
full_row: false
name: Temperature
type: 'custom:slider-entity-row'
style: |
ha-card {
border-radius: 10px;
}
type: entities
- entities:
- light.tischlampe
- entity: light.tischlampe
full_row: false
hide_when_off: true
name: Dim
type: 'custom:slider-entity-row'
- attribute: color_temp
entity: light.tischlampe
full_row: false
name: Temperature
type: 'custom:slider-entity-row'
style: |
ha-card {
border-radius: 10px;
}
type: entities
- entities:
- light.kuche
- binary_sensor.bewegungsmelder_kueche
- entity: light.kuche
full_row: false
hide_when_off: true
name: Dim
type: 'custom:slider-entity-row'
- attribute: color_temp
entity: light.kuche
full_row: false
name: Temperature
type: 'custom:slider-entity-row'
style: |
ha-card {
border-radius: 10px;
}
type: entities
- entities:
- light.innr_terasse
- entity: light.innr_terasse
full_row: false
hide_when_off: true
name: Dim
type: 'custom:slider-entity-row'
- attribute: color_temp
entity: light.innr_terasse
full_row: false
name: Temperature
type: 'custom:slider-entity-row'
style: |
ha-card {
border-radius: 10px;
}
type: entities
- entities:
- light.schlafzimmer
- entity: light.schlafzimmer
full_row: false
hide_when_off: 'off'
name: Dim
type: 'custom:slider-entity-row'
- attribute: color_temp
entity: light.schlafzimmer
full_row: false
name: Temperature
type: 'custom:slider-entity-row'
style: |
ha-card {
border-radius: 10px;
}
type: entities
icon: 'mdi:brightness-6'
panel: false
path: default_view
theme: Backend-selected
title: Home
- badges: []
cards:
- entities:
- entity: sensor.processor_use
hours_to_show: 48
icon: 'mdi:cpu-64-bit'
name: CPU Hassio in %
points_per_hour: 1
show:
graph: bar
style: |
ha-card {
border-radius: 10px;
}
type: 'custom:mini-graph-card'
- entities:
- entity: sensor.rpi_cpu_temperature
hours_to_show: 48
icon: 'mdi:cpu-64-bit'
name: CPU Temperature
points_per_hour: 1
show:
graph: bar
style: |
ha-card {
border-radius: 10px;
}
type: 'custom:mini-graph-card'
- entities:
- entity: sensor.load_15m
- entity: sensor.load_5m
- entity: sensor.load_1m
height: 65
hours_to_show: 12
icon: 'mdi:download-network'
name: Load last 15/5/1 Minutes
points_per_hour: 1
show:
graph: bar
style: |
ha-card {
border-radius: 10px;
}
type: 'custom:mini-graph-card'
- entities:
- entity: binary_sensor.remote_ui
icon: 'mdi:remote-desktop'
secondary_info: last-changed
- entity: sensor.ipv4_address_eth0
icon: 'mdi:ip'
secondary_info: last-changed
- entity: sensor.last_boot
secondary_info: last-changed
- entity: sensor.system_id
- entity: sensor.network_throughput_in_eth0
secondary_info: last-changed
- entity: sensor.network_throughput_out_eth0
secondary_info: last-changed
- entity: sensor.packets_in_eth0
secondary_info: last-changed
- entity: sensor.packets_out_eth0
secondary_info: last-changed
- entity: sensor.swap_free
secondary_info: last-changed
- entity: sensor.swap_use
secondary_info: last-changed
- entity: sensor.swap_use_percent
secondary_info: last-changed
- entity: sensor.disk_free_home
secondary_info: last-changed
- entity: sensor.disk_use_home
secondary_info: last-changed
- entity: sensor.snapshot_backup
icon: 'mdi:cloud-upload'
name: Snapshot Status
secondary_info: last-changed
show_header_toggle: false
style: |
ha-card {
border-radius: 10px;
}
title: IP / UPTIME / HDD
type: entities
- entities:
- sensor.memory_use_percent
hours_to_show: 48
icon: 'mdi:memory'
line_color: '#ccff00'
name: Mem use in %
points_per_hour: 1
show:
fill: true
graph: bar
style: |
ha-card {
border-radius: 10px;
}
type: 'custom:mini-graph-card'
- entities:
- sensor.memory_free
hours_to_show: 48
icon: 'mdi:memory'
line_color: '#ccff00'
name: Mem free
points_per_hour: 1
show:
fill: true
graph: bar
style: |
ha-card {
border-radius: 10px;
}
type: 'custom:mini-graph-card'
- entities:
- sensor.memory_use
hours_to_show: 48
icon: 'mdi:memory'
line_color: '#ccff00'
name: Mem used
points_per_hour: 1
show:
fill: true
graph: bar
style: |
ha-card {
border-radius: 10px;
}
type: 'custom:mini-graph-card'
- entities:
- entity: sensor.disk_use_percent_home
hours_to_show: 48
icon: 'mdi:harddisk'
line_color: '#0099ff'
name: Disk use in %
points_per_hour: 1
show:
graph: bar
style: |
ha-card {
border-radius: 10px;
}
type: 'custom:mini-graph-card'
- entities:
- entity: sensor.disk_free_home
hours_to_show: 48
icon: 'mdi:harddisk'
line_color: '#0099ff'
name: Disk free in GB
points_per_hour: 1
show:
graph: bar
style: |
ha-card {
border-radius: 10px;
}
type: 'custom:mini-graph-card'
- entities:
- entity: sensor.disk_use_home
hours_to_show: 48
icon: 'mdi:harddisk'
line_color: '#0099ff'
name: Disk used in GB
points_per_hour: 1
show:
graph: bar
style: |
ha-card {
border-radius: 10px;
}
type: 'custom:mini-graph-card'
- entities:
- entity: sensor.network_throughput_in_eth0
hours_to_show: 48
icon: 'mdi:server'
line_color: '#c20f3e'
name: Network Throughput IN
points_per_hour: 1
show:
graph: bar
style: |
ha-card {
border-radius: 10px;
}
type: 'custom:mini-graph-card'
- entities:
- entity: sensor.network_in_eth0
hours_to_show: 48
icon: 'mdi:upload-network'
line_color: '#c20f3e'
name: Net Bandwith IN
points_per_hour: 1
show:
graph: bar
style: |
ha-card {
border-radius: 10px;
}
type: 'custom:mini-graph-card'
- entities:
- entity: sensor.network_throughput_out_eth0
hours_to_show: 48
icon: 'mdi:server'
line_color: '#c20f3e'
name: Network Throughput OUT
points_per_hour: 1
show:
graph: bar
style: |
ha-card {
border-radius: 10px;
}
type: 'custom:mini-graph-card'
- entities:
- entity: sensor.network_out_eth0
hours_to_show: 48
icon: 'mdi:upload-network'
line_color: '#c20f3e'
name: Net Bandwith OUT
points_per_hour: 1
show:
graph: bar
style: |
ha-card {
border-radius: 10px;
}
type: 'custom:mini-graph-card'
icon: 'mdi:server'
path: netzwerk
title: SYSTEM
- badges: []
cards:
- cards:
- entities:
- entity: sensor.temperature_18
height: 100
hours_to_show: 24
line_color: '#306080'
line_width: 2
name: Arbeitszimmer Temp
points_per_hour: 1
refresh_interval: 0
show:
graph: bar
style: |
ha-card {
border-radius: 10px;
}
type: 'custom:mini-graph-card'
- entities:
- entity: sensor.humidity_19
height: 100
hours_to_show: 24
line_width: 2
name: Arbeitszimmer Humidity
points_per_hour: 1
refresh_interval: 0
show:
graph: bar
style: |
ha-card {
border-radius: 10px;
}
type: 'custom:mini-graph-card'
title: Arbeitszimmer
type: horizontal-stack
- cards:
- entities:
- entity: sensor.temperature_20
height: 100
hours_to_show: 24
line_color: '#306080'
line_width: 2
name: Bad Temp
points_per_hour: 1
refresh_interval: 0
show:
graph: bar
type: 'custom:mini-graph-card'
- entities:
- entity: sensor.humidity_21
height: 100
hours_to_show: 24
line_width: 2
name: Bad Humidity
points_per_hour: 1
refresh_interval: 0
show:
graph: bar
type: 'custom:mini-graph-card'
title: Bad
type: horizontal-stack
- cards:
- entities:
- entity: sensor.temperature_22
font_size: 100
height: 100
hours_to_show: 24
line_color: '#306080'
line_width: 2
name: Küche Temp
points_per_hour: 1
refresh_interval: 0
show:
graph: bar
type: 'custom:mini-graph-card'
- entities:
- entity: sensor.humidity_23
font_size: 100
height: 100
hours_to_show: 24
line_width: 2
name: Küche Humidity
points_per_hour: 1
refresh_interval: 0
show:
graph: bar
type: 'custom:mini-graph-card'
title: Küche
type: horizontal-stack
- cards:
- entities:
- entity: sensor.temperature_16
height: 100
hours_to_show: 24
line_color: '#306080'
line_width: 2
name: Schlafzimmer Temp
points_per_hour: 1
refresh_interval: 0
show:
graph: bar
type: 'custom:mini-graph-card'
- entities:
- entity: sensor.humidity_17
height: 100
hours_to_show: 24
line_width: 2
name: Schlafzimmer Humidity
points_per_hour: 1
refresh_interval: 0
show:
graph: bar
type: 'custom:mini-graph-card'
title: Schlafzimmer
type: horizontal-stack
- cards:
- entities:
- entity: sensor.temperature_12
font_size: 100
height: 100
hours_to_show: 24
line_color: '#306080'
line_width: 2
name: Storage Temp
points_per_hour: 1
refresh_interval: 0
show:
graph: bar
type: 'custom:mini-graph-card'
- entities:
- entity: sensor.humidity_13
font_size: 100
height: 100
hours_to_show: 24
line_width: 2
name: Storage Humidity
points_per_hour: 1
refresh_interval: 0
show:
graph: bar
type: 'custom:mini-graph-card'
title: Storage
type: horizontal-stack
- cards:
- entities:
- entity: sensor.temperature_14
font_size: 100
hours_to_show: 24
line_color: '#306080'
line_width: 2
name: Wohnzimmer Temp
points_per_hour: 1
refresh_interval: 0
show:
graph: bar
type: 'custom:mini-graph-card'
- entities:
- entity: sensor.humidity_15
height: 100
hours_to_show: 24
line_width: 2
name: Wohnzimmer Humidity
points_per_hour: 1
refresh_interval: 0
show:
graph: bar
type: 'custom:mini-graph-card'
title: Wohnzimmer
type: horizontal-stack
- cards:
- entities:
- entity: sensor.owm_temperature
font_size: 100
height: 100
hours_to_show: 24
line_color: '#306080'
line_width: 2
name: Temperature
points_per_hour: 1
refresh_interval: 0
show:
graph: bar
type: 'custom:mini-graph-card'
- entities:
- entity: sensor.owm_humidity
font_size: 100
height: 100
hours_to_show: 24
line_width: 2
name: Humidity
points_per_hour: 1
refresh_interval: 0
show:
graph: bar
type: 'custom:mini-graph-card'
title: OWM Weather
type: horizontal-stack
- cards:
- entities:
- entity: sensor.owm_wind_speed
font_size: 100
height: 50
hours_to_show: 24
icon: 'mdi:weather-windy'
line_color: '#306080'
line_width: 2
name: Wind Speed in m/s
points_per_hour: 1
refresh_interval: 0
show:
graph: bar
type: 'custom:mini-graph-card'
title: Wind Speed
type: horizontal-stack
- entity: weather.openweathermap
name: Malsch
type: weather-forecast
- aspect_ratio: 75%
type: iframe
url: >-
https://embed.windy.com/embed2.html?lat=48.878&lon=8.343&zoom=11&level=surface&overlay=temp&menu=&message=true&marker=true&calendar=now&pressure=true&type=map&location=coordinates&detail=true&detailLat=48.878&detailLon=8.343&metricWind=km%2Fh&metricTemp=%C2%B0C&radarRange=-1
icon: 'mdi:home-thermometer'
path: klima-intern
title: Klima Intern
- badges: []
cards:
- entities:
- entity: device_tracker.huawei_mate_20_pro_b964c1_fritz_box
icon: 'mdi:cellphone-android'
name: Mate 20 Pro (NAT)
secondary_info: last-changed
track: true
- entity: device_tracker.zteaxon7_fritz_box
icon: 'mdi:cellphone-android'
name: Axon 7 (MIC)
secondary_info: last-changed
track: true
- entity: device_tracker.huawei_mediapad_m5_lite_1_fritz_box
icon: 'mdi:tablet'
name: Huawei Media Pad Lite
secondary_info: last-changed
track: true
- entity: device_tracker.raspberrypi_fritz_box_2
icon: 'mdi:server-network'
secondary_info: last-changed
- entity: device_tracker.fritz_box
icon: 'mdi:router'
name: Fritz Box
secondary_info: last-changed
- entity: device_tracker.amazon_1f41ee492_fritz_box
icon: 'mdi:remote-tv'
secondary_info: last-changed
- entity: device_tracker.philips_hue_fritz_box
icon: 'mdi:lamp'
name: Hue Bridge
secondary_info: last-changed
- entity: device_tracker.tv08c40ca0802d_fritz_box
icon: 'mdi:television'
secondary_info: last-changed
- entity: device_tracker.loglux_pc_fritz_box
icon: 'mdi:monitor-multiple'
secondary_info: last-changed
- entity: device_tracker.loglux_htpc_fritz_box
icon: 'mdi:monitor-multiple'
name: HTPC
secondary_info: last-changed
show_header_toggle: false
title: Netzwerk Devices
type: entities
icon: 'mdi:network'
path: network
title: NETWORK
- badges: []
cards:
- entities:
- entity: binary_sensor.openclose_10
- entity: binary_sensor.openclose_11
show_header_toggle: false
title: Türsensoren
type: entities
- entities:
- entity: binary_sensor.presence_3
- entity: light.arbeitszimmer
- entity: automation.bewegung_arbeitszimmer
show_header_toggle: false
title: Arbeitszimmer Bewegung
type: entities
- entities:
- entity: binary_sensor.presence_25
name: Sensor
- entity: light.schlafzimmer
- entity: automation.bewegung_schlafzimmer
show_header_toggle: false
title: Schlafzimmer Bewegung
type: entities
- entities:
- entity: binary_sensor.bewegungsmelder_kueche
- entity: light.kuche
- entity: light.kuchenschrank
- entity: automation.bewegung_kuche
show_header_toggle: false
title: Küche Bewegung
type: entities
- entities:
- entity: automation.bewegung_arbeitszimmer
- entity: automation.bewegung_arbeitszimmer_2_minuten_aus
- entity: automation.bewegung_kuche
- entity: automation.bewegung_kuche_2_minuten_aus
- entity: automation.haustur_geoffnet
- entity: automation.terassentur_auf_licht
- entity: automation.terasse_licht_aus
- entity: automation.set_theme_on_start
- entity: automation.bewegung_schlafzimmer
- entity: automation.delta_trap
name: Test Switch
show_header_toggle: false
title: Automatisierung
type: entities
icon: 'mdi:motion-sensor'
path: movement
title: Movement
- badges: []
cards:
- entities:
- entity: sensor.bewegungsmelder_battery_level
- entity: sensor.bewegungsmelder_kueche_battery_level
- entity: sensor.dimmschalter_battery_level_2
- entity: sensor.thermo_sensor_abstell_battery_level
- entity: sensor.thermo_sensor_arbeitszimmer_battery_level
- entity: sensor.thermo_sensor_schlafzimmer_battery_level
- entity: sensor.thermo_sensor_wohnzimmer_battery_level
- entity: sensor.thermo_sensor_bad_battery_level
name: Thermo Sensor Bad Battery
- entity: sensor.thermo_sensor_kueche_battery_level
name: Thermo Sensor Küche Battery
- entity: sensor.tuerkontaktsensor_az_battery_level
- entity: sensor.tuerkontaktsensor_ht_battery_level
show_header_toggle: false
title: Sys Power
type: entities
icon: 'mdi:battery'
path: battery
title: BATTERY
And here the theme for it (put it in themes.yaml):
Navy Blue & Yellow:
### Main Interface Colors ###
primary-color: "#FEB221"
light-primary-color: "#FECA67"
primary-background-color: "#1F2635"
secondary-background-color: var(--primary-background-color)
divider-color: "#2D374D"
### Text ###
primary-text-color: "#FBFBFB"
secondary-text-color: "#FEB221"
text-primary-color: "#FBFBFB"
disabled-text-color: "#4A5E84"
### Sidebar Menu ###
sidebar-icon-color: "#8192B6"
sidebar-text-color: "#FBFBFB"
sidebar-selected-background-color: var(--primary-background-color)
sidebar-selected-icon-color: "#FEB221"
sidebar-selected-text-color: var(--sidebar-selected-icon-color)
### States and Badges ###
state-icon-color: "#FEAA0A"
state-icon-active-color: "#FEF5D8"
state-icon-unavailable-color: var(--disabled-text-color)
### Sliders ###
paper-slider-knob-color: "#FEB221"
paper-slider-knob-start-color: var(--paper-slider-knob-color)
paper-slider-pin-color: var(--paper-slider-knob-color)
paper-slider-active-color: var(--paper-slider-knob-color)
paper-slider-secondary-color: var(--light-primary-color)
### Labels ###
label-badge-background-color: "#3E4C6C"
label-badge-text-color: "#FBFBFB"
label-badge-red: "#252D40"
### Cards ###
paper-card-background-color: "#252D40"
paper-listbox-background-color: var(--primary-background-color)
### Toggles ###
paper-toggle-button-checked-button-color: "#FEB221"
paper-toggle-button-checked-bar-color: "#FECA67"
paper-toggle-button-unchecked-button-color: "#6E81AA"
paper-toggle-button-unchecked-bar-color: "#3E4C6C"
### Table row ###
table-row-background-color: var(--primary-background-color)
table-row-alternative-background-color: var(--secondary-background-color)
3 Likes
Thank for the post.
What do you use to monitor if things are broken/disconnected as in your previous screencap?