|
<!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> |
|
|