Fix progress page so it effectively fetches progress data synchronously

i.e. use `setTimeout()` instead of `setInterval()` and only set next timeout
after previous fetch has succeeded
This commit is contained in:
Lance Edgar 2019-09-20 17:26:33 -05:00
parent fe413ba2f5
commit c16349d5c3

View file

@ -16,16 +16,19 @@
${self.extra_styles()} ${self.extra_styles()}
<script type="text/javascript"> <script type="text/javascript">
var updater = null; var stillInProgress = true;
updater = setInterval(function() {update_progress()}, 1000); // fetch first progress data, one second from now
setTimeout(function() {
update_progress();
}, 1000);
% if can_cancel: % if can_cancel:
$(function() { $(function() {
$('#cancel button').click(function() { $('#cancel button').click(function() {
if (confirm("Do you really wish to cancel this operation?")) { if (confirm("Do you really wish to cancel this operation?")) {
clearInterval(updater); stillInProgress = false;
$(this).button('disable').button('option', 'label', "Canceling, please wait..."); $(this).button('disable').button('option', 'label', "Canceling, please wait...");
$.ajax({ $.ajax({
url: '${url('progress.cancel', key=progress.key)}?sessiontype=${progress.session.type}', url: '${url('progress.cancel', key=progress.key)}?sessiontype=${progress.session.type}',
@ -84,17 +87,22 @@
function update_progress() { function update_progress() {
$.ajax({ $.ajax({
url: '${url('progress', key=progress.key)}?sessiontype=${progress.session.type}', url: '${url('progress', key=progress.key)}?sessiontype=${progress.session.type}',
success: function(data) { success: function(data) {
if (data.error) { if (data.error) {
// errors stop the show, we redirect to "cancel" page
location.href = '${cancel_url}'; location.href = '${cancel_url}';
} else if (data.complete || data.maximum) {
} else {
if (data.complete || data.maximum) {
$('#message').html(data.message); $('#message').html(data.message);
$('#total').html('('+data.maximum_display+' total)'); $('#total').html('('+data.maximum_display+' total)');
% if can_cancel: % if can_cancel:
$('#cancel button').show(); $('#cancel button').show();
% endif % endif
if (data.complete) { if (data.complete) {
clearInterval(updater); stillInProgress = false;
% if can_cancel: % if can_cancel:
$('#cancel button').hide(); $('#cancel button').hide();
% endif % endif
@ -103,7 +111,9 @@
$('#remaining').hide(); $('#remaining').hide();
$('#percentage').html('100 %'); $('#percentage').html('100 %');
location.href = data.success_url; location.href = data.success_url;
} else { } else {
// got progress data, so update display
var width = parseInt(data.value) / parseInt(data.maximum); var width = parseInt(data.value) / parseInt(data.maximum);
width = Math.round(100 * width); width = Math.round(100 * width);
if (width) { if (width) {
@ -116,6 +126,14 @@
$('#remaining').css('width', 'auto'); $('#remaining').css('width', 'auto');
} }
} }
if (stillInProgress) {
// fetch progress data again, in one second from now
setTimeout(function() {
update_progress();
}, 1000);
}
}
}, },
}); });
} }