| <!DOCTYPE html> |
| <html> |
| <head> |
| <title>Text Embedding and Similarity Search</title> |
| </head> |
| <body> |
| <h1>Text Embedding and Similarity Search</h1> |
|
|
| <h2>Embed a string</h2> |
| <form id="embed-form"> |
| <label for="embed-input">String to embed:</label><br> |
| <input type="text" id="embed-input" name="embed-input"><br> |
| <input type="submit" value="Embed"> |
| </form> |
|
|
| <h2>Search for a string</h2> |
| <form id="search-form"> |
| <label for="search-input">String to search:</label><br> |
| <input type="text" id="search-input" name="search-input"><br> |
| <label for="n-input">Number of results to return:</label><br> |
| <input type="number" id="n-input" name="n-input" min="1" value="5"><br> |
| <input type="submit" value="Search"> |
| </form> |
|
|
| <div id="results"></div> |
|
|
| <script> |
| document.getElementById("embed-form").addEventListener("submit", function(event) { |
| event.preventDefault(); |
| const text = document.getElementById("embed-input").value; |
| fetch("/embed", { |
| method: "POST", |
| headers: { |
| "Content-Type": "application/json" |
| }, |
| body: JSON.stringify({text: text}) |
| }) |
| .then(response => response.json()) |
| .then(data => { |
| document.getElementById("results").innerHTML = data.message; |
| }); |
| }); |
| |
| document.getElementById("search-form").addEventListener("submit", function(event) { |
| event.preventDefault(); |
| const text = document.getElementById("search-input").value; |
| const n = document.getElementById("n-input").value; |
| fetch("/search", { |
| method: "POST", |
| headers: { |
| "Content-Type": "application/json" |
| }, |
| body: JSON.stringify({text: text, n: n}) |
| }) |
| .then(response => response.json()) |
| .then(data => { |
| let resultsHtml = `<h3>Top ${n} results:</h3>`; |
| for (let i = 0; i < data.distances.length; i++) { |
| resultsHtml += `<p>${i+1}. Index: ${data.indices[i]}, Distance: ${data.distances[i]}</p>`; |
| } |
| document.getElementById("results").innerHTML = resultsHtml; |
| }); |
| }); |
| </script> |
| </body> |
| </html> |
|
|
