webviewscreensaver icon indicating copy to clipboard operation
webviewscreensaver copied to clipboard

Full screen YouTube

Open firewall00110 opened this issue 11 months ago • 1 comments

I'd like to stream a full screen YouTube stream as my screen saver. As it is it just has the default website with a playlist on the right. Is there a way to make the stream full screen?

firewall00110 avatar Jan 18 '25 19:01 firewall00110

There are already hints how to do it in #60 or #38 This is based around YouTube Embed videos & playlists.

  1. Head over to your favorite video or playlist e.g. https://www.youtube.com/watch?v=OID2uKeZL18&list=PLbAFXJC0J5GaupX-BYDsT12YfCUppoxHc
  2. Click Share > Embed > Copy and you'll get something similar to:
<iframe width="560" height="315" src="https://www.youtube.com/embed/OID2uKeZL18?si=rzda01lDfmUlfFBB" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>

At this point in the previous indications you'd just copy the URL and append some params but nowadays autoplay doesn't work without an explicit allow.

  1. Create a local index.html (I dropped in /Users/<myuser>/Screensaver/index.html do NOT put it in standard folders Documents/ Desktop/ Downloads/ etc)
<!doctype html><meta charset=utf-8><title>YT</title><body>
<iframe
  style="width: 100vw; height: 100vh;"
  width="560"
  height="315"
  src="https://www.youtube.com/embed/OID2uKeZL18?si=omrOv3DRbdDVOY2D&list=PLbAFXJC0J5GaupX-BYDsT12YfCUppoxHc&controls=0&autoplay=1&mute=1"
  title="YouTube video player"
  frameborder="0"
  allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
  referrerpolicy="strict-origin-when-cross-origin"
  allowfullscreen
></iframe>

The first line is just the minimal amount of html5 that is valid. The embed was modified with:

  • added style="width: 100vw; height: 100vh;" to make it fullscreen
  • added &controls=0&autoplay=1&mute=1 the URL which should be obvious what they do
  • (optional) added &list=??? the list ID being the one from the initial URL in case you are working with a playlist
  1. Put the local address in the config as /Users/<myuser>/Screensaver/index.html

And you're done.

agologan avatar Jan 27 '25 15:01 agologan

Can I suggest adding YouTube-support directly to the screensaver, so it'd recognize a standard YouTube URL and use an internal html file for it?

fuzzy76 avatar Nov 22 '25 21:11 fuzzy76

We understand the community's interest and appreciate the suggestion! However, adding YouTube-specific support would go against the project generic design philosophy.

We are unable to commit to long-term support for platform-specific features that are outside our direct control, nor can we encourage any usage that might conflict with a platform's terms of service.

For a solution that achieves what you're aiming for, there are other projects on GitHub that are specifically designed for that purpose.

agologan avatar Nov 23 '25 10:11 agologan