From c357d01b7c4184972be5230e155d3b2242b8e4fb Mon Sep 17 00:00:00 2001
From: Felix Roos <flix91@gmail.com>
Date: Mon, 30 Dec 2024 23:48:40 +0100
Subject: [PATCH] stop key

---
 src/main.js    | 11 +++++++++
 src/strudel.js |  2 +-
 src/theme.js   | 64 ++++++++++++++++++++++++++++++++++++++++++++++++++
 3 files changed, 76 insertions(+), 1 deletion(-)
 create mode 100644 src/theme.js

diff --git a/src/main.js b/src/main.js
index 5bd891c..a40db9b 100644
--- a/src/main.js
+++ b/src/main.js
@@ -2,6 +2,7 @@ import { EditorView, basicSetup } from "codemirror";
 import { javascript } from "@codemirror/lang-javascript";
 import { oneDark } from "@codemirror/theme-one-dark";
 import { EditorState, Prec } from "@codemirror/state";
+import { keymap } from "@codemirror/view";
 import { yCollab } from "y-codemirror.next";
 import { Session } from "@flok-editor/session";
 import { flashField, evalKeymap, remoteEvalFlash } from "@flok-editor/cm-eval";
@@ -39,6 +40,7 @@ const createEditor = (doc) => {
     );
     return;
   }
+  const stopKeys = ["Ctrl-.", "Alt-."];
   const state = EditorState.create({
     doc: doc.content,
     extensions: [
@@ -47,6 +49,14 @@ const createEditor = (doc) => {
       javascript(),
       EditorView.lineWrapping,
       oneDark,
+      Prec.highest(
+        keymap.of([
+          ...stopKeys.map((key) => ({
+            key,
+            run: () => doc.evaluate("$: silence", { from: null, to: null }),
+          })),
+        ])
+      ),
     ],
   });
 
@@ -54,6 +64,7 @@ const createEditor = (doc) => {
   const view = new EditorView({
     state,
     parent: editorEl,
+    // extensions: [kabelsalatTheme],
   });
   editorViews.set(doc.id, view);
 
diff --git a/src/strudel.js b/src/strudel.js
index 1f25c2d..823e1c9 100644
--- a/src/strudel.js
+++ b/src/strudel.js
@@ -197,7 +197,7 @@ export class StrudelSession {
 
       await this.repl.scheduler.setPattern(allPatterns, true);
 
-      console.log("afterEval", meta);
+      //console.log("afterEval", meta);
     } catch (err) {
       console.error(err);
       this.onError(`${err}`);
diff --git a/src/theme.js b/src/theme.js
new file mode 100644
index 0000000..17e7dea
--- /dev/null
+++ b/src/theme.js
@@ -0,0 +1,64 @@
+// currently unused
+import { EditorView } from "codemirror";
+import { tags } from "@lezer/highlight";
+import { HighlightStyle } from "@codemirror/language";
+import { syntaxHighlighting } from "@codemirror/language";
+
+let colors = {
+  teal600: "#0d9488",
+  teal400: "#2dd4bf",
+  amber: "#d97706",
+  violet400: "#a78bfa",
+  violet300: "#c4b5fd",
+  indigo300: "#a5b4fc",
+  indigo400: "#818cf8",
+  fuchsia400: "#e879f9",
+  fuchsia300: "#f0abfc",
+  fuchsia200: "#f5d0fe",
+  whitish: "#ddd",
+  stone400: "#a8a29e",
+  stone500: "#78716c",
+};
+
+let theme = EditorView.theme(
+  {
+    "&": {
+      color: colors.teal600,
+      overflow: "hidden",
+      backgroundColor: "transparent",
+      fontSize: "16px",
+      height: "100%",
+    },
+    ".cm-gutters": {
+      "background-color": "transparent",
+      color: colors.stone500,
+    },
+    ".cm-cursor": {
+      "border-left-color": "#d9770696",
+      "border-left-width": "11px",
+    },
+    ".cm-activeLine, .cm-activeLineGutter": {
+      "background-color": "#aaaaaa20",
+    },
+    ".cm-cursorLayer": {
+      // "animation-name": "inherit !important;", // disables blinking
+    },
+    ".cm-matchingBracket": {
+      "text-decoration": "underline 0.12rem",
+      "text-underline-offset": "0.24rem",
+      "text-decoration-color": colors.fuchsia300,
+    },
+  },
+  { dark: true }
+);
+
+const highlightStyle = HighlightStyle.define([
+  { tag: tags.keyword, color: colors.fuchsia300 },
+  { tag: tags.literal, color: colors.whitish },
+  { tag: tags.squareBracket, color: colors.amber },
+  { tag: tags.punctuation, color: colors.fuchsia300 },
+  { tag: tags.operator, color: colors.fuchsia300 },
+  { tag: tags.comment, color: colors.stone500, fontStyle: "italic" },
+]);
+
+export let kabelsalatTheme = [theme, syntaxHighlighting(highlightStyle)];