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