kth-qa / templates /index.html
erseux's picture
new huggingface structure
cc0bd0f
raw
history blame
2.14 kB
<html>
<head>
<title>KTH Q&A</title>
<link href="{{ url_for('static', path='/styles.css') }}" rel="stylesheet">
</head>
<body>
<div class="container">
<h1>KTH Q&A</h1>
<form name="form" method="post">
<input type="text" name="question" />
<button type="submit" id="ask">Ask</button>
</form>
<p id="answer"></p>
<p id="readmore"></p>
<ul id="urls"></ul>
</div>
<script>
const form = document.querySelector('form');
form.addEventListener('submit', async (event) => {
document.getElementById('ask').disabled = true;
event.preventDefault();
const formData = new FormData(form);
const question = formData.get('question');
const response = await fetch('/api/ask', {
method: 'POST',
body: JSON.stringify({ question }),
headers: {
'content-type': 'application/json'
}
});
const data = await response.json();
console.log(data);
document.querySelector('#answer').textContent = data.answer;
if (data.urls && data.urls.length > 0) {
document.getElementById('readmore').textContent = 'You might find related info at: ';
const urls = document.getElementById('urls');
urls.innerHTML = '';
data.urls.forEach(url => {
const li = document.createElement('li');
const a = document.createElement('a');
a.href = url;
a.textContent = url;
li.appendChild(a);
urls.appendChild(li);
});
} else {
document.getElementById('readmore').textContent = '';
document.getElementById('urls').innerHTML = '';
}
document.getElementById('ask').disabled = false;
});
</script>
{% if DEBUG %}
{{ hotreload.script(url_for('hot-reload')) | safe }}
{% endif %}
</body>
</html>