From eec15b38bb5721eb7637217b3b0d4a361f19f9b5 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?gr=C3=A9goire=20parant?= <g.parant@thecodingmachine.com>
Date: Thu, 3 Jun 2021 20:05:39 +0200
Subject: [PATCH] Hot Fix open & close iframe (#1115)

---
 front/src/WebRtc/CoWebsiteManager.ts | 21 ++++++++++++++++-----
 front/src/WebRtc/MediaManager.ts     | 15 +++++++++++----
 2 files changed, 27 insertions(+), 9 deletions(-)

diff --git a/front/src/WebRtc/CoWebsiteManager.ts b/front/src/WebRtc/CoWebsiteManager.ts
index 95885a53..ef34f913 100644
--- a/front/src/WebRtc/CoWebsiteManager.ts
+++ b/front/src/WebRtc/CoWebsiteManager.ts
@@ -11,7 +11,7 @@ enum iframeStates {
 const cowebsiteDivId = 'cowebsite'; // the id of the whole container.
 const cowebsiteMainDomId = 'cowebsite-main'; // the id of the parent div of the iframe.
 const cowebsiteAsideDomId = 'cowebsite-aside'; // the id of the parent div of the iframe.
-const cowebsiteCloseButtonId = 'cowebsite-close';
+export const cowebsiteCloseButtonId = 'cowebsite-close';
 const cowebsiteFullScreenButtonId = 'cowebsite-fullscreen';
 const cowebsiteOpenFullScreenImageId = 'cowebsite-fullscreen-open';
 const cowebsiteCloseFullScreenImageId = 'cowebsite-fullscreen-close';
@@ -64,10 +64,15 @@ class CoWebsiteManager {
 
         this.initResizeListeners();
 
-        HtmlUtils.getElementByIdOrFail(cowebsiteCloseButtonId).addEventListener('click', () => {
+        const buttonCloseFrame = HtmlUtils.getElementByIdOrFail(cowebsiteCloseButtonId);
+        buttonCloseFrame.addEventListener('click', () => {
+            buttonCloseFrame.blur();
             this.closeCoWebsite();
         });
-        HtmlUtils.getElementByIdOrFail(cowebsiteFullScreenButtonId).addEventListener('click', () => {
+
+        const buttonFullScreenFrame = HtmlUtils.getElementByIdOrFail(cowebsiteFullScreenButtonId);
+        buttonFullScreenFrame.addEventListener('click', () => {
+            buttonFullScreenFrame.blur();
             this.fullscreen();
         });
     }
@@ -152,7 +157,10 @@ class CoWebsiteManager {
             setTimeout(() => {
                 this.fire();
             }, animationTime)
-        }).catch(() => this.closeCoWebsite());
+        }).catch((err) => {
+            console.error('Error loadCoWebsite => ', err);
+            this.closeCoWebsite()
+        });
     }
 
     /**
@@ -166,7 +174,10 @@ class CoWebsiteManager {
             setTimeout(() => {
                 this.fire();
             }, animationTime);
-        }).catch(() => this.closeCoWebsite());
+        }).catch((err) => {
+            console.error('Error insertCoWebsite => ', err);
+            this.closeCoWebsite();
+        });
     }
 
     public closeCoWebsite(): Promise<void> {
diff --git a/front/src/WebRtc/MediaManager.ts b/front/src/WebRtc/MediaManager.ts
index 2bed2c68..80a102a4 100644
--- a/front/src/WebRtc/MediaManager.ts
+++ b/front/src/WebRtc/MediaManager.ts
@@ -5,6 +5,7 @@ import {UserInputManager} from "../Phaser/UserInput/UserInputManager";
 import {localUserStore} from "../Connexion/LocalUserStore";
 import {UserSimplePeerInterface} from "./SimplePeer";
 import {SoundMeter} from "../Phaser/Components/SoundMeter";
+import {cowebsiteCloseButtonId} from "./CoWebsiteManager";
 
 declare const navigator:any; // eslint-disable-line @typescript-eslint/no-explicit-any
 
@@ -208,22 +209,28 @@ export class MediaManager {
         const gameOverlay = HtmlUtils.getElementByIdOrFail('game-overlay');
         gameOverlay.classList.add('active');
 
-        const buttonCloseFrame = HtmlUtils.getElementByIdOrFail('cowebsite-close');
+        const buttonCloseFrame = HtmlUtils.getElementByIdOrFail(cowebsiteCloseButtonId);
         const functionTrigger = () => {
             this.triggerCloseJitsiFrameButton();
         }
-        buttonCloseFrame.removeEventListener('click', functionTrigger);
+        buttonCloseFrame.removeEventListener('click', () => {
+            buttonCloseFrame.blur();
+            functionTrigger();
+        });
     }
 
     public hideGameOverlay(): void {
         const gameOverlay = HtmlUtils.getElementByIdOrFail('game-overlay');
         gameOverlay.classList.remove('active');
 
-        const buttonCloseFrame = HtmlUtils.getElementByIdOrFail('cowebsite-close');
+        const buttonCloseFrame = HtmlUtils.getElementByIdOrFail(cowebsiteCloseButtonId);
         const functionTrigger = () => {
             this.triggerCloseJitsiFrameButton();
         }
-        buttonCloseFrame.addEventListener('click', functionTrigger);
+        buttonCloseFrame.addEventListener('click', () => {
+            buttonCloseFrame.blur();
+            functionTrigger();
+        });
     }
 
     public isGameOverlayVisible(): boolean {