Nope. I have it on two tablets and am running everything up to date. Both are working fine.
I have the same problem and get the following error message:
Uncaught error from Chrome WebView 107.0.5304.105 on Android 8.1.0 TypeError: Cannot read properties of undefined (reading āeditModeā) _createCardElement (src/panels/lovelace/views/hui-view.ts:79:36) /hacsfiles/lovelace-wallpanel/wallpanel.js:1146:53 WallpanelView.createInfoBoxContent (/hacsfiles/lovelace-wallpanel/wallpanel.js:1132:17) WallpanelView.startScreensaver (/hacsfiles/lovelace-wallpanel/wallpanel.js:2090:8) WallpanelView.timer (/hacsfiles/lovelace-wallpanel/wallpanel.js:769:10)
Itās working fine again after an update to version v4.25.4
Thanks!
it seems HEIC is not supported on HA itself, not able to view any HEIC files in media browser within HA
1 Like
Is anyone else also facing the same issue?
@clintferns77 Maybe, my screensavers have stopped working on one set of dashboards for sure recently. Did you fix it?
My error is
TypeError: Cannot read properties of undefined (reading 'editMode')
at WallpanelView.value (hui-view.ts:79:37)
at wallpanel.js?hacstag..95064164254:1149:53
at Array. forEach (ā¹anonymous>)
at WallpanelView.createInfoBoxContent (wallpanel.js?hacstag...95064164254:1135:17)
at WallpanelView.startScreensaver (wallpanel.js?hacstag...095064164254: 2098:8)
at WallpanelView.timer (wallpanel.js?hacstag...095064164254:772:10)
Latest HA and latest WP as of right now
Just fixed it once on Edge then it failed again by clearing the cache. Screensaver loaded, but itās now doing the same again minutes after, even if I now clear the cache
Edit: Seems to be coming to life over time. Multiple cache clears and itās now seemingly reliable, if that helps anyoneā¦
Hello, Iām trying to customize my wallpanel layout.
Instead of having all the cards in the top left part of the screen, I try to position a part of the cards on the right side of the screen.
I read the doc but donāt understant how to use the CSS. I also tried with layout-card, but no success.
Then I found the following post in this discussion. My question may be stupid, but I really donāt understand how to use this.
Should I replace ācontent: Card1ā with my card content?
Thanks a lot for your help 
Hello,
Iāve been trying to get a wall panel screen saver setup that has a semi transparent calendar, clock, and weather with a background slideshow. Iāve been trying for hours and canāt get the cards to fit properly on the screen. Theyāre either small and only taking up a quarter or so of the screen, or theyāre extremely over-sized. Hereās the code Iām using right now which results in the over-sized problem. Iām also attaching a pic for reference. (I know I have 2 weather cards right now, itās just for fit check). Iāve tried every combo of width: 100%, āāwp-card-widthā: 100%, etc, but I canāt get it to simply fill the screen.
The background slideshow is working perfectly at least.
How do I accomplish my goal?
wallpanel:
enabled: true
hide_toolbar: false
hide_sidebar: false
fullscreen: false
image_background: color
image_fit: contain
image_order: random
image_url: /local/Backgrounds
idle_time: 2
fade_in_time: 3
crossfade_time: 2
display_time: 60
control_reactivation_time: 0.5
keep_screen_on_time: 0
show_progress_bar: true
style:
wallpanel-screensaver-info-box:
'--wp-card-width': 100%
width: 100%
height: 100%
cards:
- type: vertical-stack
cards:
- type: horizontal-stack
cards:
- type: custom:clock-weather-card
entity: weather.forecast_home
sun_entity: sun.sun
weather_icon_type: line
animated_icon: true
forecast_rows: 1
locale: en-GB
time_pattern: HH:mm:ss
time_format: 24
date_pattern: ccc, d.MM.yy
hide_today_section: false
hide_forecast_section: false
show_humidity: true
hide_clock: false
hide_date: false
hourly_forecast: false
use_browser_time: false
show_decimal: false
- type: weather-forecast
entity: weather.forecast_home
forecast_type: weekly
- type: calendar
initial_view: dayGridMonth
entities:
- calendar.birthdays
- calendar.holidays
- calendar.family
- calendar.work_meetings
title: Full-Screen Calendar
I need help on what to use in enabled_on_tabs. The dashboard name is Tablet and the name of the tab is nesthome. If I remove it, the screensaver shows up everywhere. I only want it to show up in the āTabletā dashboard. How do I find the name I should be using here
wallpanel:
enabled: true
hide_toolbar: false
hide_sidebar: false
fullscreen: false
image_fit: cover
enabled_on_tabs:
- nesthub
screensaver_entity: input_boolean.screensaver_hub1
display_time: 15
idle_time: 60
image_url: media-entity://camera.google_photos_favorites_media
cards:
- type: markdown
content: ' {{ states(''sensor.timenew'') }}'
card_mod:
style: |
ha-card {
font-size: 80px;
font-weight: 250;
}
- type: markdown
content: >-
{{ states('sensor.weekday') }}, {{ states('sensor.month') }} {{
now().day }}
card_mod:
style: |
ha-card {
font-size: 15px;
font-weight: 300;
}
- type: custom:atomic-calendar-revive
enableModeChange: true
firstDayOfWeek: 1
maxDaysToShow: 7
maxEventCount: 6
disableEventLink: true
disableLocationLink: true
refreshInterval: 60
showWeekDay: true
entities:
- calendar.anniversaries
- type: custom:simple-weather-card
entity: weather.home
name: ' '
style:
wallpanel-screensaver-info-box:
'--wp-card-width': 420px
background-color: '#00000099'
box-shadow: >-
0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0,
0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12)
wallpanel-screensaver-info-box-content:
'--ha-card-background': none
'--ha-card-box-shadow': none
'--ha-card-border-width': 0px
'--primary-background-color': '#111111'
'--secondary-background-color': '#202020'
'--primary-text-color': '#e1e1e1'
'--secondary-text-color': '#9b9b9b'```Hi there,
I am using fully kiosk browser in conjuntion with wall panel and for the most part it works great, but there is something within my fully kiosk settings that stops the screen saver within 24 hours every time and for the life of me I canāt figure out what setting is doing that. I am sure its something within fully kiosk browser because using the wall panel dashboard on my home computer activates the screen saver perfectly fine and it continues moving through photos without issue. I am using the google photos integration with it if that helps.
Has anyone got any ideas what could be causing this?
Thanks!
My code is as followsā¦ and I still donāt get any images! Everything else works. I just get a black background.
wallpanel:
enabled: true
hide_toolbar: false
hide_sidebar: false
fullscreen: true
idle_time: 5
image_url: https://source.unsplash.com/random/${1920}x${1080}?dogs,cats,nature
info_animation_duration_x: 30
info_animation_duration_y: 30
cards:
- type: vertical-stack
cards:
- type: custom:weather-card
details: true
forecast: true
hourly_forecast: false
name: Weather
entity: weather.inicio
current: true
number_of_forecasts: '6'
your image url is wrong. ?Unsplash now requires you to register and get an api.
the url will then be:
image_url: >-
https://api.unsplash.com/photos/random?client_id=YOUR-API-HERE&query=dogs,cats,nature
1 Like
A stupid question arose:
in client_id=YOUR-API-HERE
enter:
Application ID
Access Key
Secret key
???
Hi, Iāve been using Wallpanel for a couple years and until recently everything has worked great, but after some update, the card styling completely broke, and the card just look like default cards. Other features of wallpanel like hiding the sidebar work great still. Does anyone know why this might be?
Hereās some example yaml:
wallpanel:
enabled: false
profiles:
user.tablet:
enabled: true
hide_toolbar: true
hide_sidebar: true
fullscreen: true
screensaver_entity: input_boolean.screensaver_tablet
idle_time: 0
style:
wallpanel-screensaver-container:
background-color: '#333333dd'
wallpanel-screensaver-info-box:
'--wp-card-width': 450px
background-color: '#ffffff99'
box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12)
wallpanel-screensaver-info-box-content:
'--ha-card-background': none
'--ha-card-box-shadow': none
'--ha-card-border-width': 0px
'--primary-background-color': '#fafafa'
'--secondary-background-color': '#e5e5e5'
'--primary-text-color': '#212121'
'--secondary-text-color': '#727272'
title: Home
views:
- title: Main
icon: mdi:home-outline
background: center / cover no-repeat fixed url('http://192.168.1.13:8000/random-query?query=ocean')
cards:
- type: energy-usage-graph
title: Energy Usage
- type: energy-gas-graph
title: Gas Usage
And it looks like this:
Thank you!
Someone with more experience than me would know if it is possible and if it is possible, give me a way.
How to display wallpaper according to the weatherā¦ for example, if the weather is clear, you can display nature etcā¦ now what if you want to display only rain photos!
i try this codo:
image_url: >-
https://api.unsplash.com/photos/random?client_id={MY ID}&query={{
states('weather.inicio') }}&sig={{ now().timestamp() }}
i try
image_url: >-
https://api.unsplash.com/photos/random?client_id={my key}&query=${entity:weather.inicio}
I have tried to use profiles with a query but its not working.
image_url: >-
{% if states('weather.forecast_home') == 'sunny' %}
https://api.unsplash.com/photos/random?MYAPI&query=sunny,sun,sunny-day
{% elif states('weather.forecast_home') == 'cloudy' %}
https://api.unsplash.com/photos/random?MYAPI&query=cloudy,overcast,overcast-day
{% elif states('weather.forecast_home') == 'rainy' %}
https://api.unsplash.com/photos/random?MYAPI&query=rainy,wet,rainy-day
{% elif states('weather.forecast_home') == 'snowy' %}
https://api.unsplash.com/photos/random?MYAPI&query=snowy,winter,snowy-day
{% elif states('weather.forecast_home') == 'stormy' %}
https://api.unsplash.com/photos/random?MYAPI&query=stormy,thunderstorm,thunderstorm-day
{% if states('weather.forecast_home') == 'partlycloudy' %}
https://api.unsplash.com/photos/random?MYAPI&query=partly-cloudy,partly-cloudy-day
{% if states('weather.forecast_home') == 'fog' %}
https://api.unsplash.com/photos/random?MYAPI&query=foggy,foggy-day
{% if states('weather.forecast_home') == 'lightning-rainy' %}
https://api.unsplash.com/photos/random?MYAPI&query=lightning-rainy,lightning-rainy-day-time
{% if states('weather.forecast_home') == 'snowy-rainy' %}
https://api.unsplash.com/photos/random?MYAPI&query=foggy,snow-rain-day,snow-rain
{% else %}
https://api.unsplash.com/photos/random?MYAPI&query=weather
{% endif %}
But I cant get it to work as well. Maybe you can try and see if you can get it to work?
1 Like
Dude, it seems to have worked!! Letās see how it works in our daily lives.
Thank you very much for sharing! But hereās a tip. I played on chatgpt and it fixed some ifelse entries.
Sometimes it calls something that doesnāt existā¦ but itās getting better.
1 Like