From c201826f4555e09ccb77361b3a72413023de8922 Mon Sep 17 00:00:00 2001
From: Anthony <contact@anthonymayfield.com>
Date: Fri, 5 Nov 2021 11:27:52 +0100
Subject: [PATCH] pull out lbry volume class

---
 .../videoViewer/internal/lbry-volume-bar.js   | 46 ++++++++++++++++
 .../viewers/videoViewer/internal/videojs.jsx  | 54 +------------------
 2 files changed, 47 insertions(+), 53 deletions(-)
 create mode 100644 ui/component/viewers/videoViewer/internal/lbry-volume-bar.js

diff --git a/ui/component/viewers/videoViewer/internal/lbry-volume-bar.js b/ui/component/viewers/videoViewer/internal/lbry-volume-bar.js
new file mode 100644
index 000000000..573ef86ca
--- /dev/null
+++ b/ui/component/viewers/videoViewer/internal/lbry-volume-bar.js
@@ -0,0 +1,46 @@
+// ****************************************************************************
+// LbryVolumeBarClass
+// ****************************************************************************
+
+import videojs from 'video.js';
+
+const isDev = process.env.NODE_ENV !== 'production';
+
+const VIDEOJS_CONTROL_BAR_CLASS = 'ControlBar';
+const VIDEOJS_VOLUME_PANEL_CLASS = 'VolumePanel';
+const VIDEOJS_VOLUME_CONTROL_CLASS = 'VolumeControl';
+const VIDEOJS_VOLUME_BAR_CLASS = 'VolumeBar';
+
+class LbryVolumeBarClass extends videojs.getComponent(VIDEOJS_VOLUME_BAR_CLASS) {
+  constructor(player, options = {}) {
+    super(player, options);
+  }
+
+  static replaceExisting(player) {
+    try {
+      const volumeControl = player
+        .getChild(VIDEOJS_CONTROL_BAR_CLASS)
+        .getChild(VIDEOJS_VOLUME_PANEL_CLASS)
+        .getChild(VIDEOJS_VOLUME_CONTROL_CLASS);
+      const volumeBar = volumeControl.getChild(VIDEOJS_VOLUME_BAR_CLASS);
+      volumeControl.removeChild(volumeBar);
+      volumeControl.addChild(new LbryVolumeBarClass(player));
+    } catch (error) {
+      // In case it slips in 'Production', the original volume bar will be used and the site should still be working
+      // (just not exactly the way we want).
+      if (isDev) throw Error('\n\nvideojs.jsx: Volume Panel hierarchy changed?\n\n' + error);
+    }
+  }
+
+  handleMouseDown(event) {
+    super.handleMouseDown(event);
+    event.stopPropagation();
+  }
+
+  handleMouseMove(event) {
+    super.handleMouseMove(event);
+    event.stopPropagation();
+  }
+}
+
+export default LbryVolumeBarClass;
diff --git a/ui/component/viewers/videoViewer/internal/videojs.jsx b/ui/component/viewers/videoViewer/internal/videojs.jsx
index 9ff2e2013..9c63c818e 100644
--- a/ui/component/viewers/videoViewer/internal/videojs.jsx
+++ b/ui/component/viewers/videoViewer/internal/videojs.jsx
@@ -17,6 +17,7 @@ import recsys from './plugins/videojs-recsys/plugin';
 import qualityLevels from 'videojs-contrib-quality-levels';
 import isUserTyping from 'util/detect-typing';
 import runAds from './ads';
+import LbryVolumeBarClass from './lbry-volume-bar';
 
 const isDev = process.env.NODE_ENV !== 'production';
 
@@ -78,18 +79,6 @@ type Props = {
 //   muted?: boolean,
 // };
 
-function hitsFiftyPercent() {
-  // from 0 - 999
-  const rand = Math.floor(Math.random() * (1000 + 1));
-
-  // 499 is 50% chance of running
-  if (rand > 499) {
-    return true;
-  } else {
-    return false;
-  }
-}
-
 // check if active (clicked) element is part of video div, used for keyboard shortcuts (volume etc)
 function activeElementIsPartOfVideoElement() {
   const videoElementParent = document.getElementsByClassName('video-js-parent')[0];
@@ -135,47 +124,6 @@ if (!Object.keys(videojs.getPlugins()).includes('recsys')) {
   videojs.registerPlugin('recsys', recsys);
 }
 
-// ****************************************************************************
-// LbryVolumeBarClass
-// ****************************************************************************
-
-const VIDEOJS_CONTROL_BAR_CLASS = 'ControlBar';
-const VIDEOJS_VOLUME_PANEL_CLASS = 'VolumePanel';
-const VIDEOJS_VOLUME_CONTROL_CLASS = 'VolumeControl';
-const VIDEOJS_VOLUME_BAR_CLASS = 'VolumeBar';
-
-class LbryVolumeBarClass extends videojs.getComponent(VIDEOJS_VOLUME_BAR_CLASS) {
-  constructor(player, options = {}) {
-    super(player, options);
-  }
-
-  static replaceExisting(player) {
-    try {
-      const volumeControl = player
-        .getChild(VIDEOJS_CONTROL_BAR_CLASS)
-        .getChild(VIDEOJS_VOLUME_PANEL_CLASS)
-        .getChild(VIDEOJS_VOLUME_CONTROL_CLASS);
-      const volumeBar = volumeControl.getChild(VIDEOJS_VOLUME_BAR_CLASS);
-      volumeControl.removeChild(volumeBar);
-      volumeControl.addChild(new LbryVolumeBarClass(player));
-    } catch (error) {
-      // In case it slips in 'Production', the original volume bar will be used and the site should still be working
-      // (just not exactly the way we want).
-      if (isDev) throw Error('\n\nvideojs.jsx: Volume Panel hierarchy changed?\n\n' + error);
-    }
-  }
-
-  handleMouseDown(event) {
-    super.handleMouseDown(event);
-    event.stopPropagation();
-  }
-
-  handleMouseMove(event) {
-    super.handleMouseMove(event);
-    event.stopPropagation();
-  }
-}
-
 // ****************************************************************************
 // VideoJs
 // ****************************************************************************