Just thought I’d share a quick and easy way of making your own screen saver on HA.
This is based off of Thomas Loven’s wonderful browser_mod (kudos to you for sharing your great work), in particular this is a tweak to the pop up card.
Editing the following lines in the browser_mod.js (from line 82) file will take care of making the card full screen (in a Kindle Fire HD9, for a different device just tweak the values below), so here’s the line before the change:
:host([large]) .content {
width: calc(90vw - 48px);
}
and after editing:
:host([large]) .content {
// width: calc(90vw - 48px);
width: 100vw;
height: 100vw;
margin: -100px -24px;
}
This will only apply to the cards that have the option large:true enabled (which I only use for the screen saver), meaning it won’t affect all the great work that you’ve already done on your popup cards.
Then the following automation gets executed every two minutes to call the full screen popup card (ie our screen saver):
- id: '1234567'
alias: Screen Saver
description: ''
trigger:
- platform: time_pattern
minutes: /2
condition: []
action:
- service: browser_mod.popup
data:
hide_header: true
large: true
deviceID: kindle
title: Screen saver
auto_close: true
card:
cards:
- elements:
- aspect_ratio: 10%
entity: sensor.time
style:
color: '#ffffff'
font-size: 8.5vw
left: 77.5%
top: 50%
type: state-label
- entity: sensor.weather_icon_template
style:
left: 30.5%
top: 35%
transform: scale(1.5,1.5)
type: state-icon
- entity: sensor.date_template
style:
color: '#ffffff'
font-size: 3vw
left: 77.5%
top: 60%
type: state-label
- entity: sensor.dark_sky_temp_template
style:
color: '#ffffff'
font-size: 5vw
left: 20%
top: 38%
suffix: °
type: state-label
- entity: sensor.home_temp_template
style:
color: '#ffffff'
font-size: 15vw
left: 25%
top: 25%
suffix: °
type: state-label
image: /local/images/Bg-mobile.png
type: picture-elements
type: vertical-stack
mode: single
Here’s the final (minimalistic) result:
Of course this can be customized by choosing your favourite background picture (simply edit the “image: /local/images/Bg-mobile.png” to point to your image et voila’).
Given that we have enabled the autoclose option for this card (auto_close: true in the automation code above), tapping anywhere on the screen will close the card.
