marathi_typing 0.1.2 → 0.2.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 48d1b5510e3ce8ed69245b076104f3865b6c74ad1d4ce07394c47f8c5b08d9aa
-  data.tar.gz: 7e735d1d796b2c2cb26f2412a6136dd6fd75db772467279ff123d8cd9de8ef48
+  metadata.gz: 8f9141d8b16760161d8c02f9611f2b28faf4c51430bf02dc4c9ea958cd5aa2c6
+  data.tar.gz: d080cc2cdc1cd09aac409e3dee8d069205f3582950aefe0828787f96c08071ee
 SHA512:
-  metadata.gz: acd0feff334b2e7edf6a3e2fae89d137a5c40ce9024b27f226da25448a1eb474fd11508b996ea3ef95346f734c231f1e8e4961533ab85c5e05129df6b318218f
-  data.tar.gz: 3255f38a8ac16a26ce0595520c0f5b01f3ae0378012ebc4575d02fda7a90b726e517a7171efea4093a73a988548d8c9af6096d3514fe49abe2f3b61c8ce4232f
+  metadata.gz: d0cbb74bb7d19520fdd564cc6eeaecca4504d96cbcf0638e4c50f9c13f94cb627bb600d7afa5e13dd28e69790dc6a765dbf81dfe6fd3db79e964101b8d7ba4ed
+  data.tar.gz: 37d6525b0e2d1e04152d79e710666f18fd5feb208e18852e0de93dd9c55a0b46f44437ea475974f0b03cbc6b470b61e3748c96810ce905231ea50cab9b4e48f1

data/lib/generators/marathi_typing/templates/marathi_typing_controller.js

@@ -1,7 +1,8 @@
 import { Controller } from "@hotwired/stimulus"
 
 export default class extends Controller {
-  static targets = ["input"]
+  static targets = ["input"];
+
   timeout = null
 
 
@@ -14,16 +15,13 @@ export default class extends Controller {
     this.suggestionsTarget = this.buildSuggestionsBox()
 
     input.addEventListener("keydown", (e) => {
-
       if (e.key === " ") {
         this.skipNextSuggestionFetch = true;
       }
     });
 
     input.addEventListener("input", (e) => {
-
       if (this.skipNextSuggestionFetch) {
-
         this.skipNextSuggestionFetch = false;
         return;
       }
@@ -33,11 +31,11 @@ export default class extends Controller {
     input.addEventListener("keyup", (e) => {
 
       if (e.key === " ") {
-
         this.selectFirstSuggestion();
       }
     });
 
+    document.addEventListener("click", this.handleClickOutside);
   }
 
   fetchSuggestions(event) {
@@ -46,14 +44,21 @@ export default class extends Controller {
 
     clearTimeout(this.timeout)
     this.timeout = setTimeout(() => {
-      const lastWord = value.split(" ").pop()
 
-      fetch(`${this.apiUrl}?text=${lastWord}&itc=mr-t-i0-und&num=5&cp=0&cs=1&ie=utf-8&oe=utf-8&app=demopage`)
+      const { word: currentWord } = this.getCurrentWordAtCursor(this.inputTarget);
+
+      console.log("currentWord: ", currentWord)
+
+      if (!currentWord || !/^[a-zA-Z]+$/.test(currentWord)) return;
+      // if (!currentWord) return;
+
+
+      fetch(`${this.apiUrl}?text=${currentWord}&itc=mr-t-i0-und&num=5&cp=0&cs=1&ie=utf-8&oe=utf-8&app=demopage`)
         .then(res => res.json())
         .then(data => {
           if (data[0] === "SUCCESS") {
             const suggestions = data[1][0][1]
-            this.showSuggestions(suggestions, lastWord)
+            this.showSuggestions(suggestions, currentWord)
           }
         })
     }, 300)
@@ -64,13 +69,12 @@ export default class extends Controller {
     const box = document.createElement("div")
     box.className = "marathi-suggestions";
     box.style.position = "absolute";
-    box.style.background = "#fff";
+    box.style.background = "#808080";
     box.style.border = "0px solid #ccc";
     box.style.zIndex = "9999";
     box.style.padding = "0px";
     box.style.color = "black";
 
-    // Get the position of the input field
     const rect = this.inputTarget.getBoundingClientRect();
     const scrollOffset = window.scrollY || window.pageYOffset;
 
@@ -83,10 +87,7 @@ export default class extends Controller {
   }
 
   showSuggestions(suggestions, lastWord) {
-    this.suggestionsTarget.innerHTML = ""
-    this.suggestionsTarget.style.border = "1px solid #ccc";
-    this.suggestionsTarget.style.border = "4px";
-
+    this.showSuggestionsBox();
 
     suggestions.forEach(suggestion => {
       const option = document.createElement("div")
@@ -105,37 +106,112 @@ export default class extends Controller {
     this.suggestionsTarget.appendChild(originalOption);
   }
 
-  selectFirstSuggestion() {
 
+
+  selectFirstSuggestion() {
     if (!this.suggestionsTarget || this.suggestionsTarget.children.length === 0) return;
 
     const firstOption = this.suggestionsTarget.querySelector(".marathi-suggestion");
 
     if (firstOption) {
       const suggestion = firstOption.textContent;
-      const value = this.inputTarget.value.trim();
-      const lastWord = value.split(" ").pop();
-      this.selectSuggestion(suggestion, lastWord);
+      const input = this.inputTarget;
+      let { word: currentWord } = this.getCurrentWordAtCursor(input);
+
+      // If space was pressed, caret is after the space => no current word
+      if (!currentWord) {
+        const valueBeforeCursor = input.value.slice(0, input.selectionStart).trimEnd();
+        const words = valueBeforeCursor.split(/\s+/);
+        currentWord = words[words.length - 1] || "";
+      }
+
+
+      if (!currentWord) return;
+
+      console.log("currentWord:", currentWord, " suggestion:", suggestion);
+
+
+      this.selectSuggestion(suggestion, currentWord);
     }
   }
 
+  selectSuggestion(selected, originalWord) {
+    const input = this.inputTarget;
+    const { wordStart, wordEnd } = this.getCurrentWordAtCursor(input);
+
+    if (wordStart == null || wordEnd == null) return;
 
-  selectSuggestion(selected, lastWord) {
-    let currentValue = this.inputTarget.value;
-    const trailingSpace = currentValue.endsWith(" ") ? " " : "";
+    const value = input.value;
 
-    // Remove trailing space temporarily
-    currentValue = currentValue.trimEnd();
+    // Reconstruct the value with the selected word
+    const newValue = value.slice(0, wordStart) + selected + value.slice(wordEnd);
 
-    // Replace the last word
-    const newValue = currentValue.replace(new RegExp(`${lastWord}$`), selected);
+    // Update the input value and set caret after inserted suggestion
+    input.value = newValue;
 
-    // Re-apply trailing space if needed
-    this.inputTarget.value = newValue + trailingSpace;
+    // Move caret to after the inserted suggestion
+    const caretPos = wordStart + selected.length;
+    input.setSelectionRange(caretPos, caretPos);
 
+    this.hideSuggestions();
+
+  }
+
+  handleClickOutside = (event) => {
+    const isClickInsideInput = this.inputTarget.contains(event.target);
+    const isClickInsideSuggestions = this.suggestionsTarget?.contains(event.target);
+
+    if (!isClickInsideInput && !isClickInsideSuggestions) {
+      this.hideSuggestions();
+    }
+  };
+
+
+  getCurrentWordAtCursor(input) {
+    const value = input.value;
+    let cursorPos = input.selectionStart;
+
+    // If cursor is just after a space, move it back to find previous word
+    if (cursorPos > 0 && value[cursorPos - 1] === " ") {
+      cursorPos--;
+    }
+
+    // Skip any Devanagari characters while going backwards
+    let wordStart = cursorPos;
+    while (
+      wordStart > 0 &&
+      value[wordStart - 1].match(/[a-zA-Z0-9]/) // Only count English letters and numbers
+    ) {
+      wordStart--;
+    }
+
+    // Skip Devanagari going forward too
+    let wordEnd = cursorPos;
+    while (
+      wordEnd < value.length &&
+      value[wordEnd].match(/[a-zA-Z0-9]/)
+    ) {
+      wordEnd++;
+    }
+
+
+    let word = value.slice(wordStart, wordEnd);
+
+    return { word, wordStart, wordEnd };
+  }
+
+
+
+  hideSuggestions() {
     this.suggestionsTarget.innerHTML = "";
     this.suggestionsTarget.style.border = "0";
     this.suggestionsTarget.style.padding = "0";
   }
 
+  showSuggestionsBox() {
+    this.suggestionsTarget.innerHTML = "";
+    this.suggestionsTarget.style.border = "1px solid #0a0a0a";
+    this.suggestionsTarget.style.padding = "4px";
+  }
+
 }

data/lib/marathi_typing/version.rb

@@ -1,3 +1,3 @@
 module MarathiTyping
-  VERSION = '0.1.2'
+  VERSION = '0.2.0'
 end

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: marathi_typing
 version: !ruby/object:Gem::Version
-  version: 0.1.2
+  version: 0.2.0
 platform: ruby
 authors:
 - Ajit Dhanje
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2025-04-14 00:00:00.000000000 Z
+date: 2025-04-15 00:00:00.000000000 Z
 dependencies: []
 description:
 email: