source
/
nenuscanner
3
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Good stream

This commit is contained in:
Thomas Forgione 2024-07-08 17:55:34 +02:00
parent de053f043f
commit 1643eb636e
1 changed files with 32 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

56
templates/calibrate.html
View File

@ -27,7 +27,7 @@
</div> </div>
</div> </div>
<progress id="progress-bar" class="progress is-link" style="display: none;" value="0" max="100"></progress> <progress id="progress-bar" class="progress is-link" style="display: none;" value="0" max="1000"></progress>
</div> </div>
</section> </section>
{% endblock content %} {% endblock content %}
@ -35,6 +35,7 @@
{% block extrajs %} {% block extrajs %}
<script> <script>
let scanIndex = 0; let scanIndex = 0;
let progress = 0;
let previewButton = document.getElementById('preview-button'); let previewButton = document.getElementById('preview-button');
let calibrateButton = document.getElementById('calibrate-button'); let calibrateButton = document.getElementById('calibrate-button');
let progressBar = document.getElementById('progress-bar'); let progressBar = document.getElementById('progress-bar');
@ -64,37 +65,44 @@
}); });
calibrateButton.addEventListener('click', async () => { calibrateButton.addEventListener('click', async () => {
progress = 0;
progressBar.value = 0;
previewImage.style.display = "none"; previewImage.style.display = "none";
buttons.forEach(x => x.setAttribute('disabled', 'disabled')); buttons.forEach(x => x.setAttribute('disabled', 'disabled'));
calibrateButton.classList.add('is-loading'); calibrateButton.classList.add('is-loading');
progressBar.style.display = "block"; progressBar.style.display = "block";
let xhr = new XMLHttpRequest(); let response = await fetch('/api/scan-for-calibration/{{ object.id }}');
grid.innerHTML = ''; let reader = response.body.pipeThrough(new TextDecoderStream()).getReader();
xhr.open('GET', '/api/scan-for-calibration/{{ object.id }}');
xhr.onreadystatechange = () => {
if (xhr.readyState === 3 || xhr.readyState === 4) {
let uuids = xhr.responseText.split('\n');
let split = uuids[uuids.length - 2].split(',');
let uuid = split[0];
let ratio = parseFloat(split[1]);
progressBar.value = 100 * ratio;
let cell = document.createElement('div');
cell.classList.add('cell');
cell.classList.add('is-col-min-4');
let img = document.createElement('img');
img.src = '/data/{{ object.id }}/calibration/' + uuid + '.jpg?v=' + scanIndex;
cell.appendChild(img);
grid.appendChild(cell);
if (xhr.readyState === 4) { while (true) {
buttons.forEach(x => x.removeAttribute('disabled')); let { value, done } = await reader.read();
calibrateButton.classList.remove('is-loading');
} if (done) {
buttons.forEach(x => x.removeAttribute('disabled'));
calibrateButton.classList.remove('is-loading');
break;
} }
};
xhr.send(); let [ uuid, ratio ] = value.trim().split(',');
progress = Math.ceil(1000 * parseFloat(ratio));
let cell = document.createElement('div');
cell.classList.add('cell');
let img = document.createElement('img');
img.src = '/data/{{ object.id }}/calibration/' + uuid + '.jpg?v=' + scanIndex;
cell.appendChild(img);
grid.appendChild(cell);
}
}); });
function refreshProgressBar() {
if (progress !== progressBar.value) {
let diff = progress - progressBar.value;
progressBar.value += Math.max(diff / 20, 1);
}
requestAnimationFrame(refreshProgressBar);
}
refreshProgressBar();
</script> </script>
{% endblock extrajs %} {% endblock extrajs %}