Improve player

Add a settings dialog based on the work of Yanko Shterev (@yshterev):
https://github.com/yshterev/videojs-settings-menu. Thanks!

1 files changed, 31 insertions, 0 deletions

diff --git a/client/src/assets/player/resolution-menu-item.ts b/client/src/assets/player/resolution-menu-item.ts
new file mode 100644
index 000000000..95e0ed1f8
--- /dev/null
+++ b/client/src/assets/player/resolution-menu-item.ts
@@ -0,0 +1,31 @@
+import { VideoJSComponentInterface, videojsUntyped } from './peertube-videojs-typings'
+
+const MenuItem: VideoJSComponentInterface = videojsUntyped.getComponent('MenuItem')
+class ResolutionMenuItem extends MenuItem {
+
+  constructor (player: videojs.Player, options) {
+    const currentResolutionId = player.peertube().getCurrentResolutionId()
+    options.selectable = true
+    options.selected = options.id === currentResolutionId
+
+    super(player, options)
+
+    this.label = options.label
+    this.id = options.id
+
+    player.peertube().on('videoFileUpdate', () => this.update())
+  }
+
+  handleClick (event) {
+    super.handleClick(event)
+
+    this.player_.peertube().updateResolution(this.id)
+  }
+
+  update () {
+    this.selected(this.player_.peertube().getCurrentResolutionId() === this.id)
+  }
+}
+MenuItem.registerComponent('ResolutionMenuItem', ResolutionMenuItem)
+
+export { ResolutionMenuItem }