Added python stuff

2025-11-29 20:11:05 +00:00
parent 02dadd613d
commit c3685ad1d5
5 changed files with 414 additions and 16 deletions
--- a/skulpttesting.html
+++ b/skulpttesting.html
@@ -0,0 +1,132 @@
+<html> 
+<head> 
+<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js" type="text/javascript"></script> 
+<script src="http://skulpt.org/js/skulpt.min.js" type="text/javascript"></script> 
+<script src="http://skulpt.org/js/skulpt-stdlib.js" type="text/javascript"></script> 
+<style>
+  /* Simple styling for better separation of input/output */
+  #input-container {
+    margin-top: 10px;
+    padding: 10px;
+    border: 1px solid #ccc;
+  }
+  #skulpt-input {
+    width: 80%;
+    padding: 5px;
+  }
+</style>
+</head> 
+
+<body> 
+
+<script type="text/javascript"> 
+// output functions are configurable.  This one just appends some text
+// to a pre element.
+function outf(text) { 
+    var mypre = document.getElementById("output"); 
+    mypre.innerHTML = mypre.innerHTML + text; 
+} 
+
+function builtinRead(x) {
+    if (Sk.builtinFiles === undefined || Sk.builtinFiles["files"][x] === undefined)
+            throw "File not found: '" + x + "'";
+    return Sk.builtinFiles["files"][x];
+}
+
+// --- Custom Inline Input Function ---
+var inputCallback;
+
+function inputf(prompt) {
+    // Display the prompt text to the user
+    document.getElementById("input-prompt").textContent = prompt;
+
+    // Show the input container
+    document.getElementById("input-container").style.display = 'block';
+
+    // Set focus on the input field
+    var inputField = document.getElementById("skulpt-input");
+    inputField.value = ''; // Clear previous input
+    inputField.focus();
+
+    // Return a promise that Skulpt will wait for
+    return new Promise(function(resolve, reject) {
+        inputCallback = resolve;
+    });
+}
+
+// Function to handle the submission of inline input
+function submitInput() {
+    var inputField = document.getElementById("skulpt-input");
+    var inputValue = inputField.value;
+
+    // Hide the input container again
+    document.getElementById("input-container").style.display = 'none';
+
+    // Fulfill the promise with the user's input value
+    if (inputCallback) {
+        inputCallback(inputValue);
+        inputCallback = null; // Clear the callback
+    }
+}
+// ------------------------------------
+
+// Here's everything you need to run a python program in skulpt
+function runit() { 
+   var prog = document.getElementById("yourcode").value; 
+   var mypre = document.getElementById("output"); 
+   mypre.innerHTML = ''; 
+   
+   // Hide the input container when a new run starts
+   document.getElementById("input-container").style.display = 'none';
+
+   Sk.pre = "output";
+   // Configure the custom input function: inputf
+   Sk.configure({output:outf, read:builtinRead, input:inputf}); 
+   
+   (Sk.TurtleGraphics || (Sk.TurtleGraphics = {})).target = 'mycanvas';
+   var myPromise = Sk.misceval.asyncToPromise(function() {
+       return Sk.importMainWithBody("<stdin>", false, prog, true);
+   });
+   myPromise.then(function(mod) {
+       console.log('success');
+   },
+       function(err) {
+       // Display errors in the output area
+       outf(err.toString() + '\n');
+       console.log(err.toString());
+   });
+} 
+
+// Allow pressing 'Enter' in the input field to submit
+document.addEventListener('DOMContentLoaded', function() {
+    document.getElementById('skulpt-input').addEventListener('keypress', function(e) {
+        if (e.key === 'Enter') {
+            e.preventDefault(); // Prevent default form submission
+            submitInput();
+        }
+    });
+});
+</script> 
+
+<h3>Try This</h3> 
+<form> 
+<textarea id="yourcode" cols="40" rows="10">
+name = raw_input("What is your name? ")
+print "Hello, " + name + "!"
+print "This is a demonstration of inline input."
+</textarea><br /> 
+<button type="button" onclick="runit()">Run</button> 
+</form> 
+
+<pre id="output" ></pre> 
+
+<div id="input-container" style="display:none;">
+    <label id="input-prompt"></label>
+    <input type="text" id="skulpt-input" />
+    <button type="button" onclick="submitInput()">Submit Input</button>
+</div>
+<div id="mycanvas"></div> 
+
+</body> 
+
+</html>