Code viewer for World: Hello World Project


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>`);