Migrating variables functions to the "state" namespace.

front/src/Api/iframe/room.ts

@@ -4,15 +4,11 @@ import { EnterLeaveEvent, isEnterLeaveEvent } from "../Events/EnterLeaveEvent";
 
 import {IframeApiContribution, queryWorkadventure, sendToWorkadventure} from "./IframeApiContribution";
 import { apiCallback } from "./registeredCallbacks";
-import {isSetVariableEvent, SetVariableEvent} from "../Events/SetVariableEvent";
 
 import type { ITiledMap } from "../../Phaser/Map/ITiledMap";
 
 const enterStreams: Map<string, Subject<EnterLeaveEvent>> = new Map<string, Subject<EnterLeaveEvent>>();
 const leaveStreams: Map<string, Subject<EnterLeaveEvent>> = new Map<string, Subject<EnterLeaveEvent>>();
-const setVariableResolvers = new Subject<SetVariableEvent>();
-const variables = new Map<string, unknown>();
-const variableSubscribers = new Map<string, Subject<unknown>>();
 
 interface TileDescriptor {
     x: number;
@@ -33,24 +29,6 @@ export const setMapURL = (url: string) => {
     mapURL = url;
 }
 
-export const initVariables = (_variables: Map<string, unknown>): void => {
-    for (const [name, value] of _variables.entries()) {
-        // In case the user already decided to put values in the variables (before onInit), let's make sure onInit does not override this.
-        if (!variables.has(name)) {
-            variables.set(name, value);
-        }
-    }
-
-}
-
-setVariableResolvers.subscribe((event) => {
-    variables.set(event.key, event.value);
-    const subject = variableSubscribers.get(event.key);
-    if (subject !== undefined) {
-        subject.next(event.value);
-    }
-});
-
 export class WorkadventureRoomCommands extends IframeApiContribution<WorkadventureRoomCommands> {
     callbacks = [
         apiCallback({
@@ -67,13 +45,6 @@ export class WorkadventureRoomCommands extends IframeApiContribution<Workadventu
                 leaveStreams.get(payloadData.name)?.next();
             },
         }),
-        apiCallback({
-            type: "setVariable",
-            typeChecker: isSetVariableEvent,
-            callback: (payloadData) => {
-                setVariableResolvers.next(payloadData);
-            }
-        }),
     ];
 
     onEnterZone(name: string, callback: () => void): void {
@@ -119,31 +90,6 @@ export class WorkadventureRoomCommands extends IframeApiContribution<Workadventu
         });
     }
 
-    saveVariable(key : string, value : unknown): Promise<void> {
-        variables.set(key, value);
-        return queryWorkadventure({
-            type: 'setVariable',
-            data: {
-                key,
-                value
-            }
-        })
-    }
-
-    loadVariable(key: string): unknown {
-        return variables.get(key);
-    }
-
-    onVariableChange(key: string): Observable<unknown> {
-        let subject = variableSubscribers.get(key);
-        if (subject === undefined) {
-            subject = new Subject<unknown>();
-            variableSubscribers.set(key, subject);
-        }
-        return subject.asObservable();
-    }
-
-
     get id() : string {
         if (roomId === undefined) {
             throw new Error('Room id not initialized yet. You should call WA.room.id within a WA.onInit callback.');

front/src/Api/iframe/state.ts

@@ -0,0 +1,85 @@
+import {Observable, Subject} from "rxjs";
+
+import { EnterLeaveEvent, isEnterLeaveEvent } from "../Events/EnterLeaveEvent";
+
+import {IframeApiContribution, queryWorkadventure, sendToWorkadventure} from "./IframeApiContribution";
+import { apiCallback } from "./registeredCallbacks";
+import {isSetVariableEvent, SetVariableEvent} from "../Events/SetVariableEvent";
+
+import type { ITiledMap } from "../../Phaser/Map/ITiledMap";
+
+const setVariableResolvers = new Subject<SetVariableEvent>();
+const variables = new Map<string, unknown>();
+const variableSubscribers = new Map<string, Subject<unknown>>();
+
+export const initVariables = (_variables: Map<string, unknown>): void => {
+    for (const [name, value] of _variables.entries()) {
+        // In case the user already decided to put values in the variables (before onInit), let's make sure onInit does not override this.
+        if (!variables.has(name)) {
+            variables.set(name, value);
+        }
+    }
+
+}
+
+setVariableResolvers.subscribe((event) => {
+    variables.set(event.key, event.value);
+    const subject = variableSubscribers.get(event.key);
+    if (subject !== undefined) {
+        subject.next(event.value);
+    }
+});
+
+export class WorkadventureStateCommands extends IframeApiContribution<WorkadventureStateCommands> {
+    callbacks = [
+        apiCallback({
+            type: "setVariable",
+            typeChecker: isSetVariableEvent,
+            callback: (payloadData) => {
+                setVariableResolvers.next(payloadData);
+            }
+        }),
+    ];
+
+    saveVariable(key : string, value : unknown): Promise<void> {
+        variables.set(key, value);
+        return queryWorkadventure({
+            type: 'setVariable',
+            data: {
+                key,
+                value
+            }
+        })
+    }
+
+    loadVariable(key: string): unknown {
+        return variables.get(key);
+    }
+
+    onVariableChange(key: string): Observable<unknown> {
+        let subject = variableSubscribers.get(key);
+        if (subject === undefined) {
+            subject = new Subject<unknown>();
+            variableSubscribers.set(key, subject);
+        }
+        return subject.asObservable();
+    }
+
+}
+
+const proxyCommand = new Proxy(new WorkadventureStateCommands(), {
+    get(target: WorkadventureStateCommands, p: PropertyKey, receiver: unknown): unknown {
+        if (p in target) {
+            return Reflect.get(target, p, receiver);
+        }
+        return target.loadVariable(p.toString());
+    },
+    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);
+        return true;
+    }
+});
+
+export default proxyCommand;

front/src/Connexion/RoomConnection.ts

@@ -177,7 +177,6 @@ export class RoomConnection implements RoomConnection {
                     }
                 }
             } else if (message.hasRoomjoinedmessage()) {
-                console.error('COUCOU')
                 const roomJoinedMessage = message.getRoomjoinedmessage() as RoomJoinedMessage;
 
                 const items: { [itemId: number]: unknown } = {};

front/src/iframe_api.ts

@@ -11,7 +11,8 @@ import nav from "./Api/iframe/nav";
 import controls from "./Api/iframe/controls";
 import ui from "./Api/iframe/ui";
 import sound from "./Api/iframe/sound";
-import room, {initVariables, setMapURL, setRoomId} from "./Api/iframe/room";
+import room, {setMapURL, setRoomId} from "./Api/iframe/room";
+import state, {initVariables} from "./Api/iframe/state";
 import player, {setPlayerName, setTags, setUuid} from "./Api/iframe/player";
 import type { ButtonDescriptor } from "./Api/iframe/Ui/ButtonDescriptor";
 import type { Popup } from "./Api/iframe/Ui/Popup";
@@ -42,6 +43,7 @@ const wa = {
     sound,
     room,
     player,
+    state,
 
     onInit(): Promise<void> {
         return initPromise;