Updating lexicon loading

wiktionary_pron/css/style.css

@@ -7,6 +7,7 @@
     font-family: "Noto Sans Semibold";
     src: url("../fonts/NotoSans-SemiBold.woff2") format("woff2");
 }
+
 @font-face {
     font-family: "EB Garamond";
     src: url("../fonts/EBGaramond-Regular.woff2") format("woff2");
@@ -170,7 +171,6 @@ body.dark_mode button.audio-popup-line:hover {
 }
 
 
-
 body.dark_mode button {
     background-color: #CE93D8;
     color: black;
@@ -296,7 +296,6 @@ body i.fa-moon-o {
 }
 
 
-
 .audio-popup-line {
 
     position: absolute;
@@ -368,4 +367,23 @@ body i.fa-moon-o {
     90%, 100% {
         content: '';
     }
+}
+
+.ipa::before {
+    content: attr(content);
+}
+
+
+#options_container {
+    max-height: 0;
+    overflow: hidden;
+    transition: max-height 0.2s ease-out;
+    min-height: 30px;
+    background-color: #f1f1f1;
+}
+
+input[type="checkbox"] {
+    transform: scale(1.5);
+    vertical-align: initial;
+    height: initial;
 }

wiktionary_pron/scripts/lexicon.js

@@ -7,11 +7,19 @@ async function loadLexicon(language) {
     French: "french_lexicon.zip",
   };
   const lexiconFolder = "./utils/";
+  console.time("A");
+  console.log("Fetching zip");
 
   const zipBlob = await fetchWithCache(lexiconFolder + languages[language]);
+  console.timeLog("A");
+  console.log("Loaded zip");
   const blob = await zipBlob.blob();
+  console.timeLog("A");
+  console.log("Loaded blob");
   const wordPairsList = await loadFileFromZipOrPath(blob, "lexicon.json");
+  console.timeLog("A");
 
+  console.log("Loaded lexicon string");
   const worker = new Worker("scripts/lexicon_loader_worker.js");
 
   function process_lexicon(text) {
@@ -24,9 +32,24 @@ async function loadLexicon(language) {
     });
   }
 
+  globalThis.wordPairsList = wordPairsList;
   const lexicon = await process_lexicon(wordPairsList);
+  const getMethod = function (key) {
+    return this.data[key];
+  };
+
+  const jsonWithGetMethod = {
+    data: lexicon,
+  };
+
+  // Attach the get method to the object
+  jsonWithGetMethod.get = getMethod;
+  console.timeEnd("A");
+
+  console.log("Loaded lexicon dict");
+
   worker.terminate();
-  return lexicon;
+  return jsonWithGetMethod;
 }
 
 export { loadLexicon };

wiktionary_pron/scripts/lexicon_loader_worker.js

@@ -1,4 +1,9 @@
 self.onmessage = function (e) {
-  dict = new Map(JSON.parse(e.data));
-  self.postMessage(dict);
+  console.time("B");
+
+  json = JSON.parse(e.data);
+  console.timeLog("B");
+  // dict = new Map(Object.entries(json));
+  // console.timeEnd("A");
+  self.postMessage(json);
 };

wiktionary_pron/scripts/main.js

@@ -150,14 +150,14 @@ async function transcribe(mode) {
         return ipa.status === "error"
           ? `<div class="error">${value} </div>`
           : Boolean(values)
-          ? `<div class="ipa" all_values="${values}">${value} </div>`
-          : `<div class="ipa">${value} </div>`;
+          ? `<div class="ipa" all_values="${values}">${value}</div>`
+          : `<div class="ipa" content="${value}"></div>`;
       });
 
       const newRow = resultDiv.insertRow(-1);
       newRow.className = "line";
       const formattedWords = words.map(
-        (word) => `<div class="input_text">${word} </div>`,
+        (word) => `<div class="input_text">${word}</div>`,
       );
       const combinedResults = formattedResults.map(
         (formattedResult, index) =>
@@ -626,3 +626,4 @@ function triggerLanguageChange() {
 }
 
 triggerLanguageChange();
+

wiktionary_pron/scripts/utils.js

@@ -116,11 +116,11 @@ function get_ipa_no_cache(text, args) {
       if (langForm === "Phonemic") {
         if (globalThis.lexicon) {
           let dictRecord = globalThis.lexicon.get(
-              cleanText.replace(/[^\p{Letter}\p{Mark}-]+/gu, ""),
+            cleanText.replace(/[^\p{Letter}\p{Mark}-]+/gu, ""),
           );
           if (!dictRecord) {
             dictRecord = globalThis.lexicon.get(
-                cleanText.replace(/[^\p{Letter}\p{Mark}-]+/gu, "").toLowerCase(),
+              cleanText.replace(/[^\p{Letter}\p{Mark}-]+/gu, "").toLowerCase(),
             );
           }
           console.log(cleanText, dictRecord);
@@ -152,11 +152,11 @@ function get_ipa_no_cache(text, args) {
       if (langForm === "Phonemic") {
         if (globalThis.lexicon) {
           let dictRecord = globalThis.lexicon.get(
-              cleanText.replace(/[^\p{Letter}\p{Mark}-]+/gu, ""),
+            cleanText.replace(/[^\p{Letter}\p{Mark}-]+/gu, ""),
           );
           if (!dictRecord) {
             dictRecord = globalThis.lexicon.get(
-                cleanText.replace(/[^\p{Letter}\p{Mark}-]+/gu, "").toLowerCase(),
+              cleanText.replace(/[^\p{Letter}\p{Mark}-]+/gu, "").toLowerCase(),
             );
           }
           console.log(cleanText, dictRecord);
@@ -183,11 +183,11 @@ function get_ipa_no_cache(text, args) {
       if (langForm === "Phonemic") {
         if (globalThis.lexicon) {
           let dictRecord = globalThis.lexicon.get(
-              cleanText.replace(/[^\p{Letter}\p{Mark}-]+/gu, ""),
+            cleanText.replace(/[^\p{Letter}\p{Mark}-]+/gu, ""),
           );
           if (!dictRecord) {
             dictRecord = globalThis.lexicon.get(
-                cleanText.replace(/[^\p{Letter}\p{Mark}-]+/gu, "").toLowerCase(),
+              cleanText.replace(/[^\p{Letter}\p{Mark}-]+/gu, "").toLowerCase(),
             );
           }
           console.log(cleanText, dictRecord);