sindresorhus/Plash

Tip: YouTube Video in Full Screen as Cover

basilkorompilias opened this issue · 0 comments

Is your feature request related to a problem? Please describe.

When you add a youtube video to play, but its ratio is smaller than the screen, it appears with black stripes on the top and bottom which are annoying.

Describe the solution you'd like

I would like to propose to add in your tips section the following:

YOUTUBE VIDEOS

Tip N1: Click to Play
Kind of obvious, but I see that someone have posted it as a bug.
To play a youtube video, you enable "Browser Mode" and when it plays you may disable it so the video will not respond to mouse movements.

Tip N2: YT Link Parameters

  • autoplay=1: This parameter specifies whether the initial video will automatically start to play when the player loads. Supported values are 0 or 1. The default value is 0. However, due to some browsers' policies, the video might not autoplay, especially if the sound is on.
  • controls=0: This parameter indicates whether the video player controls are displayed. Setting this to 0 hides the player controls.
  • modestbranding=[1](https://developers.google.com/youtube/player_parameters): This parameter lets you use a YouTube player that does not show a YouTube logo. Set the parameter value to 1 to prevent the YouTube logo from displaying in the control bar. However, a small YouTube text label will still display in the upper-right corner of a paused video when the user’s mouse pointer hovers over the player while in "browser mode".
  • fs=0: This parameter determines whether the fullscreen button is displayed in the player. Setting this to 0 prevents the fullscreen button from displaying in the player. The default value is 1, which causes the fullscreen button to display.
  • rel=0: This parameter helps to ensure that related videos are shown at the end of the video. However, setting rel=0 will show related videos from the same channel as the video that was just played.
  • showinfo=0: This parameter is deprecated and will be ignored. It used to control whether the video's title and uploader name would be displayed.

For example, the format would be: https://www.youtube.com/embed/VIDEO_ID?autoplay=1&controls=0&modestbranding=1&fs=0&rel=0&showinfo=0. Multiple parameters can be added by separating them with an ampersand (&).

Tip N3: Video as a Cover
To show the video without black bars on top and bottom because of different aspect ratios, in the CSS section we add the following:

video {
object-fit:cover!important;
}

Describe alternatives you've considered

This could be a bit more automated in the future through the interface, where an individual would be able to select what they want from a list of options.

Additional context

Hedgehog & Bird Watching