about summary refs log tree commit diff stats
diff options
context:
space:
mode:
authorelioat <elioat@tilde.institute>2024-09-03 20:08:09 -0400
committerelioat <elioat@tilde.institute>2024-09-03 20:08:09 -0400
commit45315993d05abfdeb8b7facf57933441edb7f9a9 (patch)
tree00b48cd145b83a67ff015a325bcb5e2c859f7965
parent404e486571eaa24c4c538c1fbb2fe845af4bbc23 (diff)
downloadtour-45315993d05abfdeb8b7facf57933441edb7f9a9.tar.gz
*
-rw-r--r--html/playground/index.html30
1 files changed, 27 insertions, 3 deletions
diff --git a/html/playground/index.html b/html/playground/index.html
index ec575a5..522f3da 100644
--- a/html/playground/index.html
+++ b/html/playground/index.html
@@ -92,10 +92,10 @@
 </head>
 <body>
 
-    <div class="playground">    
+    <div class="playground" id="playground">    
         <!-- use this empty div to mount stuff -->
-        <div class="seesaw"></div>
-        <div class="slide"></div>
+        <div class="seesaw" id="seesaw"></div>
+        <div class="slide" id="slide"></div>
     </div>
 
     <div class="button-container">
@@ -183,6 +183,30 @@
             }
         }
 
+        function help() {
+            const helpText = `
+            Welcome to the JavaScript Playground! Here are some tips to get you started:
+
+            1. Enter your JavaScript code in the text area.
+            2. Click the "Run Code" button to execute your code.
+            3. The console output will be displayed below the text area.
+            4. Click the "Clear" button to reset the playground.
+            5. Click the "Download" button to save your code and editor as an HTML file.
+            6. Click the "Share" button to generate a URL to share your code with others.
+            7. You can also press "Cmd + Enter" to run your code.
+            8. There's an empty div, with the id "playground"
+            9. That playground div contains 2 child divs, with the ids "seesaw" and "slide"
+            10. You can use those divs to mount stuff to the DOM
+
+            Go nuts! Share scrappy fiddles!
+            `;
+            console.log(helpText);
+        }
+
+        function clearLog() {
+            document.getElementById('console').innerHTML = '';
+        }
+
         document.getElementById('codeInput').addEventListener('keydown', function(event) {
             if (event.metaKey && event.key === 'Enter') {
                 event.preventDefault();