Add javascript autoloading
the js/modules/%modulename%/%file% is now mapped to the module path (if existing). To prevent name clashing, the modules folder has been renamed to components.
This commit is contained in:
parent
c1e460de17
commit
fc83dfb4ef
|
@ -0,0 +1,118 @@
|
||||||
|
/*global Icinga:false, document: false, define:false require:false base_url:false console:false */
|
||||||
|
|
||||||
|
/**
|
||||||
|
* ActionTable behaviour as described in
|
||||||
|
* https://wiki.icinga.org/display/cranberry/Frontend+Components#FrontendComponents-ActionTable
|
||||||
|
*
|
||||||
|
* @TODO: Row selection
|
||||||
|
*/
|
||||||
|
define(['jquery','logging','icinga/util/async'],function($,log,async) {
|
||||||
|
"use strict";
|
||||||
|
|
||||||
|
var ActionTableBehaviour = function() {
|
||||||
|
var onTableHeaderClick;
|
||||||
|
|
||||||
|
var TABLE_BASE_MATCHER = '.icinga-container table.action';
|
||||||
|
var linksInActionTable = TABLE_BASE_MATCHER+" tbody tr > a";
|
||||||
|
var actionTableRow = TABLE_BASE_MATCHER+" tbody tr";
|
||||||
|
var headerRow = TABLE_BASE_MATCHER+" > th a";
|
||||||
|
var searchField = ".icinga-container .actiontable.controls input[type=search]";
|
||||||
|
|
||||||
|
|
||||||
|
onTableHeaderClick = function (ev) {
|
||||||
|
var target = ev.currentTarget,
|
||||||
|
href = $(target).attr('href'),
|
||||||
|
destination;
|
||||||
|
if ($(target).parents('.layout-main-detail').length) {
|
||||||
|
if ($(target).parents("#icinga-main").length) {
|
||||||
|
destination = 'icinga-main';
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
destination = 'icinga-detail';
|
||||||
|
}
|
||||||
|
|
||||||
|
} else {
|
||||||
|
destination = 'icinga-main';
|
||||||
|
}
|
||||||
|
async.loadToTarget(destination, href);
|
||||||
|
ev.preventDefault();
|
||||||
|
ev.stopImmediatePropagation();
|
||||||
|
return false;
|
||||||
|
};
|
||||||
|
|
||||||
|
var onLinkTagClick = function(ev) {
|
||||||
|
|
||||||
|
var target = ev.currentTarget,
|
||||||
|
href = $(target).attr('href'),
|
||||||
|
destination;
|
||||||
|
if ($(target).parents('.layout-main-detail').length) {
|
||||||
|
destination = 'icinga-detail';
|
||||||
|
} else {
|
||||||
|
destination = 'icinga-main';
|
||||||
|
}
|
||||||
|
async.loadToTarget(destination,href);
|
||||||
|
ev.preventDefault();
|
||||||
|
ev.stopImmediatePropagation();
|
||||||
|
return false;
|
||||||
|
|
||||||
|
};
|
||||||
|
|
||||||
|
var onTableRowClick = function(ev) {
|
||||||
|
ev.stopImmediatePropagation();
|
||||||
|
|
||||||
|
var target = $(ev.currentTarget),
|
||||||
|
href = target.attr('href'),
|
||||||
|
destination;
|
||||||
|
$('tr.active',target.parent('tbody').first()).removeClass("active");
|
||||||
|
target.addClass('active');
|
||||||
|
|
||||||
|
// When the tr has a href, act like it is a link
|
||||||
|
if(href) {
|
||||||
|
ev.currentTarget = target.first();
|
||||||
|
return onLinkTagClick(ev);
|
||||||
|
}
|
||||||
|
// Try to find a designated row action
|
||||||
|
var links = $("a.row-action",target);
|
||||||
|
if(links.length) {
|
||||||
|
ev.currentTarget = links.first();
|
||||||
|
return onLinkTagClick(ev);
|
||||||
|
}
|
||||||
|
|
||||||
|
// otherwise use the first anchor tag
|
||||||
|
links = $("a",target);
|
||||||
|
if(links.length) {
|
||||||
|
ev.currentTarget = links.first();
|
||||||
|
return onLinkTagClick(ev);
|
||||||
|
}
|
||||||
|
|
||||||
|
log.debug("No target for this table row found");
|
||||||
|
return false;
|
||||||
|
};
|
||||||
|
|
||||||
|
var onSearchInput = function(ev) {
|
||||||
|
ev.stopImmediatePropagation();
|
||||||
|
var txt = $(this).val();
|
||||||
|
};
|
||||||
|
|
||||||
|
this.eventHandler = {};
|
||||||
|
this.eventHandler[linksInActionTable] = {
|
||||||
|
'click' : onLinkTagClick
|
||||||
|
};
|
||||||
|
this.eventHandler[actionTableRow] = {
|
||||||
|
'click' : onTableRowClick
|
||||||
|
};
|
||||||
|
this.eventHandler[headerRow] = {
|
||||||
|
'click' : onTableHeaderClick
|
||||||
|
};
|
||||||
|
this.eventHandler[searchField] = {
|
||||||
|
'keyup' : onSearchInput
|
||||||
|
};
|
||||||
|
|
||||||
|
this.enable = function() {
|
||||||
|
|
||||||
|
};
|
||||||
|
};
|
||||||
|
|
||||||
|
return new ActionTableBehaviour();
|
||||||
|
|
||||||
|
});
|
|
@ -0,0 +1,99 @@
|
||||||
|
/*global Icinga:false, document: false, define:false require:false base_url:false console:false */
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Main-Detail layout behaviour as described in
|
||||||
|
* https://wiki.icinga.org/display/cranberry/Frontend+Components#FrontendComponents-Behaviour
|
||||||
|
*
|
||||||
|
*/
|
||||||
|
define(['jquery','logging','icinga/util/async'],function($,log,async) {
|
||||||
|
"use strict";
|
||||||
|
|
||||||
|
var MainDetailBehaviour = function() {
|
||||||
|
|
||||||
|
var onOuterLinkClick = function(ev) {
|
||||||
|
var a = $(ev.currentTarget),
|
||||||
|
target = a.attr("target"),
|
||||||
|
href = a.attr("href");
|
||||||
|
ev.stopImmediatePropagation();
|
||||||
|
collapseDetailView();
|
||||||
|
async.loadToTarget("icinga-main",href);
|
||||||
|
return false;
|
||||||
|
};
|
||||||
|
|
||||||
|
var onLinkTagClick = function(ev) {
|
||||||
|
|
||||||
|
var a = $(ev.currentTarget),
|
||||||
|
target = a.attr("target"),
|
||||||
|
href = a.attr("href");
|
||||||
|
|
||||||
|
// check for protocol://
|
||||||
|
if(/^[A-Z]{2,10}\:\/\//i.test(href)) {
|
||||||
|
window.open(href);
|
||||||
|
ev.stopImmediatePropagation();
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
// check for link in table header
|
||||||
|
if(a.parents('th').length > 0) {
|
||||||
|
ev.stopImmediatePropagation();
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
if(typeof target === "undefined") {
|
||||||
|
if(a.parents("#icinga-detail").length) {
|
||||||
|
log.debug("Parent is detail, loading into detail");
|
||||||
|
async.loadToTarget("icinga-detail",href);
|
||||||
|
} else {
|
||||||
|
log.debug("Parent is not detail, loading into main");
|
||||||
|
async.loadToTarget("icinga-main",href);
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
switch(target) {
|
||||||
|
case "body":
|
||||||
|
async.loadToTarget("body", href);
|
||||||
|
break;
|
||||||
|
case "main":
|
||||||
|
async.loadToTarget("icinga-main",href);
|
||||||
|
collapseDetailView();
|
||||||
|
break;
|
||||||
|
case "detail":
|
||||||
|
log.debug("Target: detail");
|
||||||
|
async.loadToTarget("icinga-detail",href);
|
||||||
|
break;
|
||||||
|
case "popup":
|
||||||
|
log.debug("No target");
|
||||||
|
async.loadToTarget(null,href);
|
||||||
|
break;
|
||||||
|
default:
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
ev.stopImmediatePropagation();
|
||||||
|
return false;
|
||||||
|
};
|
||||||
|
|
||||||
|
var expandDetailView = function() {
|
||||||
|
$("#icinga-detail").parents(".collapsed").removeClass('collapsed');
|
||||||
|
};
|
||||||
|
|
||||||
|
var collapseDetailView = function(elementInDetailView) {
|
||||||
|
$("#icinga-detail").parents(".layout-main-detail").addClass('collapsed');
|
||||||
|
};
|
||||||
|
|
||||||
|
this.expandDetailView = expandDetailView;
|
||||||
|
this.collapseDetailView = collapseDetailView;
|
||||||
|
|
||||||
|
this.eventHandler = {
|
||||||
|
'.layout-main-detail * a' : {
|
||||||
|
'click' : onLinkTagClick
|
||||||
|
},
|
||||||
|
'a' : {
|
||||||
|
'click' : onOuterLinkClick
|
||||||
|
},
|
||||||
|
'.layout-main-detail .icinga-container#icinga-detail' : {
|
||||||
|
'focus' : expandDetailView
|
||||||
|
}
|
||||||
|
};
|
||||||
|
};
|
||||||
|
return new MainDetailBehaviour();
|
||||||
|
});
|
|
@ -19,7 +19,6 @@ define([
|
||||||
var failedModules = [];
|
var failedModules = [];
|
||||||
|
|
||||||
var initialize = function () {
|
var initialize = function () {
|
||||||
registerLazyModuleLoading();
|
|
||||||
enableInternalModules();
|
enableInternalModules();
|
||||||
|
|
||||||
containerMgr.registerAsyncMgr(async);
|
containerMgr.registerAsyncMgr(async);
|
||||||
|
@ -29,9 +28,7 @@ define([
|
||||||
enableModules();
|
enableModules();
|
||||||
};
|
};
|
||||||
|
|
||||||
var registerLazyModuleLoading = function() {
|
|
||||||
async.registerHeaderListener("X-Icinga-Enable-Module", loadModuleScript, this);
|
|
||||||
};
|
|
||||||
|
|
||||||
var enableInternalModules = function() {
|
var enableInternalModules = function() {
|
||||||
$.each(internalModules,function(idx,module) {
|
$.each(internalModules,function(idx,module) {
|
||||||
|
@ -40,7 +37,6 @@ define([
|
||||||
};
|
};
|
||||||
|
|
||||||
var loadModuleScript = function(name) {
|
var loadModuleScript = function(name) {
|
||||||
console.log("Loading ", name);
|
|
||||||
moduleMgr.enableModule("modules/"+name+"/"+name, function(error) {
|
moduleMgr.enableModule("modules/"+name+"/"+name, function(error) {
|
||||||
failedModules.push({
|
failedModules.push({
|
||||||
name: name,
|
name: name,
|
||||||
|
@ -72,11 +68,6 @@ define([
|
||||||
|
|
||||||
},
|
},
|
||||||
|
|
||||||
loadUrl: function(url, target, params) {
|
|
||||||
target = target || "icinga-main";
|
|
||||||
async.loadToTarget(target, url, params);
|
|
||||||
},
|
|
||||||
|
|
||||||
getFailedModules: function() {
|
getFailedModules: function() {
|
||||||
return failedModules;
|
return failedModules;
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue