Add Blink integration (though broken?).

Author: twavv

packages/webio/dist/blink.bundle.js

@@ -0,0 +1,24 @@
+import WebIO from "../WebIO";
+
+/**
+ * Tell TypeScript that the `Blink` global exists.
+ *
+ * @todo This could be typed out but is probably pretty low priority.
+ */
+declare const Blink: any;
+
+if (Blink && Blink.sock) {
+  const webIO = new WebIO();
+  webIO.setSendCallback((message) => {
+    Blink.msg("webio", message);
+  });
+  Blink.handlers.webio = (message: any) => {
+    webIO.dispatch(message.data);
+  };
+
+  if (typeof window !== "undefined") {
+    (window as any).WebIO = webIO;
+  }
+} else {
+  console.error("WebIO is unable to initialize (Blink is not connected)!");
+}

packages/webio/dist/blink.bundle.js.map

@@ -0,0 +1,64 @@
+import debug from "debug";
+const log = debug("WebIO:Mux");
+
+import WebIO from "../WebIO";
+import {WebIOWireMessage} from "../message";
+
+/**
+ * Get the standard url of the Mux/WebIO WebSocket.
+ */
+export const getMuxWSUrl = (): string => {
+  const {protocol, host, pathname} = window.location;
+  const wsProtocol = protocol == "https:" ? "wss:" : "ws:";
+  const basePath = pathname[pathname.length - 1] == "/" ? pathname : pathname + "/";
+  const wsPath = basePath + "webio-socket";
+
+  return `${wsProtocol}//${host}${wsPath}`;
+};
+
+/**
+ * Create a WebIO instance connected to a Mux WebSocket.
+ * @param webIO - the WebIO instance to connect.
+ * @param wsUrl - the url of the WebSocket to connect to.
+ */
+export const connectWebIOToWebSocket = (
+  webIO: WebIO,
+  wsUrl: string = getMuxWSUrl(),
+) => {
+  return new Promise<void>((resolve, reject) => {
+    const webSocket = new WebSocket(wsUrl);
+
+    webSocket.onopen = () => {
+      webIO.setSendCallback((msg: WebIOWireMessage) => {
+        webSocket.send(JSON.stringify(msg));
+      });
+      resolve();
+    };
+
+    webSocket.onclose = (closeEvent) => {
+      // Rejecting a resolved or already-rejected promise is a no-op.
+      reject(closeEvent);
+    };
+
+    webSocket.onerror = (error) => {
+      // Rejecting a resolved or already-rejected promise is a no-op.
+      reject(error);
+    };
+
+    webSocket.onmessage = ({data}) => {
+      const message = JSON.parse(data);
+      webIO.dispatch(message);
+    }
+  })
+};
+
+
+const muxEntrypoint = async () => {
+  const webIO = new WebIO();
+  // We do window as any to allow defining new members.
+  (window as any).WebIO = webIO;
+  await connectWebIOToWebSocket(webIO);
+  log("Connected WebIO to WebSocket.")
+};
+
+muxEntrypoint();

packages/webio/dist/mux.bundle.js

@@ -11,12 +11,18 @@ module.exports = {
   devtool: "cheap-module-source-map",
 
   entry: {
-    'mux': ['@babel/polyfill', 'providers/mux-entrypoint.ts']
+    // Running in browser, we need polyfill for ES2015 support.
+    // We don't really need *all* of the babel polyfill but it's not
+    // **that** big. We could have our own custom entrypoint where
+    // we only import relevant core-js modules if we wanted.
+    'mux': ['@babel/polyfill', 'providers/mux.ts'],
+    // Babel isn't necessary in Electron (right?).
+    'blink': ['@babel/polyfill', 'providers/blink.ts'],
   },
 
   // https://webpack.js.org/configuration/output/
   output: {
-    path: path.resolve( __dirname, 'dist/' ),
+    path: path.resolve(__dirname, 'dist/'),
     filename: '[name].bundle.js',
   },
 

packages/webio/dist/mux.bundle.js.map

@@ -2,8 +2,8 @@ using AssetRegistry
 using Base64: stringmime
 
 const blinksetup = joinpath(dirname(@__FILE__), "..", "..",
-                            "assets", "providers",
-                            "blink_setup.js")
+                            "packages", "webio", "dist",
+                            "blink.bundle.js")
 
 using Sockets
 
@@ -14,10 +14,7 @@ end
 function Blink.body!(p::Blink.Page, x::Union{Node, Scope, AbstractWidget})
     wait(p)
 
-    bp = AssetRegistry.register(WebIO.bundlepath)
     bs = AssetRegistry.register(blinksetup)
-
-    Blink.loadjs!(p, bp)
     Blink.loadjs!(p, bs)
 
     conn = BlinkConnection(p)