1024 ? "56rem" : "100%", ())}>
-
+
unit = "toggle"
}
@@ -15,7 +15,6 @@ module Element = {
@get external classList: Dom.element => ClassList.t = "classList"
}
-
type animationFrameId
@scope("window") @val
@@ -23,3 +22,11 @@ external requestAnimationFrame: (unit => unit) => animationFrameId = "requestAni
@scope("window") @val
external cancelAnimationFrame: animationFrameId => unit = "cancelAnimationFrame"
+
+module Url = {
+ type t
+ @new external make: string => t = "URL"
+ @new external makeWithBase: (string, string) => t = "URL"
+
+ @send external toString: t => string = "toString"
+}
diff --git a/src/bindings/Worker.resi b/src/bindings/Worker.resi
index 12b1858d2..0d3e7060f 100644
--- a/src/bindings/Worker.resi
+++ b/src/bindings/Worker.resi
@@ -13,16 +13,16 @@ module Make: (Config: Config) =>
include Config
module App: {
- let postMessage: (worker, fromApp) => unit
- let onMessage: (worker, {"data": fromWorker} => unit) => unit
+ let postMessage: (worker, Config.fromApp) => unit
+ let onMessage: (worker, {"data": Config.fromWorker} => unit) => unit
let onError: (worker, 'a => unit) => unit
let terminate: worker => unit
}
module Worker: {
type self
- let postMessage: fromWorker => unit
- let onMessage: (self, {"data": fromApp} => unit) => unit
+ let postMessage: Config.fromWorker => unit
+ let onMessage: (self, {"data": Config.fromApp} => unit) => unit
let self: self
let importScripts: string => unit
}
diff --git a/src/common/Eval.mjs b/src/common/Eval.mjs
new file mode 100644
index 000000000..19e6bd77f
--- /dev/null
+++ b/src/common/Eval.mjs
@@ -0,0 +1,140 @@
+// Generated by ReScript, PLEASE EDIT WITH CARE
+
+import * as Curry from "rescript/lib/es6/curry.js";
+import * as React from "react";
+import * as $$Worker from "../bindings/Worker.mjs";
+import * as Belt_Option from "rescript/lib/es6/belt_Option.js";
+import * as Caml_option from "rescript/lib/es6/caml_option.js";
+
+function make(param) {
+ return (new Worker(new URL("./EvalWorker.mjs", import.meta.url)));
+}
+
+var Config = {
+ make: make
+};
+
+var EvalWorker = $$Worker.Make(Config);
+
+function reducer(state, action) {
+ if (typeof state === "number") {
+ if (action.TAG === /* Evaluate */0) {
+ return {
+ TAG: 0,
+ code: action._0,
+ logs: [],
+ [Symbol.for("name")]: "Evaluating"
+ };
+ } else {
+ return state;
+ }
+ }
+ switch (state.TAG | 0) {
+ case /* Evaluating */0 :
+ var logs = state.logs;
+ var code = state.code;
+ switch (action.TAG | 0) {
+ case /* Evaluate */0 :
+ return state;
+ case /* Success */1 :
+ if (action.forCode === code) {
+ return {
+ TAG: 1,
+ logs: logs,
+ [Symbol.for("name")]: "Evaluated"
+ };
+ } else {
+ return state;
+ }
+ case /* Exception */2 :
+ if (action.forCode !== code) {
+ return state;
+ }
+ var exn = action.exn;
+ var message = exn.message;
+ return {
+ TAG: 2,
+ logs: logs.concat([message !== undefined ? message : ""]),
+ exn: exn,
+ [Symbol.for("name")]: "Error"
+ };
+ case /* Log */3 :
+ if (action.forCode === code) {
+ return {
+ TAG: 0,
+ code: code,
+ logs: logs.concat(action.logArgs),
+ [Symbol.for("name")]: "Evaluating"
+ };
+ } else {
+ return state;
+ }
+
+ }
+ case /* Evaluated */1 :
+ if (action.TAG === /* Evaluate */0) {
+ return {
+ TAG: 0,
+ code: action._0,
+ logs: [],
+ [Symbol.for("name")]: "Evaluating"
+ };
+ } else {
+ return state;
+ }
+ case /* Error */2 :
+ if (action.TAG === /* Evaluate */0) {
+ return {
+ TAG: 0,
+ code: action._0,
+ logs: [],
+ [Symbol.for("name")]: "Evaluating"
+ };
+ } else {
+ return state;
+ }
+
+ }
+}
+
+function useEval(param) {
+ var match = React.useReducer(reducer, /* Idle */0);
+ var dispatch = match[1];
+ var workerRef = React.useRef(undefined);
+ React.useEffect((function () {
+ var worker = Curry._1(EvalWorker.make, undefined);
+ workerRef.current = Caml_option.some(worker);
+ Curry._2(EvalWorker.App.onMessage, worker, (function (message) {
+ return Curry._1(dispatch, message.data);
+ }));
+ return (function (param) {
+ Belt_Option.map(workerRef.current, (function (worker) {
+ return Curry._1(EvalWorker.App.terminate, worker);
+ }));
+
+ });
+ }), []);
+ return [
+ match[0],
+ (function (code) {
+ var evaluateAction = {
+ TAG: 0,
+ _0: code,
+ [Symbol.for("name")]: "Evaluate"
+ };
+ Curry._1(dispatch, evaluateAction);
+ return Belt_Option.forEach(workerRef.current, (function (worker) {
+ return Curry._2(EvalWorker.App.postMessage, worker, evaluateAction);
+ }));
+ })
+ ];
+}
+
+export {
+ Config ,
+ EvalWorker ,
+ reducer ,
+ useEval ,
+
+}
+/* EvalWorker Not a pure module */
diff --git a/src/common/Eval.res b/src/common/Eval.res
new file mode 100644
index 000000000..80315f0f5
--- /dev/null
+++ b/src/common/Eval.res
@@ -0,0 +1,71 @@
+@val external importMetaUrl: string = "import.meta.url"
+
+type state =
+ | Idle
+ | Evaluating({code: string, logs: array})
+ | Evaluated({logs: array})
+ | Error({logs: array, exn: Js.Exn.t})
+type action =
+ | Evaluate(string)
+ | Success({forCode: string})
+ | Exception({forCode: string, exn: Js.Exn.t})
+ | Log({forCode: string, logArgs: array})
+
+module Config = {
+ type fromWorker = action
+ type fromApp = action
+ let make = () => %raw(`new Worker(new URL("./EvalWorker.mjs", import.meta.url))`)
+}
+
+module EvalWorker = Worker.Make(Config)
+
+let reducer = (state, action) =>
+ switch (state, action) {
+ | (Idle, Evaluate(code)) => Evaluating({code: code, logs: []})
+ | (Evaluating({code, logs}), Success({forCode})) if forCode === code => Evaluated({logs: logs})
+ | (Evaluating({code, logs}), Exception({forCode, exn})) if forCode === code =>
+ Error({
+ logs: logs->Js.Array2.concat([
+ switch exn->Js.Exn.message {
+ | Some(message) => message->Js.Json.string
+ | None => ""->Js.Json.string
+ },
+ ]),
+ exn: exn,
+ })
+ | (Evaluating({code, logs}), Log({forCode, logArgs})) if forCode === code =>
+ Evaluating({
+ code: code,
+ logs: logs->Js.Array2.concat(logArgs),
+ })
+ | (Error(_), Evaluate(code)) => Evaluating({code: code, logs: []})
+ | (Evaluated(_), Evaluate(code)) => Evaluating({code: code, logs: []})
+ | _ => state
+ }
+
+let useEval = () => {
+ let (state, dispatch) = React.useReducer(reducer, Idle)
+ let workerRef = React.useRef(None)
+
+ React.useEffect1(() => {
+ let worker = EvalWorker.make()
+ workerRef.current = Some(worker)
+
+ worker->EvalWorker.App.onMessage(message => dispatch(message["data"]))
+
+ Some(
+ () => workerRef.current->Belt.Option.map(worker => worker->EvalWorker.App.terminate)->ignore,
+ )
+ }, [])
+
+ (
+ state,
+ code => {
+ let evaluateAction = Evaluate(code)
+ evaluateAction->dispatch
+ workerRef.current->Belt.Option.forEach(worker =>
+ worker->EvalWorker.App.postMessage(evaluateAction)
+ )
+ },
+ )
+}
diff --git a/src/common/EvalWorker.mjs b/src/common/EvalWorker.mjs
new file mode 100644
index 000000000..69a64c1a0
--- /dev/null
+++ b/src/common/EvalWorker.mjs
@@ -0,0 +1,80 @@
+// Generated by ReScript, PLEASE EDIT WITH CARE
+
+import * as Eval from "./Eval.mjs";
+import * as Curry from "rescript/lib/es6/curry.js";
+
+var evaluateCode = (function (code, handlers) {
+ const rawConsole = console;
+ try {
+ // TODO: For some reason this isn't capturing logs...
+ const replace = {
+ log: function (...args) { handlers.onConsoleLog(args) },
+ warn: function (...args) { handlers.onConsoleWarn(args) },
+ error: function (...args) { handlers.onConsoleError(args) }
+ };
+ self.console = Object.assign({}, rawConsole, replace);
+ eval(code);
+ handlers.onDone()
+ } catch (exn) {
+ handlers.onException(exn);
+ }
+ self.console = rawConsole
+ });
+
+var dispatch = Eval.EvalWorker.$$Worker.postMessage;
+
+Curry._2(Eval.EvalWorker.$$Worker.onMessage, Eval.EvalWorker.$$Worker.self, (function (msg) {
+ var code = msg.data;
+ if (code.TAG !== /* Evaluate */0) {
+ return ;
+ }
+ var code$1 = code._0;
+ return evaluateCode(code$1, {
+ onConsoleLog: (function (logArgs) {
+ return Curry._1(dispatch, {
+ TAG: 3,
+ forCode: code$1,
+ logArgs: logArgs,
+ [Symbol.for("name")]: "Log"
+ });
+ }),
+ onConsoleWarn: (function (logArgs) {
+ return Curry._1(dispatch, {
+ TAG: 3,
+ forCode: code$1,
+ logArgs: logArgs,
+ [Symbol.for("name")]: "Log"
+ });
+ }),
+ onConsoleError: (function (logArgs) {
+ return Curry._1(dispatch, {
+ TAG: 3,
+ forCode: code$1,
+ logArgs: logArgs,
+ [Symbol.for("name")]: "Log"
+ });
+ }),
+ onException: (function (exn) {
+ return Curry._1(dispatch, {
+ TAG: 2,
+ forCode: code$1,
+ exn: exn,
+ [Symbol.for("name")]: "Exception"
+ });
+ }),
+ onDone: (function (param) {
+ return Curry._1(dispatch, {
+ TAG: 1,
+ forCode: code$1,
+ [Symbol.for("name")]: "Success"
+ });
+ })
+ });
+ }));
+
+export {
+ evaluateCode ,
+ dispatch ,
+
+}
+/* Not a pure module */
diff --git a/src/common/EvalWorker.res b/src/common/EvalWorker.res
new file mode 100644
index 000000000..84adb6ce0
--- /dev/null
+++ b/src/common/EvalWorker.res
@@ -0,0 +1,46 @@
+type evaluationHandlers = {
+ onConsoleLog: array => unit,
+ onConsoleWarn: array => unit,
+ onConsoleError: array => unit,
+ onException: Js.Exn.t => unit,
+ onDone: unit => unit,
+}
+
+let evaluateCode: (string, evaluationHandlers) => unit = %raw(`
+ function (code, handlers) {
+ const rawConsole = console;
+ try {
+ // TODO: For some reason this isn't capturing logs...
+ const replace = {
+ log: function (...args) { handlers.onConsoleLog(args) },
+ warn: function (...args) { handlers.onConsoleWarn(args) },
+ error: function (...args) { handlers.onConsoleError(args) }
+ };
+ self.console = Object.assign({}, rawConsole, replace);
+ eval(code);
+ handlers.onDone()
+ } catch (exn) {
+ handlers.onException(exn);
+ }
+ self.console = rawConsole
+ }
+`)
+
+let dispatch = Eval.EvalWorker.Worker.postMessage
+
+Eval.EvalWorker.Worker.self->Eval.EvalWorker.Worker.onMessage(msg =>
+ switch msg["data"] {
+ | Eval.Evaluate(code) =>
+ evaluateCode(
+ code,
+ {
+ onConsoleLog: logArgs => dispatch(Eval.Log({forCode: code, logArgs: logArgs})),
+ onConsoleWarn: logArgs => dispatch(Eval.Log({forCode: code, logArgs: logArgs})),
+ onConsoleError: logArgs => dispatch(Eval.Log({forCode: code, logArgs: logArgs})),
+ onException: exn => dispatch(Eval.Exception({forCode: code, exn: exn})),
+ onDone: () => dispatch(Eval.Success({forCode: code})),
+ },
+ )
+ | _ => ()
+ }
+)