closer to CodePen demo

hchiam · Sep 30, 2022 · 3705d0c · 3705d0c
1 parent 85ff8f3
commit 3705d0c
Show file tree

Hide file tree

Showing 2 changed files with 74 additions and 10 deletions.
diff --git a/index.html b/index.html
@@ -20,13 +20,7 @@
   </head>
   <body>
     <h2>Sentence 1:</h2>
-    <input
-      id="sentence1"
-      type="text"
-      value="How are you?"
-      class="disabled"
-      disabled
-    />
+    <input id="sentence1" type="text" value="How are you?" />
     <h2>Sentence 2:</h2>
     <input
       id="input"
@@ -41,17 +35,25 @@ <h2>Sentence 2:</h2>
       <i
         id="spinner"
         class="fa fa-spinner fa-spin"
-        style="visibility: hidden;"
+        style="visibility: hidden"
       ></i>
     </p>
-    <div id="output" style="visibility: hidden;">
+    <div id="output" style="visibility: hidden">
       <h2>Similarity:</h2>
       <p id="similarity"></p>
       <p>
         This tool could possibly be used to check whether a free-form answer
         closely matches the expected answer in meaning. For best results, you
         probably should constrain responses to short sentences (i.e. short
-        answer questions only).
+        answer questions only). For faster results, you might want to call
+        back-end code that runs a Python/PyTorch script that has been
+        pre-compiled to C. Reference for this demo:
+        <a
+          href="https://github.com/hchiam/text-similarity-test"
+          target="_blank"
+          rel="noopener noreferrer"
+          >https://github.com/hchiam/text-similarity-test</a
+        >
       </p>
     </div>
   </body>

diff --git a/index.js b/index.js
@@ -21,3 +21,65 @@ function showOutput(similarity) {
 function get2Decimals(number) {
   return Math.round(number * 100) / 100;
 }
+
+// /**
+//  * References:
+//  *
+//  * https://github.com/tensorflow/tfjs-models/tree/master/universal-sentence-encoder
+//  * https://towardsdatascience.com/how-to-build-a-textual-similarity-analysis-web-app-aa3139d4fb71
+//  * https://github.com/jinglescode/demos/tree/master/src/app/components/nlp-sentence-encoder
+//  * https://towardsdatascience.com/how-to-measure-distances-in-machine-learning-13a396aa34ce
+//  * https://en.wikipedia.org/wiki/Cosine_similarity
+//  *
+//  * */
+
+// // require("@tensorflow/tfjs-node");
+// // const use = require("@tensorflow-models/universal-sentence-encoder");
+
+// // const sentence1 = "How's it going?";
+// // const sentence2 = "How are you?";
+// // useModel(sentence1, sentence2, output);
+// function useModel(sentence1, sentence2, callback) {
+//   // uses Universal Sentence Encoder (U.S.E.):
+//   use.load().then((model) => {
+//     embedSentences(model, sentence1, sentence2, callback);
+//   });
+// }
+
+// function embedSentences(model, sentence1, sentence2, callback) {
+//   const sentences = [sentence1, sentence2];
+//   model.embed(sentences).then((embeddings) => {
+//     const embeds = embeddings.arraySync();
+//     const sentence1Embedding = embeds[0];
+//     const sentence2Embedding = embeds[1];
+//     getSimilarityPercent(sentence1Embedding, sentence2Embedding, callback);
+//   });
+// }
+
+// function getSimilarityPercent(embed1, embed2, callback) {
+//   const similarity = cosineSimilarity(embed1, embed2);
+//   // cosine similarity -> % when doing text comparison, since cannot have -ve term frequencies: https://en.wikipedia.org/wiki/Cosine_similarity
+//   if (callback) callback(similarity);
+//   return similarity;
+// }
+
+// function cosineSimilarity(a, b) {
+//   // https://towardsdatascience.com/how-to-build-a-textual-similarity-analysis-web-app-aa3139d4fb71
+
+//   const magnitudeA = Math.sqrt(dotProduct(a, a));
+//   const magnitudeB = Math.sqrt(dotProduct(b, b));
+//   if (magnitudeA && magnitudeB) {
+//     // https://towardsdatascience.com/how-to-measure-distances-in-machine-learning-13a396aa34ce
+//     return dotProduct(a, b) / (magnitudeA * magnitudeB);
+//   } else {
+//     return 0;
+//   }
+// }
+
+// function dotProduct(a, b) {
+//   let sum = 0;
+//   for (let i = 0; i < a.length; i++) {
+//     sum += a[i] * b[i];
+//   }
+//   return sum;
+// }