From b8748bd7f5d71d21c9381912e4716892553128ed Mon Sep 17 00:00:00 2001
From: Zoe Roux <zoe.roux@sdg.moe>
Date: Thu, 22 Oct 2020 22:50:45 +0200
Subject: [PATCH] Showing the controls when a menu is open

---
 src/app/pages/player/player.component.html | 11 +++++++----
 src/app/pages/player/player.component.ts   |  3 ++-
 2 files changed, 9 insertions(+), 5 deletions(-)

diff --git a/src/app/pages/player/player.component.html b/src/app/pages/player/player.component.html
index 8e8f6e65..caee2ba0 100644
--- a/src/app/pages/player/player.component.html
+++ b/src/app/pages/player/player.component.html
@@ -1,6 +1,6 @@
 <div id="root"
      (mouseenter)="!isMobile ? this.showControls = true : null"
-     (mouseleave)="!this.player.paused && !isMobile ? this.showControls = false : null"
+     (mouseleave)="!this.player.paused && !isMobile ? this.showControls = this.isMenuOpen : null"
      [style.cursor]="this.showControls ? '' : 'none'">
 	<div class="player data-vjs-player">
 		<video id="player" #player
@@ -134,13 +134,16 @@
 							<mat-icon>music_note</mat-icon>
 						</button>
 						<button *ngIf="this.item.subtitles.length > 0" mat-icon-button [matMenuTriggerFor]="subtitles"
+						        (menuOpened)="this.isMenuOpen = true"
 						        matTooltipPosition="above" matTooltip="Select subtitle track">
 							<mat-icon>closed_caption</mat-icon>
 						</button>
 						<button mat-icon-button matTooltipPosition="above" matTooltip="Cast">
 							<mat-icon>cast</mat-icon>
 						</button>
-						<button mat-icon-button matTooltipPosition="above" [matMenuTriggerFor]="settings" matTooltip="Settings">
+						<button mat-icon-button matTooltipPosition="above" matTooltip="Settings"
+						        (menuOpened)="this.isMenuOpen = true"
+						        [matMenuTriggerFor]="settings">
 							<mat-icon>settings</mat-icon>
 						</button>
 						<button mat-icon-button matTooltipPosition="above"
@@ -153,7 +156,7 @@
 				</div>
 			</div>
 
-			<mat-menu #subtitles="matMenu">
+			<mat-menu #subtitles="matMenu" (closed)="this.isMenuOpen = false">
 				<ng-template matMenuContent>
 					<button [ngClass]="{'selected': this.selectedSubtitle == null}" mat-menu-item (click)="selectSubtitle(null)">
 						<span>None</span>
@@ -176,7 +179,7 @@
 				</ng-template>
 			</mat-menu>
 
-			<mat-menu #settings="matMenu">
+			<mat-menu #settings="matMenu" (closed)="this.isMenuOpen = false">
 				<ng-template matMenuContent>
 					<button mat-menu-item (click)="this.displayStats = !this.displayStats">
 						<span>Stats</span>
diff --git a/src/app/pages/player/player.component.ts b/src/app/pages/player/player.component.ts
index eb88413a..6233b0f7 100644
--- a/src/app/pages/player/player.component.ts
+++ b/src/app/pages/player/player.component.ts
@@ -85,6 +85,7 @@ export class PlayerComponent implements OnInit, OnDestroy, AfterViewInit
 
 	controlHider: NodeJS.Timeout = null;
 	areControlHovered: boolean = false;
+	isMenuOpen: boolean = false;
 	private _showControls: boolean = true;
 	get showControls(): boolean { return this._showControls; }
 	set showControls(value: boolean)
@@ -96,7 +97,7 @@ export class PlayerComponent implements OnInit, OnDestroy, AfterViewInit
 		{
 			this.controlHider = setTimeout(() =>
 			{
-				this.showControls = this.player.paused || this.areControlHovered;
+				this.showControls = this.player.paused || this.areControlHovered || this.isMenuOpen;
 			}, 2500);
 		}
 		else