mirror of
https://github.com/PaddiM8/kalker.git
synced 2025-02-07 12:09:18 +01:00
web: Parenthesis completion when typing normally
This commit is contained in:
parent
b64f607b99
commit
ebd4f10987
@ -51,8 +51,7 @@
|
|||||||
const [highlighted, offset] = highlight(text);
|
const [highlighted, offset] = highlight(text);
|
||||||
const prevCursorPos = inputElement.selectionStart;
|
const prevCursorPos = inputElement.selectionStart;
|
||||||
setHtml(highlighted);
|
setHtml(highlighted);
|
||||||
inputElement.selectionStart = prevCursorPos + offset;
|
setCaret(prevCursorPos + offset);
|
||||||
inputElement.selectionEnd = inputElement.selectionStart;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
function setHtml(html: string) {
|
function setHtml(html: string) {
|
||||||
@ -68,6 +67,15 @@
|
|||||||
return highlightedTextElement.innerHTML;
|
return highlightedTextElement.innerHTML;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function setCaret(pos: number) {
|
||||||
|
inputElement.selectionStart = pos;
|
||||||
|
inputElement.selectionEnd = inputElement.selectionStart;
|
||||||
|
}
|
||||||
|
|
||||||
|
function offsetCaret(offset: number) {
|
||||||
|
setCaret(inputElement.selectionStart + offset);
|
||||||
|
}
|
||||||
|
|
||||||
function calculate(
|
function calculate(
|
||||||
kalk: Kalk,
|
kalk: Kalk,
|
||||||
input: string
|
input: string
|
||||||
@ -179,9 +187,15 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function handleInput(event: Event) {
|
function handleInput(e: Event) {
|
||||||
|
const event = e as InputEvent;
|
||||||
const target = event.target as HTMLInputElement;
|
const target = event.target as HTMLInputElement;
|
||||||
setText(target.value == "\n" ? "" : target.value);
|
setText(target.value == "\n" ? "" : target.value);
|
||||||
|
|
||||||
|
if (event.data == "(") {
|
||||||
|
insertText(")");
|
||||||
|
offsetCaret(-1);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function handleTouchLine(event: Event) {
|
function handleTouchLine(event: Event) {
|
||||||
@ -208,8 +222,7 @@
|
|||||||
function handleArrowClick(event: Event, left: boolean) {
|
function handleArrowClick(event: Event, left: boolean) {
|
||||||
const length = inputElement.value.length;
|
const length = inputElement.value.length;
|
||||||
const selection = inputElement.selectionEnd + (left ? -1 : 1);
|
const selection = inputElement.selectionEnd + (left ? -1 : 1);
|
||||||
inputElement.selectionEnd = Math.min(Math.max(selection, 0), length);
|
setCaret(Math.min(Math.max(selection, 0), length));
|
||||||
inputElement.selectionStart = inputElement.selectionEnd;
|
|
||||||
inputElement.focus({ preventScroll: true });
|
inputElement.focus({ preventScroll: true });
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -243,8 +256,7 @@
|
|||||||
"end"
|
"end"
|
||||||
);
|
);
|
||||||
setText(inputElement.value);
|
setText(inputElement.value);
|
||||||
inputElement.selectionStart += offset;
|
offsetCaret(offset);
|
||||||
inputElement.selectionEnd = inputElement.selectionStart;
|
|
||||||
inputElement.focus({ preventScroll: true });
|
inputElement.focus({ preventScroll: true });
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -257,7 +269,7 @@
|
|||||||
let result = input;
|
let result = input;
|
||||||
let offset = 0;
|
let offset = 0;
|
||||||
result = result.replace(
|
result = result.replace(
|
||||||
/(?<html>[<>&]|(\n\s*\}?|\s+))|(?<op>([+\-/*%^!≈]|if|otherwise)|(?<identifier>[^!-@\s_|^⌊⌋⌈⌉≈\[\]\{\}≠≥≤]+(_\d+)?))/g,
|
/(?<html>[<>&]|(\n\s*\}?|\s+))|(?<op>([+\-/*%^!≈]|if|otherwise)|(?<identifier>[^!-@\s_|^⌊⌋⌈⌉≈\[\]\{\}≠≥≤]+(_\d+)?)\(?)/g,
|
||||||
(substring, _, html, _2, op, identifier) => {
|
(substring, _, html, _2, op, identifier) => {
|
||||||
if (html) {
|
if (html) {
|
||||||
if (substring == "<") return "<";
|
if (substring == "<") return "<";
|
||||||
@ -277,22 +289,34 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
if (identifier) {
|
if (identifier) {
|
||||||
let newSubstring: string = substring;
|
let substringWithoutParen = substring.endsWith("(")
|
||||||
switch (substring) {
|
? substring.slice(0, -1)
|
||||||
|
: substring;
|
||||||
|
let newSubstring: string = substringWithoutParen;
|
||||||
|
let addParen = false;
|
||||||
|
switch (substringWithoutParen) {
|
||||||
case "sqrt": {
|
case "sqrt": {
|
||||||
newSubstring = "√";
|
newSubstring = "√";
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
case "sum": {
|
case "sum": {
|
||||||
newSubstring = "∑";
|
newSubstring = "∑";
|
||||||
|
addParen = true;
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
case "prod": {
|
case "prod": {
|
||||||
newSubstring = "∏";
|
newSubstring = "∏";
|
||||||
|
addParen = true;
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
case "integral": {
|
||||||
|
newSubstring = "∫";
|
||||||
|
addParen = true;
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
case "integrate": {
|
case "integrate": {
|
||||||
newSubstring = "∫";
|
newSubstring = "∫";
|
||||||
|
addParen = true;
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
case "pi": {
|
case "pi": {
|
||||||
@ -318,8 +342,16 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
offset -= substring.length - newSubstring.length;
|
offset -= substring.length - newSubstring.length;
|
||||||
|
let parenthesis = "";
|
||||||
|
if (substring.endsWith("(")) {
|
||||||
|
parenthesis = "(";
|
||||||
|
offset += 1;
|
||||||
|
} else if (addParen) {
|
||||||
|
parenthesis = "()";
|
||||||
|
offset += 1;
|
||||||
|
}
|
||||||
|
|
||||||
return `<span style="color: ${identifiercolor}">${newSubstring}</span>`;
|
return `<span style="color: ${identifiercolor}">${newSubstring}</span>${parenthesis}`;
|
||||||
}
|
}
|
||||||
|
|
||||||
if (op) {
|
if (op) {
|
||||||
|
Loading…
Reference in New Issue
Block a user