Merge pull request #20 from milafrerichs/add-console

Add console

src/Console.svelte

@@ -0,0 +1,24 @@
+<script>
+	import Viewer from './Viewer.svelte';
+	import { onMount } from 'svelte';
+  export let output
+  let message = '';
+	$: if(output) {
+		message = `
+		document.body.innerHTML = '';
+    var consoleOutput = '';
+    var old = console.log;
+    console.log = function (message) {
+      if (typeof message == 'object') {
+        consoleOutput += (JSON && JSON.stringify ? JSON.stringify(message) : message) + '<br />';
+      } else {
+        consoleOutput += message + '<br />';
+      }
+    };
+		${output}
+		document.body.innerHTML = '';
+    document.body.innerHTML = consoleOutput;
+		`
+	}
+</script>
+<Viewer code={message} />

src/Tutorials.svelte

@@ -1,6 +1,7 @@
 <script>
   import Viewer from './Viewer.svelte';
   import Editor from './Editor.svelte';
+  import Console from './Console.svelte';
 
   let code = '';
   let ready = false;
@@ -92,6 +93,7 @@
     {/if}
     <div class="{cssStyles.viewer}">
       <Viewer bind:ready {code} />
+      <Console bind:ready output={code} />
     </div>
   </div>
 </div>

test/App.svelte

@@ -11,7 +11,7 @@
 		{
 			content: 'Test 2',
       code: 'document.body.innerHTML = "Test 2";',
-      solution: 'document.body.innerHTML = "Solution 2";'
+      solution: 'document.body.innerHTML = "Solution 2";console.log("Test")'
 		}
 	]
   let cssStyles = {