merged develop

front/src/Api/Events/ColorEvent.ts

@@ -0,0 +1,13 @@
+import * as tg from "generic-type-guard";
+
+export const isColorEvent = new tg.IsInterface()
+    .withProperties({
+        red: tg.isNumber,
+        green: tg.isNumber,
+        blue: tg.isNumber,
+    })
+    .get();
+/**
+ * A message sent from the iFrame to the game to dynamically set the outline of the player.
+ */
+export type ColorEvent = tg.GuardedType<typeof isColorEvent>;

front/src/Api/Events/IframeEvent.ts

@@ -34,6 +34,7 @@ import type { ChangeZoneEvent } from "./ChangeZoneEvent";
 import type { CameraSetPositionEvent } from "./CameraSetPositionEvent";
 import type { CameraFocusOnEvent } from "./CameraFocusOnEvent";
 import type { CameraFollowPlayerEvent } from "./CameraFollowPlayerEvent";
+import { isColorEvent } from "./ColorEvent";
 
 export interface TypedMessageEvent<T> extends MessageEvent {
     data: T;
@@ -162,6 +163,14 @@ export const iframeQueryMapTypeGuards = {
         query: isCreateEmbeddedWebsiteEvent,
         answer: tg.isUndefined,
     },
+    setPlayerOutline: {
+        query: isColorEvent,
+        answer: tg.isUndefined,
+    },
+    removePlayerOutline: {
+        query: tg.isUndefined,
+        answer: tg.isUndefined,
+    },
     getPlayerPosition: {
         query: tg.isUndefined,
         answer: isPlayerPosition,

front/src/Api/iframe/Ui/ActionMessage.ts

@@ -26,7 +26,7 @@ export class ActionMessage {
         this.message = actionMessageOptions.message;
         this.type = actionMessageOptions.type ?? "message";
         this.callback = actionMessageOptions.callback;
-        this.create();
+        this.create().catch((e) => console.error(e));
     }
 
     private async create() {

front/src/Api/iframe/camera.ts

@@ -1,6 +1,6 @@
 import { IframeApiContribution, sendToWorkadventure } from "./IframeApiContribution";
 import { Subject } from "rxjs";
-import type { WasCameraUpdatedEvent, WasCameraUpdatedEventCallback } from "../Events/WasCameraUpdatedEvent";
+import type { WasCameraUpdatedEvent } from "../Events/WasCameraUpdatedEvent";
 import { apiCallback } from "./registeredCallbacks";
 import { isWasCameraUpdatedEvent } from "../Events/WasCameraUpdatedEvent";
 
@@ -38,12 +38,12 @@ export class WorkAdventureCameraCommands extends IframeApiContribution<WorkAdven
         });
     }
 
-    onCameraUpdate(callback: WasCameraUpdatedEventCallback): void {
-        moveStream.subscribe(callback);
+    onCameraUpdate(): Subject<WasCameraUpdatedEvent> {
         sendToWorkadventure({
             type: "onCameraUpdate",
             data: null,
         });
+        return moveStream;
     }
 }
 

front/src/Api/iframe/player.ts

@@ -92,6 +92,24 @@ export class WorkadventurePlayerCommands extends IframeApiContribution<Workadven
         }
         return userRoomToken;
     }
+
+    public setOutlineColor(red: number, green: number, blue: number): Promise<void> {
+        return queryWorkadventure({
+            type: "setPlayerOutline",
+            data: {
+                red,
+                green,
+                blue,
+            },
+        });
+    }
+
+    public removeOutlineColor(): Promise<void> {
+        return queryWorkadventure({
+            type: "removePlayerOutline",
+            data: undefined,
+        });
+    }
 }
 
 export type Position = {

front/src/Api/iframe/state.ts

@@ -95,7 +95,7 @@ export function createState(target: "global" | "player"): WorkadventureStateComm
         set(target: WorkadventureStateCommands, p: PropertyKey, value: unknown, receiver: unknown): boolean {
             // Note: when using "set", there is no way to wait, so we ignore the return of the promise.
             // User must use WA.state.saveVariable to have error message.
-            target.saveVariable(p.toString(), value);
+            target.saveVariable(p.toString(), value).catch((e) => console.error(e));
             return true;
         },
         has(target: WorkadventureStateCommands, p: PropertyKey): boolean {