Theater: hide button when not needed

## Issues
5349: Remove theater mode button from player in comments
5519: Theatre mode button doesn't do anything in full screen mode [Odysse/LBRY desktop app]

## Notes
5349: Wanted to hide for 'markdown' as well, but it seems useful for 'markdown' (to clear the screen from Related), so I did not include it.

ui/component/fileRenderFloating/view.jsx

@@ -129,7 +129,7 @@ export default function FileRenderFloating(props: Props) {
 
   // Listen to main-window resizing and adjust the fp position accordingly:
   useEffect(() => {
-    const handleMainWindowResize = debounce(e => {
+    const handleMainWindowResize = debounce((e) => {
       let newPos = {
         x: Math.round(relativePos.x * getScreenWidth()),
         y: Math.round(relativePos.y * getScreenHeight()),
@@ -248,6 +248,7 @@ export default function FileRenderFloating(props: Props) {
         className={classnames('content__viewer', {
           'content__viewer--floating': isFloating,
           'content__viewer--inline': !isFloating,
+          'content__viewer--secondary': playingUriSource === 'comment',
           'content__viewer--theater-mode': !isFloating && videoTheaterMode,
         })}
         style={

ui/component/viewers/videoViewer/internal/videojs.jsx

@@ -28,11 +28,11 @@ export type Player = {
   ended: () => boolean,
   error: () => any,
   loadingSpinner: any,
-  getChild: string => any,
+  getChild: (string) => any,
   playbackRate: (?number) => number,
   userActive: (?boolean) => boolean,
-  overlay: any => void,
+  overlay: (any) => void,
-  mobileUi: any => void,
+  mobileUi: (any) => void,
   controlBar: {
     addChild: (string, any) => void,
   },
@@ -42,7 +42,7 @@ type Props = {
   source: string,
   sourceType: string,
   poster: ?string,
-  onPlayerReady: Player => void,
+  onPlayerReady: (Player) => void,
   isAudio: boolean,
   startMuted: boolean,
   autoplay: boolean,
@@ -315,7 +315,7 @@ export default React.memo<Props>(function VideoJs(props: Props) {
     if (e.shiftKey && (e.keyCode === PERIOD_KEYCODE || e.keyCode === COMMA_KEYCODE)) {
       const isSpeedUp = e.keyCode === PERIOD_KEYCODE;
       const rate = player.playbackRate();
-      let rateIndex = videoPlaybackRates.findIndex(x => x === rate);
+      let rateIndex = videoPlaybackRates.findIndex((x) => x === rate);
       if (rateIndex >= 0) {
         rateIndex = isSpeedUp ? Math.min(rateIndex + 1, videoPlaybackRates.length - 1) : Math.max(rateIndex - 1, 0);
         const nextRate = videoPlaybackRates[rateIndex];
@@ -329,6 +329,9 @@ export default React.memo<Props>(function VideoJs(props: Props) {
     // Theater Mode shortcut
     if (e.keyCode === THEATER_MODE_KEYCODE) {
       toggleVideoTheaterMode();
+      if (player.isFullscreen()) {
+        player.exitFullscreen();
+      }
     }
   }
 
@@ -421,7 +424,7 @@ export default React.memo<Props>(function VideoJs(props: Props) {
   // Update video player and reload when source URL changes
   useEffect(() => {
     // For some reason the video player is responsible for detecting content type this way
-    fetch(source, { method: 'HEAD', cache: 'no-store' }).then(response => {
+    fetch(source, { method: 'HEAD', cache: 'no-store' }).then((response) => {
       const player = playerRef.current;
 
       if (!player) {

ui/scss/component/_content.scss

@@ -9,6 +9,12 @@
   border: none;
 }
 
+.content__viewer--secondary {
+  .vjs-button--theater-mode {
+    display: none;
+  }
+}
+
 .content__viewer--floating {
   position: fixed;
   margin-bottom: 0;

ui/scss/component/_file-render.scss

@@ -544,6 +544,12 @@ video::-internal-media-controls-overlay-cast-button {
   }
 }
 
+.video-js.vjs-fullscreen {
+  .vjs-button--theater-mode {
+    display: none;
+  }
+}
+
 // ****************************************************************************
 // Tap-to-unmute
 // ****************************************************************************