From 7d932175967f52e27736f948a2fc3b302abad92e Mon Sep 17 00:00:00 2001
From: PikachuEXE <pikachuexe@gmail.com>
Date: Fri, 23 Apr 2021 02:41:50 +0800
Subject: [PATCH] * Update player to hide full window button when in full
 screen mode (#1222)

---
 .../ft-video-player/ft-video-player.js           | 16 ++++++++++++++--
 src/renderer/videoJS.css                         |  4 ++++
 2 files changed, 18 insertions(+), 2 deletions(-)

diff --git a/src/renderer/components/ft-video-player/ft-video-player.js b/src/renderer/components/ft-video-player/ft-video-player.js
index c50ea7b1..004fac5d 100644
--- a/src/renderer/components/ft-video-player/ft-video-player.js
+++ b/src/renderer/components/ft-video-player/ft-video-player.js
@@ -231,6 +231,7 @@ export default Vue.extend({
         this.player.controlBar.getChild('volumePanel').on('mousewheel', this.mouseScrollVolume)
 
         this.player.on('fullscreenchange', this.fullscreenOverlay)
+        this.player.on('fullscreenchange', this.toggleFullscreenClass)
 
         const v = this
 
@@ -651,8 +652,11 @@ export default Vue.extend({
           v.toggleFullWindow()
         },
         createControlTextEl: function (button) {
-          return $(button).html($('<div id="fullwindow" class="vjs-icon-fullwindow-enter vjs-button"></div>')
-            .attr('title', 'Fullwindow'))
+          // Add class name to button to be able to target it with CSS selector
+          return $(button)
+            .addClass('vjs-button-fullwindow')
+            .html($('<div id="fullwindow" class="vjs-icon-fullwindow-enter vjs-button"></div>')
+              .attr('title', 'Full Window'))
         }
       })
       videojs.registerComponent('fullWindowButton', fullWindowButton)
@@ -821,6 +825,14 @@ export default Vue.extend({
       }
     },
 
+    toggleFullscreenClass: function () {
+      if (this.player.isFullscreen()) {
+        $('body').addClass('vjs--full-screen-enabled')
+      } else {
+        $('body').removeClass('vjs--full-screen-enabled')
+      }
+    },
+
     handleTouchStart: function (event) {
       const v = this
       this.touchPauseTimeout = setTimeout(() => {
diff --git a/src/renderer/videoJS.css b/src/renderer/videoJS.css
index 3203ae64..14716441 100644
--- a/src/renderer/videoJS.css
+++ b/src/renderer/videoJS.css
@@ -448,6 +448,10 @@ body.vjs-full-window {
 .vjs-icon-fullwindow-enter:before, .video-js .vjs-fullwindow-control .vjs-icon-placeholder:before {
   content: url(assets/img/open_fullwindow.svg);
 }
+/* Hide button in full screen mode */
+.vjs--full-screen-enabled .vjs-button-fullwindow {
+  display: none;
+}
 
 .vjs-icon-fullwindow-exit, .video-js.vjs-fullwindow .vjs-fullwindow-control .vjs-icon-placeholder {
   font-family: VideoJS;