]> git.immae.eu Git - github/Chocobozzz/PeerTube.git/blobdiff - client/src/assets/player/settings-menu-item.ts
Handle subtitles in player
[github/Chocobozzz/PeerTube.git] / client / src / assets / player / settings-menu-item.ts
index e979ae088a165562b5b891ec4b350f495e2de97e..6e2224e20f29f0c2a931876d06070a3c4511d4f8 100644 (file)
@@ -1,6 +1,7 @@
 // Author: Yanko Shterev
 // Thanks https://github.com/yshterev/videojs-settings-menu
 
+import * as videojs from 'video.js'
 import { toTitleCase } from './utils'
 import { VideoJSComponentInterface, videojsUntyped } from './peertube-videojs-typings'
 
@@ -31,6 +32,8 @@ class SettingsMenuItem extends MenuItem {
       throw new Error(`Component ${subMenuName} does not exist`)
     }
     this.subMenu = new SubMenuComponent(this.player(), options, menuButton, this)
+    const subMenuClass = this.subMenu.buildCSSClass().split(' ')[0]
+    this.settingsSubMenuEl_.className += ' ' + subMenuClass
 
     this.eventHandlers()
 
@@ -132,7 +135,7 @@ class SettingsMenuItem extends MenuItem {
     const button = this.subMenu.menu.addChild('MenuItem', {}, 0)
     button.name_ = 'BackButton'
     button.addClass('vjs-back-button')
-    button.el_.innerHTML = this.subMenu.controlText_
+    button.el_.innerHTML = this.player_.localize(this.subMenu.controlText_)
   }
 
   /**
@@ -201,7 +204,7 @@ class SettingsMenuItem extends MenuItem {
       saveUpdateLabel.call(this.subMenu)
     }
 
-    this.settingsSubMenuTitleEl_.innerHTML = this.subMenu.controlText_
+    this.settingsSubMenuTitleEl_.innerHTML = this.player_.localize(this.subMenu.controlText_)
     this.settingsSubMenuEl_.appendChild(this.subMenu.menu.el_)
     this.panelChildEl.appendChild(this.settingsSubMenuEl_)
     this.update()
@@ -241,21 +244,14 @@ class SettingsMenuItem extends MenuItem {
           continue
         }
 
-        switch (subMenu) {
-          case 'SubtitlesButton':
-          case 'CaptionsButton':
-            // subtitlesButton entering default check twice and overwriting
-            // selected label in main manu
-            if (subMenuItem.hasClass('vjs-selected')) {
-              this.settingsSubMenuValueEl_.innerHTML = subMenuItem.options_.label
-            }
+        if (subMenuItem.hasClass('vjs-selected')) {
+          // Prefer to use the function
+          if (typeof subMenuItem.getLabel === 'function') {
+            this.settingsSubMenuValueEl_.innerHTML = subMenuItem.getLabel()
             break
+          }
 
-          default:
-            // Set submenu value based on what item is selected
-            if (subMenuItem.options_.selected || subMenuItem.hasClass('vjs-selected')) {
-              this.settingsSubMenuValueEl_.innerHTML = subMenuItem.options_.label
-            }
+          this.settingsSubMenuValueEl_.innerHTML = subMenuItem.options_.label
         }
       }
     }