v4

src/ui/fullscreen.ts

@@ -1,55 +1,35 @@
 export class Fullscreen {
 	private button: HTMLElement;
-	private isFullscreen: boolean;
 
 	constructor(button: HTMLElement, isFullscreen = false) {
 		this.button = button;
-		this.isFullscreen = isFullscreen;
 		if (isFullscreen) {
 			button.classList.add('fullscreenMode');
 		}
-
 		document.addEventListener('fullscreenchange', this.onFullscreenChange.bind(this));
-		document.addEventListener('keydown', this.onKeyDown.bind(this));
 	}
 
 	toggle() {
 		if (isAppInNativeFullscreenMode()) {
-			this.exitFullscreen();
+			this.button.classList.remove('fullscreenMode');
+			this.button
+				.querySelectorAll('.fullscreen__title')
+				.forEach((el) => (el.textContent = 'FullScreen'));
+			document.exitFullscreen();
 		} else if (!isAppInNativeFullscreenMode() && window.innerHeight === screen.height) {
 			alert('Use F11 to exit fullscreen');
 		} else {
-			this.enterFullscreen();
-		}
-	}
-
-	enterFullscreen() {
-		this.button.classList.add('fullscreenMode');
-		this.button
-			.querySelectorAll('.fullscreen__title')
-			.forEach((el) => (el.textContent = 'Contract'));
-		document.getElementById('AncientBeast').requestFullscreen();
-		this.isFullscreen = true;
-	}
-
-	exitFullscreen() {
-		this.button.classList.remove('fullscreenMode');
-		this.button
-			.querySelectorAll('.fullscreen__title')
-			.forEach((el) => (el.textContent = 'FullScreen'));
-		document.exitFullscreen();
-		this.isFullscreen = false;
-	}
-
-	onFullscreenChange() {
-		if (!document.fullscreenElement) {
-			this.isFullscreen = false;
+			this.button.classList.add('fullscreenMode');
+			this.button
+				.querySelectorAll('.fullscreen__title')
+				.forEach((el) => (el.textContent = 'Contract'));
+			document.getElementById('AncientBeast').requestFullscreen();
 		}
 	}
 
-	onKeyDown(event: KeyboardEvent) {
-		if (this.isFullscreen && event.key === 'Escape') {
-			event.preventDefault();
+	private onFullscreenChange() {
+		if (!isAppInNativeFullscreenMode() && this.button.classList.contains('fullscreenMode')) {
+			document.getElementById('AncientBeast').requestFullscreen();
 		}
 	}
 }