41 lines
1.1 KiB
HTML
41 lines
1.1 KiB
HTML
<img id="img" src="" />
|
|
|
|
<p id="statusline">submit an image to get started!</p>
|
|
<form id="form" action="http://localhost:5000/submit" method="post">
|
|
<input type="file" id="job" name="image" accept="image/png,image/jpeg" /><br>
|
|
<button type="submit" id="submit">submit</button>
|
|
</form>
|
|
|
|
<script>
|
|
const form = document.getElementById("form");
|
|
const img = document.getElementById("img");
|
|
const statusline = document.getElementById("statusline");
|
|
|
|
async function handleSubmit(ev) {
|
|
ev.preventDefault();
|
|
const form = ev.currentTarget;
|
|
const data = new FormData(form);
|
|
const url = form.action;
|
|
const fetchOptions = {
|
|
method: form.method,
|
|
body: data
|
|
}
|
|
|
|
const resp = await fetch(url, fetchOptions);
|
|
const id = (await resp.json()).id;
|
|
console.log(id);
|
|
|
|
while (true) {
|
|
const resp = await fetch('http://localhost:5000/state/' + id);
|
|
const state = (await resp.json()).state;
|
|
statusline.innerHTML = state;
|
|
if (state == "READY") {
|
|
img.src = 'http://localhost:5000/result/' + id
|
|
return;
|
|
}
|
|
}
|
|
}
|
|
|
|
form.addEventListener('submit', handleSubmit)
|
|
</script>
|