diff --git a/front/src/Phaser/Game/GameScene.ts b/front/src/Phaser/Game/GameScene.ts index 7ba97175..d46d4524 100644 --- a/front/src/Phaser/Game/GameScene.ts +++ b/front/src/Phaser/Game/GameScene.ts @@ -835,7 +835,8 @@ export class GameScene extends DirtyScene { newValue as string, this.MapUrlFile, allProps.get("openWebsiteAllowApi") as boolean | undefined, - allProps.get("openWebsitePolicy") as string | undefined + allProps.get("openWebsitePolicy") as string | undefined, + allProps.get("openWebsiteWidth") as number | undefined ); layoutManagerActionStore.removeAction("openWebsite"); }; @@ -1839,8 +1840,9 @@ ${escapedMessage} "jitsiInterfaceConfig" ); const jitsiUrl = allProps.get("jitsiUrl") as string | undefined; + const jitsiWidth = allProps.get("jitsiWidth") as number | undefined; - jitsiFactory.start(roomName, this.playerName, jwt, jitsiConfig, jitsiInterfaceConfig, jitsiUrl); + jitsiFactory.start(roomName, this.playerName, jwt, jitsiConfig, jitsiInterfaceConfig, jitsiUrl, jitsiWidth); this.connection?.setSilent(true); mediaManager.hideGameOverlay(); diff --git a/front/src/WebRtc/CoWebsiteManager.ts b/front/src/WebRtc/CoWebsiteManager.ts index f2de3580..b2ffb609 100644 --- a/front/src/WebRtc/CoWebsiteManager.ts +++ b/front/src/WebRtc/CoWebsiteManager.ts @@ -48,6 +48,10 @@ class CoWebsiteManager { this.cowebsiteDiv.style.width = width + "px"; } + set widthPercent(width: number) { + this.cowebsiteDiv.style.width = width + "%"; + } + get height(): number { return this.cowebsiteDiv.clientHeight; } @@ -162,7 +166,7 @@ class CoWebsiteManager { return iframe; } - public loadCoWebsite(url: string, base: string, allowApi?: boolean, allowPolicy?: string): void { + public loadCoWebsite(url: string, base: string, allowApi?: boolean, allowPolicy?: string, widthPercent?: number): void { this.load(); this.cowebsiteMainDom.innerHTML = ``; @@ -186,6 +190,9 @@ class CoWebsiteManager { .then(() => Promise.race([onloadPromise, onTimeoutPromise])) .then(() => { this.open(); + if (widthPercent) { + this.widthPercent = widthPercent; + } setTimeout(() => { this.fire(); }, animationTime); @@ -199,13 +206,16 @@ class CoWebsiteManager { /** * Just like loadCoWebsite but the div can be filled by the user. */ - public insertCoWebsite(callback: (cowebsite: HTMLDivElement) => Promise): void { + public insertCoWebsite(callback: (cowebsite: HTMLDivElement) => Promise, widthPercent?: number): void { this.load(); this.cowebsiteMainDom.innerHTML = ``; this.currentOperationPromise = this.currentOperationPromise .then(() => callback(this.cowebsiteMainDom)) .then(() => { this.open(); + if (widthPercent) { + this.widthPercent = widthPercent; + } setTimeout(() => { this.fire(); }, animationTime); diff --git a/front/src/WebRtc/JitsiFactory.ts b/front/src/WebRtc/JitsiFactory.ts index d2b9ebdd..1cc67273 100644 --- a/front/src/WebRtc/JitsiFactory.ts +++ b/front/src/WebRtc/JitsiFactory.ts @@ -82,7 +82,7 @@ class JitsiFactory { return slugify(instance.replace('/', '-') + "-" + roomName); } - public start(roomName: string, playerName:string, jwt?: string, config?: object, interfaceConfig?: object, jitsiUrl?: string): void { + public start(roomName: string, playerName:string, jwt?: string, config?: object, interfaceConfig?: object, jitsiUrl?: string, jitsiWidth?: number): void { coWebsiteManager.insertCoWebsite((async cowebsiteDiv => { // Jitsi meet external API maintains some data in local storage // which is sent via the appData URL parameter when joining a @@ -120,7 +120,7 @@ class JitsiFactory { this.jitsiApi.addListener('audioMuteStatusChanged', this.audioCallback); this.jitsiApi.addListener('videoMuteStatusChanged', this.videoCallback); }); - })); + }), jitsiWidth); } public async stop(): Promise {