feat: liveview working with warp

packages/liveview/src/interpreter.js

@@ -1,11 +1,41 @@
-export function main() {
+function main() {
   let root = window.document.getElementById("main");
+
   if (root != null) {
-    window.interpreter = new Interpreter(root);
-    window.ipc.postMessage(serializeIpcMessage("initialize"));
+    // create a new ipc
+    window.ipc = new IPC(root);
+
+    window.ipc.send(serializeIpcMessage("initialize"));
   }
 }
-export class Interpreter {
+
+class IPC {
+  constructor(root) {
+    // connect to the websocket
+    window.interpreter = new Interpreter(root);
+
+    this.ws = new WebSocket(WS_ADDR);
+
+    this.ws.onopen = () => {
+      console.log("Connected to the websocket");
+    };
+
+    this.ws.onerror = (err) => {
+      console.error("Error: ", err);
+    };
+
+    this.ws.onmessage = (event) => {
+      let edits = JSON.parse(event.data);
+      window.interpreter.handleEdits(edits);
+    };
+  }
+
+  send(msg) {
+    this.ws.send(msg);
+  }
+}
+
+class Interpreter {
   constructor(root) {
     this.root = root;
     this.stack = [root];
@@ -207,7 +237,7 @@ export class Interpreter {
                   event.preventDefault();
                   const href = target.getAttribute("href");
                   if (href !== "" && href !== null && href !== undefined) {
-                    window.ipc.postMessage(
+                    window.ipc.send(
                       serializeIpcMessage("browser_open", { href })
                     );
                   }
@@ -263,7 +293,7 @@ export class Interpreter {
             if (realId == null) {
               return;
             }
-            window.ipc.postMessage(
+            window.ipc.send(
               serializeIpcMessage("user_event", {
                 event: edit.event_name,
                 mounted_dom_id: parseInt(realId),
@@ -287,7 +317,7 @@ export class Interpreter {
   }
 }
 
-export function serialize_event(event) {
+function serialize_event(event) {
   switch (event.type) {
     case "copy":
     case "cut":