Popup openWebSite

Add possibility to open a website with a popup
3 cases :
Open page
GoTo Page
OpenCoWebsite

front/src/Api/Events/GoToPageEvent.ts

@@ -0,0 +1,13 @@
+import * as tg from "generic-type-guard";
+
+
+
+export const isGoToPageEvent =
+    new tg.IsInterface().withProperties({
+        url: tg.isString,
+    }).get();
+
+/**
+ * A message sent from the iFrame to the game to add a message in the chat.
+ */
+export type GoToPageEvent = tg.GuardedType<typeof isGoToPageEvent>;

front/src/Api/Events/OpenCoWebSiteEvent.ts

@@ -0,0 +1,13 @@
+import * as tg from "generic-type-guard";
+
+
+
+export const isOpenCoWebsite =
+    new tg.IsInterface().withProperties({
+        url: tg.isString,
+    }).get();
+
+/**
+ * A message sent from the iFrame to the game to add a message in the chat.
+ */
+export type OpenCoWebSiteEvent = tg.GuardedType<typeof isOpenCoWebsite>;

front/src/Api/Events/OpenTabEvent.ts

@@ -0,0 +1,13 @@
+import * as tg from "generic-type-guard";
+
+
+
+export const isOpenTabEvent =
+    new tg.IsInterface().withProperties({
+        url: tg.isString,
+    }).get();
+
+/**
+ * A message sent from the iFrame to the game to add a message in the chat.
+ */
+export type OpenTabEvent = tg.GuardedType<typeof isOpenTabEvent>;

front/src/Api/IframeListener.ts

@@ -6,8 +6,12 @@ import * as crypto from "crypto";
 import {HtmlUtils} from "../WebRtc/HtmlUtils";
 import {EnterLeaveEvent} from "./Events/EnterLeaveEvent";
 import {isOpenPopupEvent, OpenPopupEvent} from "./Events/OpenPopupEvent";
+import {isOpenTabEvent, OpenTabEvent} from "./Events/OpenTabEvent";
 import {ButtonClickedEvent} from "./Events/ButtonClickedEvent";
 import {ClosePopupEvent, isClosePopupEvent} from "./Events/ClosePopupEvent";
+import {scriptUtils} from "./ScriptUtils";
+import {GoToPageEvent, isGoToPageEvent} from "./Events/GoToPageEvent";
+import {isOpenCoWebsite, OpenCoWebSiteEvent} from "./Events/OpenCoWebSiteEvent";
 
 
 /**
@@ -21,6 +25,18 @@ class IframeListener {
     private readonly _openPopupStream: Subject<OpenPopupEvent> = new Subject();
     public readonly openPopupStream = this._openPopupStream.asObservable();
 
+    private readonly _openTabStream: Subject<OpenTabEvent> = new Subject();
+    public readonly openTabStream = this._openTabStream.asObservable();
+
+    private readonly _goToPageStream: Subject<GoToPageEvent> = new Subject();
+    public readonly goToPageStream = this._goToPageStream.asObservable();
+
+    private readonly _openCoWebSiteStream: Subject<OpenCoWebSiteEvent> = new Subject();
+    public readonly openCoWebSiteStream = this._openCoWebSiteStream.asObservable();
+
+    private readonly _closeCoWebSiteStream: Subject<void> = new Subject();
+    public readonly closeCoWebSiteStream = this._closeCoWebSiteStream.asObservable();
+
     private readonly _disablePlayerControlStream: Subject<void> = new Subject();
     public readonly disablePlayerControlStream = this._disablePlayerControlStream.asObservable();
 
@@ -64,6 +80,18 @@ class IframeListener {
                 } else if (payload.type === 'closePopup' && isClosePopupEvent(payload.data)) {
                     this._closePopupStream.next(payload.data);
                 }
+                else if(payload.type === 'openTab' && isOpenTabEvent(payload.data)) {
+                    scriptUtils.openTab(payload.data.url);
+                }
+                else if(payload.type === 'goToPage' && isGoToPageEvent(payload.data)) {
+                    scriptUtils.goToPage(payload.data.url);
+                }
+                else if(payload.type === 'openCoWebSite' && isOpenCoWebsite(payload.data)) {
+                    scriptUtils.openCoWebsite(payload.data.url);
+                }
+                else if(payload.type === 'closeCoWebSite') {
+                    scriptUtils.closeCoWebSite();
+                }
                 else if (payload.type === 'disablePlayerControl'){
                     this._disablePlayerControlStream.next();
                 }

front/src/Api/ScriptUtils.ts

@@ -0,0 +1,25 @@
+import {coWebsiteManager} from "../WebRtc/CoWebsiteManager";
+
+class ScriptUtils {
+
+public openTab(url : string){
+    window.open(url);
+}
+
+public goToPage(url : string){
+     window.location.href = url;
+
+}
+
+public openCoWebsite(url : string){
+        coWebsiteManager.loadCoWebsite(url,url);
+}
+
+public closeCoWebSite(){
+    coWebsiteManager.closeCoWebsite();
+}
+
+
+}
+
+export const scriptUtils = new ScriptUtils();

front/src/iframe_api.ts

@@ -6,6 +6,9 @@ import {EnterLeaveEvent, isEnterLeaveEvent} from "./Api/Events/EnterLeaveEvent";
 import {OpenPopupEvent} from "./Api/Events/OpenPopupEvent";
 import {isButtonClickedEvent} from "./Api/Events/ButtonClickedEvent";
 import {ClosePopupEvent} from "./Api/Events/ClosePopupEvent";
+import {OpenTabEvent} from "./Api/Events/OpenTabEvent";
+import {GoToPageEvent} from "./Api/Events/GoToPageEvent";
+import {OpenCoWebSiteEvent} from "./Api/Events/OpenCoWebSiteEvent";
 
 interface WorkAdventureApi {
     sendChatMessage(message: string, author: string): void;
@@ -13,6 +16,10 @@ interface WorkAdventureApi {
     onEnterZone(name: string, callback: () => void): void;
     onLeaveZone(name: string, callback: () => void): void;
     openPopup(targetObject: string, message: string, buttons: ButtonDescriptor[]): Popup;
+    openTab(url : string): void;
+    goToPage(url : string): void;
+    openCoWebSite(url : string): void;
+    closeCoWebSite(): void;
     disablePlayerControl() : void;
     restorePlayerControl() : void;
     displayBubble() : void;
@@ -22,6 +29,7 @@ interface WorkAdventureApi {
 declare global {
     // eslint-disable-next-line no-var
     var WA: WorkAdventureApi
+
 }
 
 type ChatMessageCallback = (message: string) => void;
@@ -96,6 +104,39 @@ window.WA = {
         window.parent.postMessage({'type' : 'removeBubble'},'*');
     },
 
+    openTab(url : string) : void{
+        window.parent.postMessage({
+            "type" : 'openTab',
+            "data" : {
+                url
+            } as OpenTabEvent
+            },'*');
+    },
+
+    goToPage(url : string) : void{
+        window.parent.postMessage({
+            "type" : 'goToPage',
+            "data" : {
+                url
+            } as GoToPageEvent
+            },'*');
+    },
+
+    openCoWebSite(url : string) : void{
+        window.parent.postMessage({
+            "type" : 'openCoWebSite',
+            "data" : {
+                url
+            } as OpenCoWebSiteEvent
+            },'*');
+    },
+
+    closeCoWebSite() : void{
+        window.parent.postMessage({
+            "type" : 'closeCoWebSite'
+            },'*');
+    },
+
     openPopup(targetObject: string, message: string, buttons: ButtonDescriptor[]): Popup {
         popupId++;
         const popup = new Popup(popupId);