This wasn't a crazy rewrite or anything, I just updated it to the new YouTube Transcript and OpenAI API's, as well as super simplifying the code. On top of that, it now works single threaded, just using multiple gunicorn threads for concurrency. It's a lot simplier and cleaner, although not up to my current standards.
69 lines
2.3 KiB
JavaScript
69 lines
2.3 KiB
JavaScript
|
|
document.addEventListener("DOMContentLoaded", () => {
|
|
const responseArea = document.getElementById('response-area');
|
|
const responseSection = document.getElementById('response-section');
|
|
const submitButton = document.getElementById('submit');
|
|
const urlBox = document.getElementById('url_box');
|
|
const form = document.getElementById('url-form');
|
|
|
|
// Simple URL validation regex (covers http/https and domains)
|
|
const urlPattern = /^(https?:\/\/)[\w.-]+(\.[\w\.-]+)+[/#?]?.*$/i;
|
|
|
|
form.addEventListener('submit', async (evt) => {
|
|
evt.preventDefault();
|
|
|
|
const url = urlBox.value.trim();
|
|
if (!url) {
|
|
responseArea.textContent = 'Please enter a URL.';
|
|
return;
|
|
}
|
|
if (!urlPattern.test(url)) {
|
|
responseArea.textContent = 'Please enter a valid URL (must start with http:// or https://).';
|
|
return;
|
|
}
|
|
|
|
// Prepare UI
|
|
urlBox.value = '';
|
|
submitButton.disabled = true;
|
|
responseArea.textContent = 'Processing...\n';
|
|
|
|
try {
|
|
const response = await fetch('/process-url', {
|
|
method: 'POST',
|
|
headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
|
|
body: new URLSearchParams({ url }),
|
|
});
|
|
|
|
if (!response.ok) {
|
|
throw new Error(`Server returned ${response.status}`);
|
|
}
|
|
|
|
const reader = response.body.getReader();
|
|
const decoder = new TextDecoder('utf-8');
|
|
responseArea.textContent = ''; // clear before streaming
|
|
|
|
async function readChunk() {
|
|
const { done, value } = await reader.read();
|
|
if (done) {
|
|
submitButton.disabled = false;
|
|
return;
|
|
}
|
|
|
|
const chunk = decoder.decode(value, { stream: true });
|
|
responseArea.innerHTML += chunk;
|
|
responseSection.scrollTop = responseSection.scrollHeight;
|
|
|
|
await readChunk();
|
|
}
|
|
|
|
await readChunk();
|
|
|
|
} catch (err) {
|
|
console.error(err);
|
|
responseArea.textContent = `Error: ${err.message}`;
|
|
submitButton.disabled = false;
|
|
}
|
|
});
|
|
});
|
|
|