purescript
diff --git a/‎frame.html
Lines changed: 62 additions & 0 deletions b/‎frame.html
Lines changed: 62 additions & 0 deletions
diff --git a/‎index.html
Lines changed: 9 additions & 19 deletions b/‎index.html
Lines changed: 9 additions & 19 deletions
@@ -0,0 +1,62 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+  <title>Try PureScript!</title>
+  <meta content="text/html;charset=utf-8" http-equiv="Content-Type">
+  <meta content="utf-8" http-equiv="encoding">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <link rel="stylesheet" href="css/style.css">
+</head>
+<body>
+<main id="main"></main>
+<script type="text/javascript">
+  (function() {
+    function evalPureScript(sources) {
+      var modules = {};
+      return function load(name) {
+        if (modules[name]) {
+          return modules[name].exports;
+        }
+        function require(path) {
+          if (path === "./foreign.js") {
+            return load(name + "$Foreign");
+          }
+          if (path.indexOf("../") === 0) {
+            return load(path.slice(3).replace(/\/index\.js$/, ""));
+          }
+          return load(path);
+        }
+        var module = modules[name] = { exports: {} };
+        new Function("module", "exports", "require", sources[name])(module, module.exports, require);
+        return module.exports;
+      };
+    }
+
+    function loadScripts(scripts, cb) {
+      if (scripts.length === 0) {
+        return cb();
+      }
+      var script = document.createElement("script");
+      script.type = "text/javascript";
+      script.src = scripts[0];
+      script.addEventListener("load", function() {
+        loadScripts(scripts.slice(1), cb);
+      }, { once: true });
+      document.head.appendChild(script);
+    }
+
+    document.addEventListener("DOMContentLoaded", function() {
+      window.addEventListener("message", function(event) {
+        loadScripts(event.data.scripts, function() {
+          var file = evalPureScript(event.data.sources)("<file>");
+          if (file.main && typeof file.main === "function") {
+            file.main();
+          }
+        });
+        event.source.postMessage("trypurescript", "*");
+      }, { once: true });
+    }, { once: true });
+  })();
+</script>
+</body>
+</html>
@@ -188,30 +188,20 @@
       })(marker));
     }
 
-    function setupIFrame($ctr, html, js) {
-      var $iframe = $('<iframe id="output-iframe">');
+    function setupIFrame($ctr, data) {
+      var $iframe = $('<iframe sandbox="allow-scripts" id="output-iframe" src="frame.html">');
 
       $ctr
         .empty()
         .append($iframe);
 
-      var iframe = $iframe.get(0).contentWindow.document;
-      iframe.open();
-      iframe.write(html);
-      iframe.close();
-
-      var script = iframe.createElement('script');
-      script.appendChild(iframe.createTextNode(js));
-
-      $iframe.ready(function() {
-        var checkExists = setInterval(function() {
-          var body = iframe.getElementsByTagName('body')[0];
-          if (body) {
-            body.appendChild(script);
-            clearInterval(checkExists);
-          }
-        }, 100);
-      });
+      var sendSources = setInterval(function() {
+        $iframe.get(0).contentWindow.postMessage(data, "*");
+      }, 100);
+
+      window.addEventListener("message", function() {
+        clearInterval(sendSources);
+      }, { once: true });
 
       return $iframe;
     }