Adding repl

Author: donovanh

_includes/default.njk

@@ -1,6 +1,5 @@
 ---
 layout: base.njk
-templateClass: tmpl-post
 ---
 
 <h1>{{ title }}</h1>

events/index.md

@@ -16,6 +16,8 @@ When the EventEmitter object emits an event, all of the functions attached to th
 
 This example creates an event listener for `foo` events, and an event emitter to fire these events.
 
+<div class="repl-code">
+
 ```javascript
 const { EventEmitter } = require('events');
 
@@ -35,6 +37,23 @@ eventEmitter.on('foo', foo);
 eventEmitter.emit('foo');
 ```
 
+</div>
+
+<script>
+  // TODO - move to main.js when other PRs merged
+  const replCode = document.querySelectorAll('.repl-code');
+  [...replCode].forEach(code => {
+    const codeText = encodeURI(code.innerText);
+    const link = document.createElement('a');
+    link.title = "Run this code in the REPL";
+    link.innerText = "Run this code in the REPL";
+    link.href = "/repl/?code=" + codeText;
+    const paragraph = document.createElement('p');
+    paragraph.appendChild(link);
+    code.appendChild(paragraph);
+  });
+</script>
+
 ## Passing parameters
 
 When an event is emitted using the `emit` method, the subsequent arguments are passed through to the listeners.

repl/index.md

@@ -0,0 +1,23 @@
+---
+layout: default.njk
+title: Node.js REPL
+---
+
+Use this space to try out code from the examples!
+
+<script src="https://embed.runkit.com"></script>
+
+<div id="repl"></div>
+
+<script>
+
+const urlParams = new URLSearchParams(window.location.search);
+const code = urlParams.get('code');
+
+const notebook = RunKit.createNotebook({
+    element: document.getElementById("repl"),
+    source: code || "// Your JavaScript code goes here",
+    minHeight: "500px",
+});
+
+</script>