Peertube: Cap the maximum resolution to the screen resolution

[rigelk]

note: adapted from https://framacolibri.org/t/choix-automatique-de-la-resolution-video/3204

Right now the resolution is selected automatically in order to fit the maximum bandwidth the connection allows. However it doesn't make sense to watch a 1080p video on a 720p screen, for instance.

Adding a check detecting the current window size and adapting the resolution if necessary would fit the use and allow to avoid consuming more bandwidth than necessary.

[Chocobozzz]

Do we check the window size or the video element size?

[rezonant]

As a side note, does PeerTube use adaptive bitrate streaming or is it a one time bandwidth check before playback begins?

[rigelk]

@rezonant it is adaptative.

It was introduced in beta.4 with https://github.com/Chocobozzz/PeerTube/commit/a8462c8e3a61f4f7314fe18c0c10cc2946c254d1.

[rigelk]

@Chocobozzz we should check for the video element size.

[ns23]

Can I take this issue ?

[rezonant]

Implementation should continually affect the adaptive bitrate selection as well, to handle upgrading resolution when going full screen, resizes etc

[Chocobozzz]

@ns23 sure!

[ns23]

Can you suggest me any start point, from where I start working on this issue.

[Chocobozzz]

In this function: https://github.com/Chocobozzz/PeerTube/blob/develop/client/src/assets/player/peertube-videojs-plugin.ts#L361

We choose the appropriate resolution. You could just reject resolution (in fact this is the video width) that are > to the width of the video element.

[ns23]

Okay, I will go through the code, and start working on the issue

[ns23]

Hello, Before creating a PR I want to know whether I am following correct approach or not .
In this function: https://github.com/Chocobozzz/PeerTube/blob/develop/client/src/assets/player/peertube-videojs-plugin.ts#L380
If I add following filter function, will it solve this issue ?

// Cap the maximum resolution to the screen resolution
    filteredFiles = filteredFiles.filter(f => f.resolution.id <= this.playerElement.width)

[Chocobozzz]

Yep, but put it before the current filter function:

const filteredFiles = this.videoFiles
  .filter(... your filter)
  .filter(... current filter)

[ns23]

Okay, I will make the changes and create a PR