Merge pull request #3 from LyonSyonII/dev

Improve editing process with tab and backspace

example/src/editor.ts

@@ -0,0 +1,27 @@
+export function setupEditor(input: HTMLTextAreaElement) {
+	input.addEventListener("keydown", (e) => {
+		switch (e.key) {
+			case "Tab": {
+				e.preventDefault();
+				e.stopPropagation();
+				const [start, end] = [input.selectionStart, input.selectionEnd];
+				input.setRangeText("  ", start, end, "end");
+				break;
+			}
+			case "Backspace": {
+				let [start, end] = [input.selectionStart, input.selectionEnd];
+				if (start !== end) {
+					return;
+				}
+				e.preventDefault();
+				e.stopPropagation();
+				if (input.value.substring(start-2, start+1) === "  ") {
+					start -= 2;
+				} else {
+					start -= 1;
+				}
+				start >= 0 && input.setRangeText("", start, end, "end");
+			}
+		}
+	})
+}

example/src/interpreter/interpreter.ts

@@ -151,8 +151,6 @@ async function cached_or_fetch(path: string) {
   // Downloads or caches the file from `path`
   // Files of more than 10MB aren't cached by fetch, so it must be done manually
   const base = import.meta.env.BASE_URL === "/" ? "" : import.meta.env.BASE_URL;
-  console.log({base, url: import.meta.url, path});
-
   path = base + path;
   try {
     caches

example/src/pages/index.astro

@@ -65,6 +65,7 @@ const base = import.meta.env.BASE_URL === "/" ? "" : import.meta.env.BASE_URL;
 
 <script>
 	import { Interpreter } from "../interpreter";
+	import { setupEditor } from "../editor";
 	import { AnsiUp } from "ansi_up";
 
 	const input = document.body.querySelector<HTMLTextAreaElement>("textarea#input")!;
@@ -105,7 +106,9 @@ const base = import.meta.env.BASE_URL === "/" ? "" : import.meta.env.BASE_URL;
 			input.dispatchEvent(new Event("input"));
 		}
 	});
-
+
+	setupEditor(input);
+
 	// Run the Interpreter when on "Live Edit" or the "Run" button is clicked
 	input.addEventListener("input", async () => {
 		if (!liveEdit.checked || button.disabled) {