function onQuery(ev) {
ev.preventDefault();
let prompt = document.getElementById("apiQuery");
const q = prompt.value;
prompt.value = ""; // clear field
document.getElementById("response").innerHTML = "";
generate(q.value);
}
const ollamaHost = "https://ai.cathal.xyz";
const ollamaAPIKey = "FsiDrvg68bOMUVMPuj77jHAWwryknSf";
async function generate(prompt) {
const response = await fetch(`${ollamaHost}/api/generate`, {
method: "POST",
headers: {
"Accept": "application/json",
"X-API-Key": ollamaAPIKey
},
body: JSON.stringify({
"model": "author",
"prompt": prompt,
})
});
getResponse(response, (token) => {
document.getElementById("response").innerHTML += token.response;
});
}
// @ref https://github.com/ollama-ui/ollama-ui
// Function to stream the response from the server
async function getResponse(response, callback) {
const reader = response.body.getReader();
let partialLine = '';
while (true) {
const { done, value } = await reader.read();
if (done) {
break;
}
// Decode the received value and split by lines
const textChunk = new TextDecoder().decode(value);
const lines = (partialLine + textChunk).split('\n');
partialLine = lines.pop(); // The last line might be incomplete
for (const line of lines) {
if (line.trim() === '') continue;
const parsedResponse = JSON.parse(line);
callback(parsedResponse); // Process each response word
}
}
// Handle any remaining line
if (partialLine.trim() !== '') {
const parsedResponse = JSON.parse(partialLine);
callback(parsedResponse);
}
}
document.write (`<body>
<form onsubmit='onQuery(event);'>
<label for="apiQuery">Prompt:</label>
<input type="text" name="apiQuery" id="apiQuery"/>
</form>
<div>
<p id="response">
</p>
</div>
</body>`);