kalk_web: Adjusted for piecewise and comparison operators

kalk/src/calculus.rs

@@ -213,7 +213,6 @@ mod tests {
             KalkNum::new_with_imaginary(KalkNum::from(2f64).value, "", KalkNum::from(3f64).value),
         )
         .unwrap();
-        println!("{}", result.to_f64());
         assert!(cmp(result.to_f64(), -4.5f64) || cmp(result.to_f64(), -4.499999f64));
         assert!(cmp(result.imaginary_to_f64(), 18f64));
     }

kalk_web/package-lock.json

@@ -1,15 +1,15 @@
 {
 	"name": "@paddim8/kalk-component",
-	"version": "1.1.3",
+	"version": "1.2.3",
 	"lockfileVersion": 2,
 	"requires": true,
 	"packages": {
 		"": {
 			"name": "@paddim8/kalk-component",
-			"version": "1.1.3",
+			"version": "1.2.3",
 			"license": "MIT",
 			"dependencies": {
-				"@paddim8/kalk": "^2.0.2",
+				"@paddim8/kalk": "../kalk/pkg",
 				"shadow-selection-polyfill": "^1.1.0"
 			},
 			"devDependencies": {
@@ -49,7 +49,6 @@
 		"../kalk/pkg": {
 			"name": "@paddim8/kalk",
 			"version": "2.0.0",
-			"extraneous": true,
 			"license": "MIT"
 		},
 		"node_modules/@babel/code-frame": {
@@ -1129,9 +1128,8 @@
 			}
 		},
 		"node_modules/@paddim8/kalk": {
-			"version": "2.0.2",
-			"resolved": "https://registry.npmjs.org/@paddim8/kalk/-/kalk-2.0.2.tgz",
-			"integrity": "sha512-okiy4eUMzZZXRaE3hEQSv6BQ+w56M4IWw7iAr4F+UMZKY0omzAMPyDaL53PtDrT0A1mDYvMRYpV3GzlykVPs+Q=="
+			"resolved": "../kalk/pkg",
+			"link": true
 		},
 		"node_modules/@trysound/sax": {
 			"version": "0.1.1",
@@ -12308,9 +12306,7 @@
 			}
 		},
 		"@paddim8/kalk": {
-			"version": "2.0.2",
-			"resolved": "https://registry.npmjs.org/@paddim8/kalk/-/kalk-2.0.2.tgz",
-			"integrity": "sha512-okiy4eUMzZZXRaE3hEQSv6BQ+w56M4IWw7iAr4F+UMZKY0omzAMPyDaL53PtDrT0A1mDYvMRYpV3GzlykVPs+Q=="
+			"version": "file:../kalk/pkg"
 		},
 		"@trysound/sax": {
 			"version": "0.1.1",

kalk_web/src/KalkCalculator.svelte

@@ -48,14 +48,13 @@
     let hasBeenInteractedWith = false;
 
     function setText(text: string) {
-        inputElement.value = text;
         const highlighted = highlight(text);
         setHtml(highlighted);
     }
 
     function setHtml(html: string) {
         highlightedTextElement.innerHTML = html;
-        inputElement.value = highlightedTextElement.textContent;
+        inputElement.value = highlightedTextElement.innerText;
 
         if (!html) {
             highlightedTextElement.innerHTML = `<span class='placeholder'>${hinttext}</div>`;
@@ -72,7 +71,7 @@
     ): [result: string, success: boolean] {
         try {
             if (!kalkContext) kalkContext = new kalk.Context();
-            const result = kalkContext.evaluate(input);
+            const result = kalkContext.evaluate(input.replaceAll(/\s+/g, " "));
 
             return [result?.toPrettyString(), true];
         } catch (err) {
@@ -80,9 +79,28 @@
         }
     }
 
+    function hasUnevenAmountOfBraces(input: string): boolean {
+        let openCount = 0;
+        let closedCount = 0;
+        for (const char of input) {
+            if (char == "{") openCount++;
+            if (char == "}") closedCount++;
+        }
+
+        return openCount > closedCount;
+    }
+
     function handleKeyDown(event: KeyboardEvent, kalk: Kalk) {
         hasBeenInteractedWith = true;
         if (event.key == "Enter") {
+            if (
+                hasUnevenAmountOfBraces(
+                    (event.target as HTMLTextAreaElement).value
+                )
+            ) {
+                return;
+            }
+
             selectedLineOffset = 0;
             const input = inputElement.value;
             let output: string;
@@ -157,13 +175,7 @@
 
     function handleInput(event: Event) {
         const target = event.target as HTMLInputElement;
-        // Make sure it doesn't mess with the HTML.
-        target.value = target.value
-            .replaceAll("\n", "")
-            .replaceAll("  ", " ")
-            .replaceAll("&", "")
-            .replaceAll("<", "");
-        setText(target.value);
+        setText(target.value == "\n" ? "" : target.value);
     }
 
     function handleTouchLine(event: Event) {
@@ -236,8 +248,22 @@
         if (!input) return "";
         let result = input;
         result = result.replace(
-            /(?<identifier>[^!-@\s_|^⌊⌋⌈⌉≈]+(_\d+)?)|(?<op>[+\-/*%^!≈])/g,
-            (substring, identifier, _, op) => {
+            /(?<html>[<>&]|(\n\s*\}?|\s+))|(?<op>([+\-/*%^!≈]|if|otherwise)|(?<identifier>[^!-@\s_|^⌊⌋⌈⌉≈\[\]\{\}≠≥≤]+(_\d+)?))/g,
+            (substring, _, html, _2, op, identifier) => {
+                if (html) {
+                    if (substring == "<") return "&lt;";
+                    if (substring == ">") return "&gt;";
+                    if (substring == "&") return "&amp;";
+                    if (substring.match(/\s+/)) return "&nbsp;";
+                    if (substring.startsWith("\n")) {
+                        if (substring.endsWith("}")) {
+                            return "<br />}";
+                        } else {
+                            return "<br />&nbsp;&nbsp;";
+                        }
+                    }
+                }
+
                 if (identifier) {
                     let newSubstring: string = substring;
                     switch (substring) {
@@ -412,6 +438,7 @@
             width: 100%;
             color: white;
             word-wrap: anywhere;
+            line-height: 1;
             z-index: 1;
         }
 
@@ -420,11 +447,14 @@
             position: absolute;
             top: 0;
             left: 0;
+            height: 100%;
             width: 100%;
             border: 0;
             font-size: inherit;
             font-family: inherit;
 
+            line-height: 1;
+            overflow: hidden;
             cursor: text;
             color: transparent;
             background: transparent;