tyler.durden
/
icingaweb2
mirror of https://github.com/Icinga/icingaweb2.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

js: Don't initialize modules using a `beforerender` event 

`beforerender` is already too late. Module initialization
done using an event handler is wrong anyway. It's some
kind of bootstrapping after all and should be performed
by parts of the code which is directly responsible for
DOM content handling of modules. (i.e. loader.js)

This change though introduces a side-effect which was
not the case previously: Nested `.container` elements
trigger `rendered` events now. I've introduced this to
ensure we're also lazy loading modules and let them
handle their `rendered` events right after a redirect
which rerendered the layout. (Only `#layout` got a
`rendered` event then prior to this change)
This commit is contained in:
Johannes Meyer 2019-11-21 09:55:20 +01:00
parent 7f78c1a8a8
commit 48098a2830
2 changed files with 24 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
public/js/icinga/events.js
View File

@ -32,8 +32,6 @@
* Global default event handlers
*/
applyGlobalDefaults: function () {
$(document).on('beforerender', { self: this }, this.initializeModules);
$(document).on('visibilitychange', { self: this }, this.onVisibilityChange);
$.each(this.icinga.behaviors, function (name, behavior) {
@ -85,32 +83,16 @@
},
/**
* Lazy load module javascript (Applies only to module.js code)
*
* @param {Event} event
* Initialize module javascript (Applies only to module.js code)
*/
initializeModules: function (event) {
var _this, $target;
if (typeof event === 'undefined') {
_this = this;
$target = $('#col1');
} else {
_this = event.data.self;
$target = $(event.target);
}
var moduleName = $target.data('icingaModule');
if (moduleName) {
if (_this.icinga.hasModule(moduleName) && ! _this.icinga.isLoadedModule(moduleName)) {
_this.icinga.loadModule(moduleName);
}
}
$target.find('.icinga-module').each(function () {
moduleName = $(this).data('icingaModule');
if (_this.icinga.hasModule(moduleName) && !_this.icinga.isLoadedModule(moduleName)) {
_this.icinga.loadModule(moduleName);
initializeModules: function () {
var _this = this;
$('.container').each(function () {
var moduleName = $(this).data('icingaModule');
if (moduleName) {
if (_this.icinga.hasModule(moduleName) && ! _this.icinga.isLoadedModule(moduleName)) {
_this.icinga.loadModule(moduleName);
}
}
});
},

16
public/js/icinga/loader.js
View File

@ -654,6 +654,11 @@
return true;
});
if (moduleName) {
// Lazy load module javascript (Applies only to module.js code)
if (_this.icinga.hasModule(moduleName) && ! _this.icinga.isLoadedModule(moduleName)) {
_this.icinga.loadModule(moduleName);
}
req.$target.data('icingaModule', moduleName);
classes.push('icinga-module');
classes.push('module-' + moduleName);
@ -776,6 +781,7 @@
* Regardless of whether a request succeeded of failed, clean up
*/
onComplete: function (dataOrReq, textStatus, reqOrError) {
var _this = this;
var req;
if (typeof dataOrReq === 'object') {
@ -832,7 +838,6 @@
var extraUpdates = req.getResponseHeader('X-Icinga-Extra-Updates');
if (!! extraUpdates && req.getResponseHeader('X-Icinga-Redirect-Http') !== 'yes') {
var _this = this;
$.each(extraUpdates.split(','), function (idx, el) {
var parts = el.trim().split(';');
if (parts.length !== 2) {
@ -864,6 +869,15 @@
}
}
req.$target.find('.container').each(function () {
// Lazy load module javascript (Applies only to module.js code)
var moduleName = $(this).data('icingaModule');
if (_this.icinga.hasModule(moduleName) && ! _this.icinga.isLoadedModule(moduleName)) {
_this.icinga.loadModule(moduleName);
}
$(this).trigger('rendered');
});
req.$target.trigger('rendered');
this.icinga.ui.refreshDebug();