Slugifies the Jitsi room name

This will avoid Jitsi breaking on unexpected characters and displaying a HTTP 404 error.

front/src/Phaser/Game/GameScene.ts

@@ -673,12 +673,13 @@ export class GameScene extends ResizableScene implements CenterListener {
                 this.stopJitsi();
             }else{
                 const openJitsiRoomFunction = () => {
+                    const roomName = jitsiFactory.getRoomName(newValue.toString(), this.instance);
                     if (JITSI_PRIVATE_MODE) {
                         const adminTag = allProps.get("jitsiRoomAdminTag") as string|undefined;
 
-                        this.connection.emitQueryJitsiJwtMessage(this.instance.replace('/', '-') + "-" + newValue, adminTag);
+                        this.connection.emitQueryJitsiJwtMessage(roomName, adminTag);
                     } else {
-                        this.startJitsi(newValue as string, undefined);
+                        this.startJitsi(roomName, undefined);
                     }
                     layoutManager.removeActionButton('jitsiRoom', this.userInputManager);
                 }

front/src/WebRtc/JitsiFactory.ts

@@ -33,11 +33,30 @@ const defaultInterfaceConfig = {
     ],
 };
 
+const slugify = (...args: (string | number)[]): string => {
+    const value = args.join(' ')
+
+    return value
+        .normalize('NFD') // split an accented letter in the base letter and the accent
+        .replace(/[\u0300-\u036f]/g, '') // remove all previously split accents
+        .toLowerCase()
+        .trim()
+        .replace(/[^a-z0-9 ]/g, '') // remove all chars not letters, numbers and spaces (to be replaced)
+        .replace(/\s+/g, '-') // separator
+}
+
 class JitsiFactory {
     private jitsiApi: any; // eslint-disable-line @typescript-eslint/no-explicit-any
     private audioCallback = this.onAudioChange.bind(this);
     private videoCallback = this.onVideoChange.bind(this);
 
+    /**
+     * Slugifies the room name and prepends the room name with the instance
+     */
+    public getRoomName(roomName: string, instance: string): string {
+        return slugify(instance.replace('/', '-') + "-" + roomName);
+    }
+
     public start(roomName: string, playerName:string, jwt?: string, config?: object, interfaceConfig?: object): void {
         coWebsiteManager.insertCoWebsite((cowebsiteDiv => {
             const domain = JITSI_URL;

maps/tests/jitsi_config.json

@@ -1,4 +1,11 @@
 { "compressionlevel":-1,
+ "editorsettings":
+    {
+     "export":
+        {
+         "target":"."
+        }
+    },
  "height":10,
  "infinite":false,
  "layers":[
@@ -46,7 +53,7 @@
                 {
                  "name":"jitsiRoom",
                  "type":"string",
-                 "value":"myRoom"
+                 "value":"myRoom avec espace \u00e9\u00e0$&'\"_ \ud83d\ude00"
                 }],
          "type":"tilelayer",
          "visible":true,