Loading bar: Introduced two event listeners on window 'pillar:workStart' and 'pillar:workStop' that (de)activates the loading bar.

Reason:
* To decouple code
* Have the loading bar active until whole page stopped working
* Have local loading info

Usage:
$.('.myClass')
   .on('pillar:workStart', function(){
    ... do stuff locally while loading ...
    })
   .on('pillar:workStop', function(){
   ... stop do stuff locally while loading ...
   })

$.('.myClass .mySubClass').trigger('pillar:workStart')
... do stuff ...
$.('.myClass .mySubClass').trigger('pillar:workStop')
This commit is contained in:
2018-10-23 13:57:02 +02:00
parent a674de4db5
commit 0b2a3c99ce
2 changed files with 14 additions and 10 deletions

View File

@@ -25,7 +25,7 @@
if (!node.picture) { if (!node.picture) {
warnNoPicture(); warnNoPicture();
} else { } else {
loadingBarShow(); $(window).trigger('pillar:workStart');
// TODO: show 'loading' thingy // TODO: show 'loading' thingy
$.get('/api/files/' + node.picture) $.get('/api/files/' + node.picture)
@@ -34,7 +34,6 @@
console.log(msg); console.log(msg);
}) })
.done(function(resp) { .done(function(resp) {
loadingBarHide();
// Render the picture if it has the proper size. // Render the picture if it has the proper size.
var show_variation = null; var show_variation = null;
@@ -57,6 +56,9 @@
.attr('width', variation.width) .attr('width', variation.width)
.attr('height', variation.height); .attr('height', variation.height);
thumbnail_container.append(img); thumbnail_container.append(img);
})
.always(function(){
$(window).trigger('pillar:workStop');
}); });
} }

View File

@@ -378,32 +378,34 @@ script.
function loadNodeContent(url, nodeId) { function loadNodeContent(url, nodeId) {
loadingBarShow(); var $projectContext = $('#project_context')
$projectContext.trigger('pillar:workStart')
$.get(url, function(dataHtml) { $.get(url, function(dataHtml) {
// Update the DOM injecting the generate HTML into the page // Update the DOM injecting the generate HTML into the page
$('#project_context').html(dataHtml); $projectContext.html(dataHtml);
}) })
.done(function(){ .done(function(){
updateUi(nodeId, 'view'); updateUi(nodeId, 'view');
}) })
.fail(function(dataResponse) { .fail(function(dataResponse) {
$('#project_context').html($('<iframe id="server_error"/>')); $projectContext.html($('<iframe id="server_error"/>'));
$('#server_error').attr('src', url); $('#server_error').attr('src', url);
}) })
.always(function(){ .always(function(){
loadingBarHide(); $projectContext.trigger('pillar:workStop')
$('.button-edit-icon').addClass('pi-edit').removeClass('pi-spin spin'); $('.button-edit-icon').addClass('pi-edit').removeClass('pi-spin spin');
}); });
} }
function loadProjectContent(url) { function loadProjectContent(url) {
loadingBarShow(); var $projectContext = $('#project_context')
$projectContext.trigger('pillar:workStart')
$.get(url, function(dataHtml) { $.get(url, function(dataHtml) {
// Update the DOM injecting the generated HTML into the page // Update the DOM injecting the generated HTML into the page
$('#project_context').html(dataHtml); $projectContext.html(dataHtml);
}) })
.done(function() { .done(function() {
updateUi('', 'view'); updateUi('', 'view');
@@ -411,11 +413,11 @@ script.
addMenuDisable(['texture']); addMenuDisable(['texture']);
}) })
.fail(function(dataResponse) { .fail(function(dataResponse) {
$('#project_context').html($('<iframe id="server_error"/>')); $projectContext.html($('<iframe id="server_error"/>'));
$('#server_error').attr('src', url); $('#server_error').attr('src', url);
}) })
.always(function(){ .always(function(){
loadingBarHide(); $projectContext.trigger('pillar:workStop')
$('.button-edit-icon').addClass('pi-edit').removeClass('pi-spin spin'); $('.button-edit-icon').addClass('pi-edit').removeClass('pi-spin spin');
}); });
} }