aboutsummaryrefslogtreecommitdiffstats
path: root/web/js
diff options
context:
space:
mode:
Diffstat (limited to 'web/js')
-rw-r--r--web/js/nms-info-box.js266
-rw-r--r--web/js/nms.js17
2 files changed, 262 insertions, 21 deletions
diff --git a/web/js/nms-info-box.js b/web/js/nms-info-box.js
index 9a5edae..dccfd7d 100644
--- a/web/js/nms-info-box.js
+++ b/web/js/nms-info-box.js
@@ -57,6 +57,20 @@ var nmsInfoBox = nmsInfoBox || {
}
},
{
+ 'id': 'networkInfo',
+ 'title': 'Network info',
+ 'views': {
+ 'initial': {
+ 'name': 'Summary',
+ 'panels': ['networkSummary']
+ },
+ 'edit': {
+ 'name': 'Edit settings',
+ 'panels': ['networkEdit']
+ }
+ }
+ },
+ {
'id': 'addSwitch',
'title': 'Add new switch(es)',
'views': {
@@ -67,6 +81,16 @@ var nmsInfoBox = nmsInfoBox || {
}
},
{
+ 'id': 'addNetwork',
+ 'title': 'Add new network(s)',
+ 'views': {
+ 'initial': {
+ 'name': 'Add network',
+ 'panels': ['networkAdd']
+ }
+ }
+ },
+ {
'id': 'searchHelp',
'title': 'Search help',
'views': {
@@ -76,16 +100,16 @@ var nmsInfoBox = nmsInfoBox || {
}
}
},
- {
- 'id': 'searchResults',
- 'title': 'Search Results',
- 'views': {
- 'initial': {
- 'name': 'Search Results',
- 'panels': ['searchResults']
- }
- }
- },
+ {
+ 'id': 'searchResults',
+ 'title': 'Search Results',
+ 'views': {
+ 'initial': {
+ 'name': 'Search Results',
+ 'panels': ['searchResults']
+ }
+ }
+ },
{
'id': 'inventoryListing',
'title': 'Inventory listing',
@@ -103,8 +127,18 @@ var nmsInfoBox = nmsInfoBox || {
'panels': ['inventoryListing:jnxBoxSerialNo']
}
}
- }
- ],
+ },
+ {
+ 'id': 'listNetwork',
+ 'title': 'Networks',
+ 'views': {
+ 'initial': {
+ 'name': 'List all networks',
+ 'panels': ['listNetworks']
+ }
+ }
+ },
+],
_panelTypes: {} //Populate by using the nmsInfoBox.addPanelType method
};
@@ -952,7 +986,7 @@ var switchEditPanel = function () {
var tmpsw = '\'' + this.sw + '\'';
var tmpv = '\'' + v + '\'';
var tmphandler = '"nmsInfoBox._editChange(' + tmpsw + ',' + tmpv + ');"';
- var html = '<input type="text" class="form-control" value="' + template[v] + '" id="edit-' + this.sw + '-' + v + '" onchange=' + tmphandler + ' oninput=' + tmphandler + ' ' + (v == 'sysname' ? "readonly" : "") + '>';
+ var html = '<input type="text" class="form-control" value="' + template[v] + '" id="edit-' + this.sw + '-' + v + '" onchange=' + tmphandler + ' oninput=' + tmphandler + ' ' + (v == 'sysname' || v == 'subnet4' || v == 'subnet6' || v == 'mgmt_v4_gw' || v == 'mgmt_v6_gw' ? "readonly" : "") + '>';
if (v == "placement") {
v = "placement <a onclick='var _x = document.getElementById(\"edit-" + this.sw + "-placement\"); _x.value = \"\\\"reset\\\"\"; _x.oninput();' class='pull-right'>Reset</a>";
}
@@ -1132,6 +1166,212 @@ nmsInfoBox.setLegendPick = function(tag,id) {
nms.legendPick = {handler: tag, idx: id};
}
nmsInfoBox.addPanelType("switchSummary",switchSummaryPanel);
+
+/*
+* Panel type: Add network
+*
+* Lets you add a new network using the network-add api
+*
+*/
+var networkAddPanel = function() {
+ nmsInfoPanel.call(this,"networkAdd");
+ this.refresh = function(reason) {
+ var domObj = document.createElement("div");
+ domObj.innerHTML = '<input type="text" class="form-control" id="create-network-name" placeholder="Space-seaprated list of networks"><button class="btn btn-default" onclick="nmsInfoBox._windowHandler.doInPanel(\'' + this.id +'\',\'save\');">Add network</button>'
+ this._render(domObj);
+ };
+ this.save = function () {
+ var name = document.getElementById('create-network-name').value.split(" ");
+ var myData = [];
+ for (var v in name) {
+ myData.push({"name":name[v]});
+ }
+ var myData = JSON.stringify(myData);
+ $.ajax({
+ type: "POST",
+ url: "/api/write/network-add",
+ dataType: "text",
+ data:myData,
+ success: function (data, textStatus, jqXHR) {
+ var result = JSON.parse(data);
+ if(result.networks_added.length > 0) { // FIXME unresolved variable switches_addded
+ nmsInfoBox.hide();
+ }
+ nmsData.invalidate("switches");
+ nmsData.invalidate("smanagement");
+ nmsData.invalidate("networks");
+ }
+ });
+ };
+};
+nmsInfoBox.addPanelType("networkAdd",networkAddPanel);
+
+/*
+* List networks
+*
+* Shows all networks
+*
+*/
+var networkListPanel = function() {
+ nmsInfoPanel.call(this,"listNetworks");
+ this.refresh = function(reason) {
+ var collator = new Intl.Collator(undefined, {numeric: true, sensitivity: 'base'});
+ var networks = nmsData.networks.networks;
+ var table = document.createElement('table');
+ table.className = "table table-condensed";
+ table.id = "searchResults-table"
+ for (var net in networks) {
+ console.log(networks[net]);
+ var row = table.insertRow(net);
+ var cell1 = row.insertCell(0);
+ var cell2 = row.insertCell(1);
+ var cell3 = row.insertCell(2);
+ cell1.innerHTML = "<a href='#' onclick='nmsInfoBox.showWindow(\"networkInfo\",\""+net+"\");'>"+net+ '</a>';
+ cell2.innerHTML = networks[net].vlan;
+ cell3.innerHTML = networks[net].routing_point;
+ }
+ this._render(table);
+
+ };
+};
+nmsInfoBox.addPanelType("listNetworks",networkListPanel);
+
+/*
+* Panel type: Network summary
+*
+* Display a summary
+*
+*/
+var networkSummaryPanel = function() {
+ nmsInfoPanel.call(this,"networkSummary");
+ this.refresh = function(reason) {
+ var network = this.sw;
+
+ };
+}
+nmsInfoBox.addPanelType("networkSummary",networkSummaryPanel);
+
+/*
+* Panel type: Edit networki
+*
+* Lets you edit basic networks data through the network-update api
+*
+*/
+var networkEditPanel = function() {
+ nmsInfoPanel.call(this,"networkEdit");
+ this.refresh = function(reason) {
+ var net = [];
+ try {
+ net = nmsData.networks.networks[this.sw];
+ } catch(e) {}
+
+
+ var domObj = document.createElement("div");
+ var template = {};
+
+ nmsInfoBox._editValues = {};
+ var place;
+ var tags;
+ for (var v in net) {
+ /*
+ * Placement and tags needs to be sent and edited
+ * as plain JSON...
+ */
+ if (v == "placement") {
+ place = JSON.stringify(net[v]);
+ template[v] = place;
+ continue;
+ }
+ if (v == "tags") {
+ tags = JSON.stringify(net[v]);
+ template[v] = tags;
+ continue;
+ }
+ template[v] = nmsInfoBox._nullBlank(net[v]);
+ }
+ var content = [];
+ for (v in template) {
+ var tmpsw = '\'' + this.sw + '\'';
+ var tmpv = '\'' + v + '\'';
+ var tmphandler = '"nmsInfoBox._editChange(' + tmpsw + ',' + tmpv + ');"';
+ var html = '<input type="text" class="form-control" value="' + template[v] + '" id="edit-' + this.sw + '-' + v + '" onchange=' + tmphandler + ' oninput=' + tmphandler + ' ' + (v == 'name' ? "readonly" : "") + '>';
+ if (v == "placement") {
+ v = "placement <a onclick='var _x = document.getElementById(\"edit-" + this.sw + "-placement\"); _x.value = \"\\\"reset\\\"\"; _x.oninput();' class='pull-right'>Reset</a>";
+ }
+ content.push([v, html]);
+ }
+
+ content.sort();
+
+ var table = nmsInfoBox._makeTable(content);
+ domObj.appendChild(table);
+
+ var outputCont = document.createElement("div");
+ outputCont.id = "edit-output-cont";
+ outputCont.classList.add("collapse");
+ outputCont.innerHTML = "<h5>Request preview</h5>";
+ var output = document.createElement("output");
+ output.id = "edit-output";
+ outputCont.appendChild(output);
+ domObj.appendChild(outputCont);
+
+ var nav = document.createElement("nav");
+ nav.classList.add("nav","nav-pills");
+
+ var submit = document.createElement("button");
+ submit.innerHTML = "Save changes";
+ submit.classList.add("btn", "btn-primary");
+ submit.id = "edit-submit-" + this.sw;
+ submit.setAttribute("onclick","nmsInfoBox._windowHandler.doInPanel('" + this.id + "','save');");
+ nav.appendChild(submit);
+
+ var toggleDetails = document.createElement("button");
+ toggleDetails.innerHTML = '<span class="glyphicon glyphicon-menu-hamburger" aria-hidden="true"></span>';
+ toggleDetails.classList.add("btn", "btn-default", "pull-right");
+ toggleDetails.dataset.toggle = "collapse";
+ toggleDetails.dataset.target = "#edit-output-cont";
+ toggleDetails.title = "Show request preview";
+ toggleDetails.id = "edit-toggle-details-" + this.sw;
+ nav.appendChild(toggleDetails);
+
+ domObj.appendChild(nav);
+
+ this._render(domObj);
+ if (place) {
+ var pval = document.getElementById("edit-" + this.sw + "-placement");
+ if (pval) {
+ pval.value = place;
+ }
+ }
+ if (tags) {
+ var ptags = document.getElementById("edit-" + this.sw + "-tags");
+ if (ptags) {
+ ptags.value = tags;
+ }
+ }
+
+ };
+ this.save = function () {
+ var myData = nmsInfoBox._editStringify(this.sw);
+ $.ajax({
+ type: "POST",
+ url: "/api/write/network-update",
+ dataType: "text",
+ data:myData,
+ success: function (data, textStatus, jqXHR) {
+ var result = JSON.parse(data);
+ if(result.switches_updated.length > 0) { // FIXME unresolved variable switches_addded
+ nmsInfoBox.hide();
+ }
+ nmsData.invalidate("switches");
+ nmsData.invalidate("smanagement");
+ }
+ });
+ };
+};
+nmsInfoBox.addPanelType("networkEdit",networkEditPanel);
+
+
/*
* General-purpose table-maker?
*
diff --git a/web/js/nms.js b/web/js/nms.js
index 8f98c75..5ede6b3 100644
--- a/web/js/nms.js
+++ b/web/js/nms.js
@@ -27,7 +27,7 @@ var nms = {
timers: {
tvmode: false
},
-
+
menuShowing:true,
get uptime() {
return (Date.now() - this._startTime)/1000;
@@ -105,13 +105,13 @@ function nmsTimer(handler, interval, name, description) {
this.interval = parseInt(interval);
this.name = name;
this.description = description;
- this.start = function() {
+ this.start = function() {
if (this.handle) {
this.stop();
}
this.handle = setInterval(this.handler,this.interval);
};
- this.stop = function() {
+ this.stop = function() {
if (this.handle)
clearInterval(this.handle);
this.handle = false;
@@ -370,7 +370,7 @@ function getInitialConfig() {
function initNMS() {
// Only used for dev-purposes now. Accessible through nms.uptime.
nms._startTime = Date.now();
-
+
// Public
nmsData.registerSource("config","/api/public/config");
nmsData.registerSource("ping", "/api/public/ping");
@@ -391,10 +391,11 @@ function initNMS() {
nmsData.registerSource("ticker","bananabananbanana");
if (!nms._public) {
- // Private
+ // Private
nmsData.registerSource("snmp","/api/read/snmp");
nmsData.registerSource("smanagement","/api/read/switches-management");
nmsData.registerSource("oplog", "/api/read/oplog");
+ nmsData.registerSource("networks","/api/private/networks");
// setInterval(nmsUpdateNavbarGraph, 30000);
// nmsUpdateNavbarGraph();
nmsOplog.init();
@@ -414,7 +415,7 @@ function detectHandler() {
if (views == undefined || views == "")
views = "ping";
views = views.split(",");
-
+
if (views.length > 1) {
nms.tvmode.start(views,interval);
return;
@@ -596,7 +597,7 @@ function restoreSettings()
{
try {
var retrieve = JSON.parse(atob(getCookie("nms")));
- } catch(e) {
+ } catch(e) {
}
try {
var retrieve2 = getUrlVars()['nms'];
@@ -625,7 +626,7 @@ function restoreSettings()
function nmsUpdateNavbarGraph() {
var img = document.getElementById("navbar-graph");
var w = 200;
-
+
img.src = "/render/?target=movingAverage(averageSeries(ping.*.*.ipv4),%225min%22)&target=secondYAxis(averageSeries(perSecond(snmp.*.*.ports.*.{ifHCInOctets,ifHCOutOctets})))&bgcolor=%23ffffff00&width=" + w + "&height=20&format=svg&from=-30min&until=now&graphOnly=true";
}
/*
generated by cgit v1.2.3 (git 2.25.1) at 2025-08-20 03:20:09 +0000