Automatic resolution according to user bandwidth V1

1 files changed, 15 insertions, 2 deletions

diff --git a/client/src/assets/player/resolution-menu-button.ts b/client/src/assets/player/resolution-menu-button.ts
index 712e71192..2efc8de69 100644
--- a/client/src/assets/player/resolution-menu-button.ts
+++ b/client/src/assets/player/resolution-menu-button.ts
@@ -22,7 +22,7 @@ class ResolutionMenuButton extends MenuButton {
 
     this.labelEl_ = videojsUntyped.dom.createEl('div', {
       className: 'vjs-resolution-value',
-      innerHTML: this.player_.peertube().getCurrentResolutionLabel()
+      innerHTML: this.buildLabelHTML()
     })
 
     el.appendChild(this.labelEl_)
@@ -47,13 +47,22 @@ class ResolutionMenuButton extends MenuButton {
       )
     }
 
+    menu.addChild(new ResolutionMenuItem(
+      this.player_,
+      {
+        id: -1,
+        label: 'Auto',
+        src: null
+      }
+    ))
+
     return menu
   }
 
   updateLabel () {
     if (!this.labelEl_) return
 
-    this.labelEl_.innerHTML = this.player_.peertube().getCurrentResolutionLabel()
+    this.labelEl_.innerHTML = this.buildLabelHTML()
   }
 
   buildCSSClass () {
@@ -63,5 +72,9 @@ class ResolutionMenuButton extends MenuButton {
   buildWrapperCSSClass () {
     return 'vjs-resolution-control ' + super.buildWrapperCSSClass()
   }
+
+  private buildLabelHTML () {
+    return this.player_.peertube().getCurrentResolutionLabel()
+  }
 }
 MenuButton.registerComponent('ResolutionMenuButton', ResolutionMenuButton)