rattail/tailbone
1
0
Fork 0
Code Issues Pull requests Actions Packages Projects Releases Wiki Activity

Fix progress page so it effectively fetches progress data synchronously

Browse source 
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
1 changed files with 44 additions and 26 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

70
tailbone/templates/progress.mako
View file

@ -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,36 +87,51 @@
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) {
$('#message').html(data.message);
$('#total').html('('+data.maximum_display+' total)');
% if can_cancel:
$('#cancel button').show();
% endif
if (data.complete) {
clearInterval(updater);
} else {
if (data.complete || data.maximum) {
$('#message').html(data.message);
$('#total').html('('+data.maximum_display+' total)');
% if can_cancel:
$('#cancel button').hide();
$('#cancel button').show();
% endif
$('#total').html('done!');
$('#complete').css('width', '100%');
$('#remaining').hide();
$('#percentage').html('100 %');
location.href = data.success_url;
} else {
var width = parseInt(data.value) / parseInt(data.maximum);
width = Math.round(100 * width);
if (width) {
$('#complete').css('width', width+'%');
$('#percentage').html(width+' %');
if (data.complete) {
stillInProgress = false;
% if can_cancel:
$('#cancel button').hide();
% endif
$('#total').html('done!');
$('#complete').css('width', '100%');
$('#remaining').hide();
$('#percentage').html('100 %');
location.href = data.success_url;
} else {
$('#complete').css('width', '0.01%');
$('#percentage').html('0 %');
// got progress data, so update display
var width = parseInt(data.value) / parseInt(data.maximum);
width = Math.round(100 * width);
if (width) {
$('#complete').css('width', width+'%');
$('#percentage').html(width+' %');
} else {
$('#complete').css('width', '0.01%');
$('#percentage').html('0 %');
}
$('#remaining').css('width', 'auto');
}
$('#remaining').css('width', 'auto');
}
if (stillInProgress) {
// fetch progress data again, in one second from now
setTimeout(function() {
update_progress();
}, 1000);
}
}
},