import browserified version of simple-peer

front/index.html

@@ -28,7 +28,7 @@
         <meta name="theme-color" content="#000000">
 
         <base href="/">
-        <script>/*polyfill for simple-peer*/window.global = window; window.process = { env: {}};</script>
+        <script>/*polyfill for node built-ins*/window.global = window; window.process = { env: {}};</script>
         <style>/*hide cowebsite container before scss is loaded*/#cowebsite { visibility: collapse };</style>
 
         <title>WorkAdventure</title>

front/package.json

@@ -38,6 +38,7 @@
     "@types/simple-peer": "^9.11.1",
     "@types/socket.io-client": "^1.4.32",
     "axios": "^0.21.2",
+    "buffer": "^6.0.3",
     "cancelable-promise": "^4.2.1",
     "cross-env": "^7.0.3",
     "deep-copy-ts": "^0.5.0",

front/src/WebRtc/ScreenSharingPeer.ts

@@ -5,7 +5,8 @@ import { Readable, readable, writable, Writable } from "svelte/store";
 import { getIceServersConfig } from "../Components/Video/utils";
 import { highlightedEmbedScreen } from "../Stores/EmbedScreensStore";
 import { isMediaBreakpointUp } from "../Utils/BreakpointsUtils";
-import Peer from "simple-peer";
+import Peer from "simple-peer/simplepeer.min.js";
+import { Buffer } from "buffer";
 
 /**
  * A peer connection used to transmit video / audio signals between 2 peers.

front/src/WebRtc/VideoPeer.ts

@@ -9,7 +9,8 @@ import { playersStore } from "../Stores/PlayersStore";
 import { chatMessagesStore, newChatMessageSubject } from "../Stores/ChatStore";
 import { getIceServersConfig } from "../Components/Video/utils";
 import { isMediaBreakpointUp } from "../Utils/BreakpointsUtils";
-import Peer from "simple-peer";
+import Peer from "simple-peer/simplepeer.min.js";
+import { Buffer } from "buffer";
 
 export type PeerStatus = "connecting" | "connected" | "error" | "closed";
 

front/src/simple-peer.d.ts

@@ -0,0 +1,4 @@
+declare module "simple-peer/simplepeer.min.js" {
+    import SimplePeer from "simple-peer";
+    export default SimplePeer;
+}