Skip to content
Snippets Groups Projects
Commit f3216cc3 authored by Benedikt's avatar Benedikt
Browse files

updated input

parent e0e57796
No related branches found
No related tags found
No related merge requests found
Pipeline #51713 failed
......@@ -130,8 +130,7 @@ export class DSIUnitInput extends HTMLElement {
return Object.keys(dsiUnitsHTML);
} else if (prevToken in dsiUnitsHTML) {
// After a unit, suggest all allowed tokens.
// If "\per" exists in the value, omit "per".
if (value.includes("\\per")) {
if (value.includes("\\per") || value.includes("/")) {
return this.allowedTokens.filter(token => token !== "per");
}
return this.allowedTokens;
......@@ -144,6 +143,15 @@ export class DSIUnitInput extends HTMLElement {
onInput(e) {
this._rawValue = this.input.value;
// Auto-insert a backslash if user types a space after a complete token.
if (this.input.value.endsWith(" ")) {
const trimmed = this.input.value.trimEnd();
// Check if last token is complete (i.e. non-empty and doesn't already end with a backslash).
if (!trimmed.endsWith("\\")) {
this.input.value = trimmed + "\\";
this._rawValue = this.input.value;
}
}
this.selectedSuggestionIndex = -1;
this.updateSuggestions();
if (this.liveUpdate) {
......@@ -154,29 +162,41 @@ export class DSIUnitInput extends HTMLElement {
updateSuggestions() {
const cursorPos = this.input.selectionStart;
const value = this.input.value;
// Check: if caret is inside the braces of a "tothe" token, do not show suggestions.
// Do not show suggestions if caret is inside the braces of a tothe token.
const regexTothe = /\\tothe\{([^}]*)$/;
const substring = value.substring(0, cursorPos);
const matchTothe = substring.match(regexTothe);
if (matchTothe) {
console.log("State: inside tothe braces → no suggestions");
this.suggestions.style.display = "none";
return;
}
// Use regex to capture current token (may be empty).
// Capture the current token (which may be empty).
const regex = /\\([a-zA-Z]*)$/;
const match = substring.match(regex);
let currentToken = "";
if (match) {
currentToken = match[1]; // might be empty
currentToken = match[1];
}
// Determine suggestions based on context.
// If currentToken exactly matches a known prefix, treat it as complete.
if (currentToken && (currentToken in dsiPrefixesHTML)) {
console.log("Token complete: currentToken matches known prefix:", currentToken);
currentToken = "";
}
const tokens = value.split("\\").filter(Boolean);
let prevToken = tokens.length >= 2 ? tokens[tokens.length - 2] : "<empty>";
const contextSuggestions = this.getContextualSuggestions();
const suggestions = currentToken === ""
let filtered = currentToken === ""
? contextSuggestions
: contextSuggestions.filter(token => token.startsWith(currentToken));
this.selectedSuggestionIndex = suggestions.length > 0 ? 0 : -1;
this.showSuggestions(suggestions, value.length - currentToken.length);
if (filtered.length === 0) {
console.log("State: prevToken =", prevToken, "currentToken =", currentToken, "→ No suggestions (filtered empty)");
this.suggestions.style.display = "none";
return;
}
this.selectedSuggestionIndex = 0;
console.log("State: prevToken =", prevToken, "currentToken =", currentToken, "contextSuggestions =", contextSuggestions, "filtered =", filtered);
this.showSuggestions(filtered, value.length - currentToken.length);
}
showSuggestions(list, tokenStartIndex) {
......@@ -187,6 +207,7 @@ export class DSIUnitInput extends HTMLElement {
}
list.forEach((token, index) => {
const item = document.createElement("div");
// For suggestion display, always show with a backslash.
item.textContent = "\\" + token;
item.className = "autocomplete-item";
if (index === this.selectedSuggestionIndex) {
......@@ -220,7 +241,7 @@ export class DSIUnitInput extends HTMLElement {
if (this.selectedSuggestionIndex !== -1) {
e.preventDefault();
const selectedItem = items[this.selectedSuggestionIndex];
const token = selectedItem.textContent.slice(1); // remove backslash
const token = selectedItem.textContent.slice(1); // remove leading backslash
const tokenStartIndex = this.input.value.lastIndexOf("\\");
this.acceptSuggestion(token, tokenStartIndex);
}
......@@ -249,6 +270,10 @@ export class DSIUnitInput extends HTMLElement {
this._rawValue = this.input.value;
const newPos = before.length + token.length + 2;
this.input.setSelectionRange(newPos, newPos);
} else if (token === "per") {
// Insert "/" instead of "\per" in the input field.
this.input.value = before + "/" + after;
this._rawValue = this.input.value;
} else {
this.input.value = before + "\\" + token + after;
this._rawValue = this.input.value;
......@@ -259,7 +284,9 @@ export class DSIUnitInput extends HTMLElement {
renderOutput() {
try {
const unit = new DSIUnit(this.input.value);
// Convert any "/" in the input value back to "\per" before parsing.
const processedValue = this.input.value.replace(/\//g, "\\per");
const unit = new DSIUnit(processedValue);
this.display.innerHTML = unit.toHTML();
if (unit.warnings && unit.warnings.length > 0) {
this.display.title = unit.warnings.join("; ");
......@@ -295,4 +322,4 @@ export class DSIUnitInput extends HTMLElement {
}
}
customElements.define("dsi-unit-input", DSIUnitInput);
customElements.define("dsi-unit-input", DSIUnitInput);
\ No newline at end of file
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment