Better suggestion accept on mobile and word wrap offset fix
This commit is contained in:
30
ui/script.js
30
ui/script.js
@@ -14,7 +14,6 @@ document.addEventListener("DOMContentLoaded", () => {
|
||||
const generateBtn = document.getElementById("generate-more-btn");
|
||||
const sidebarToggle = document.getElementById("sidebar-toggle");
|
||||
const sidebar = document.getElementById("sidebar");
|
||||
const acceptSuggestionBtn = document.getElementById("accept-suggestion-btn");
|
||||
|
||||
let currentSuggestion = "";
|
||||
let isFetching = false;
|
||||
@@ -101,15 +100,29 @@ document.addEventListener("DOMContentLoaded", () => {
|
||||
};
|
||||
|
||||
const updateSuggestion = () => {
|
||||
suggestionOverlay.innerHTML = "";
|
||||
|
||||
const editorText = editor.value;
|
||||
const space = editorText.length > 0 && !/\s$/.test(editorText) ? " " : "";
|
||||
suggestionOverlay.textContent = editorText + space + currentSuggestion;
|
||||
|
||||
// Show/hide accept button
|
||||
// Create invisible text span to match editor content exactly
|
||||
const textSpan = document.createElement("span");
|
||||
textSpan.textContent = editorText + space;
|
||||
textSpan.style.color = "transparent";
|
||||
suggestionOverlay.appendChild(textSpan);
|
||||
|
||||
if (currentSuggestion) {
|
||||
acceptSuggestionBtn.classList.add("visible");
|
||||
} else {
|
||||
acceptSuggestionBtn.classList.remove("visible");
|
||||
const suggestionSpan = document.createElement("span");
|
||||
suggestionSpan.textContent = currentSuggestion;
|
||||
suggestionSpan.className = "suggestion-highlight";
|
||||
|
||||
// Add Tab Icon (Better SVG for Tab Key)
|
||||
const iconSpan = document.createElement("span");
|
||||
iconSpan.style.pointerEvents = "none"; // Ensure clicks pass through to suggestionSpan
|
||||
iconSpan.innerHTML = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="tab-icon"><path d="M21 9V15"/><path d="M3 12H17"/><path d="m14 9 3 3-3 3"/></svg>`;
|
||||
suggestionSpan.appendChild(iconSpan);
|
||||
|
||||
suggestionOverlay.appendChild(suggestionSpan);
|
||||
}
|
||||
};
|
||||
|
||||
@@ -145,8 +158,9 @@ document.addEventListener("DOMContentLoaded", () => {
|
||||
}
|
||||
});
|
||||
|
||||
acceptSuggestionBtn.addEventListener("click", () => {
|
||||
if (currentSuggestion) {
|
||||
// Handle click on suggestion
|
||||
suggestionOverlay.addEventListener("click", (e) => {
|
||||
if (e.target.classList.contains("suggestion-highlight")) {
|
||||
insertText(currentSuggestion);
|
||||
fetchPrediction(editor.value);
|
||||
editor.focus();
|
||||
|
||||
Reference in New Issue
Block a user