misp-dashboard/static/js/index/index.js

341 lines
9.5 KiB
JavaScript

var feedStatusFreqCheck = 1000*15;
var maxNumPoint = hours_spanned;
var keepaliveTime = 0;
var emptyArray = [];
var _timeoutLed;
var toPlotLocationLog;
for(i=0; i<maxNumPoint; i++) {
emptyArray.push([i, 0]);
}
class LedManager {
constructor() {
this._feedLedsTimeout = setTimeout(function(){ ledmanager.manageColors(); }, feedStatusFreqCheck);
this._feedLedKeepAlive = {};
this._allFeedName = [];
this._ledNum = 0;
this._nameToNumMapping = {}; //avoid bad ID if zmqname contains spaces
}
add_new_led(zmqname) {
this._allFeedName.push(zmqname);
this._nameToNumMapping[zmqname] = this._ledNum;
this._ledNum += 1;
this.add_new_html_led(zmqname);
this._feedLedKeepAlive[zmqname] = new Date().getTime();
}
add_new_html_led(zmqname) {
var ID = this._nameToNumMapping[zmqname]
var text = document.createElement('b');
text.innerHTML = zmqname;
var div = document.createElement('DIV');
div.id = "status_led_"+ID;
div.classList.add("led_green");
var sepa = document.createElement('DIV');
sepa.classList.add("leftSepa");
sepa.classList.add("textTopHeader");
sepa.appendChild(text);
sepa.appendChild(div);
$('#ledsHolder').append(sepa);
}
updateKeepAlive(zmqname) {
if (this._allFeedName.indexOf(zmqname) == -1) {
this.add_new_led(zmqname);
}
this._feedLedKeepAlive[zmqname] = new Date().getTime();
this.resetTimeoutAndRestart(zmqname);
}
resetTimeoutAndRestart(zmqName) {
clearTimeout(this._feedLedsTimeout); //cancel current leds timeout
this.manageColors();
}
manageColors() {
for (var feed in this._feedLedKeepAlive) {
var feedID = this._nameToNumMapping[feed];
var htmlLed = $("#status_led_"+feedID);
if(new Date().getTime() - this._feedLedKeepAlive[feed] > feedStatusFreqCheck) { // no feed
htmlLed.removeClass("led_green");
htmlLed.addClass("led_red");
} else {
htmlLed.removeClass("led_red");
htmlLed.addClass("led_green");
}
}
this._feedLedsTimeout = setTimeout(function(){ ledmanager.manageColors(); }, feedStatusFreqCheck);
}
}
class Sources {
constructor() {
this._sourcesArray = {};
this._sourcesCount = {};
this._sourcesCountMax = {};
this._globalMax = 0;
this._sourceNames = [];
}
addSource(sourceName) {
this._sourcesArray[sourceName] = emptyArray;
this._sourcesCount[sourceName] = 0;
this._sourcesCountMax[sourceName] = 0;
this._sourceNames.push(sourceName);
}
addIfNotPresent(sourceName) {
if (this._sourceNames.indexOf(sourceName) == -1) {
this.addSource(sourceName);
}
}
incCountOnSource(sourceName) {
this._sourcesCount[sourceName] += 1;
}
resetCountOnSource() {
for (var src of this._sourceNames) {
this._sourcesCount[src] = 0;
}
}
slideSource() {
var globMax = 0;
for (var src of this._sourceNames) {
// res[0] = max, res[1] = slidedArray
var res = slideAndMax(this._sourcesArray[src], this._sourcesCount[src]);
// max
this._sourcesCountMax[src] = res[0];
globMax = globMax > res[0] ? globMax : res[0];
// data
this._sourcesArray[src] = res[1];
}
this._globalMax = globMax;
}
toArray() {
var to_return = [];
for (var src of this._sourceNames) {
if(src == 'global') //ignore global
continue;
var realData = this._sourcesArray[src].slice(0); //clone array
realData.push([maxNumPoint, 0]);
to_return.push({
label: src,
data: realData
});
}
return to_return;
}
toArrayDirect() {
var to_return = [];
for (var src of this._sourceNames) {
if(src == 'global') //ignore global
continue;
var realData = this._sourcesArray[src].slice(0); //clone array
realData.push([maxNumPoint, this._sourcesCount[src]]);
this._globalMax = this._globalMax > this._sourcesCount[src] ? this._globalMax : this._sourcesCount[src];
to_return.push({
label: src,
data: realData
});
}
return to_return;
}
getGlobalMax() {
return this._globalMax;
}
getSingleSource(sourceName) {
return this._sourcesArray[sourceName];
}
getEmptyData() {
return [{label: 'no data', data: emptyArray}];
}
}
/* END CLASS SOURCE */
var sources = new Sources();
sources.addSource('global');
var ledmanager = new LedManager();
var curNumLog = 0;
var curMaxDataNumLog = 0;
var source_log;
function connect_source_log() {
source_log = new EventSource(urlForLogs);
source_log.onopen = function(){
//console.log('connection is opened. '+source_log.readyState);
};
source_log.onerror = function(){
console.log('error: '+source_log.readyState);
setTimeout(function() { connect_source_log(); }, 5000);
};
source_log.onmessage = function(event) {
var json = jQuery.parseJSON( event.data );
updateLogTable(json.name, json.log, json.zmqName);
};
}
$(document).ready(function () {
createHead(function() {
if (!!window.EventSource) {
$.getJSON( urlForLogs, function( data ) {
data.forEach(function(item) {
updateLogTable(item.name, item.log, item.zmqName);
});
connect_source_log();
});
} else {
console.log("No event source_log");
}
});
});
// LOG TABLE
function updateLogTable(name, log, zmqName) {
if (log.length == 0)
return;
// update keepAlives
ledmanager.updateKeepAlive(zmqName);
// Create new row
tableBody = document.getElementById('table_log_body');
// only add row for attribute
if (name == "Attribute" ) {
var categName = log[toPlotLocationLog];
sources.addIfNotPresent(categName);
sources.incCountOnSource(categName);
sources.incCountOnSource('global');
updateChartDirect();
createRow(tableBody, log);
// Remove old row
while ($("#table_log").height() >= $("#panelLogTable").height()-26){ //26 for margin
tableBody.deleteRow(0);
}
} else if (name == "Keepalive") {
// do nothing
} else {
// do nothing
}
}
function slideAndMax(orig, newData) {
var slided = [];
var max = newData;
for (i=1; i<orig.length; i++) {
y = orig[i][1];
slided.push([i-1, y]);
max = y > max ? y : max;
}
slided.push([orig.length-1, newData]);
curMaxDataNumLog = max;
return [curMaxDataNumLog, slided];
}
function getTextColour(rgb) {
var r = parseInt('0x'+rgb.substring(0,2));
var g = parseInt('0x'+rgb.substring(2,4));
var b = parseInt('0x'+rgb.substring(4,6));
var avg = ((2 * r) + b + (3 * g))/6;
if (avg < 128) {
return 'white';
} else {
return 'black';
}
}
function addObjectToLog(name, obj, td) {
if(name == "Tag") {
var a = document.createElement('A');
a.classList.add('tagElem');
a.style.backgroundColor = obj.colour;
a.style.color = getTextColour(obj.colour.substring(1,6));
a.innerHTML = obj.name;
td.appendChild(a);
td.appendChild(document.createElement('br'));
} else if (name == "mispObject") {
td.appendChild(document.createTextNode('mispObj'));
} else {
td.appendChild(document.createTextNode('nop'));
}
}
function createRow(tableBody, log) {
var tr = document.createElement('TR');
for (var key in log) {
if (log.hasOwnProperty(key)) {
var td = document.createElement('TD');
if(typeof log[key] === 'object') { //handle list of objects
theObj = log[key];
for(var objI in theObj.data) {
addObjectToLog(theObj.name, theObj.data[objI], td);
}
} else {
var textToAddArray = log[key].split(char_separator);
for(var i in textToAddArray){
if (i > 0)
td.appendChild(document.createElement("br"));
td.appendChild(document.createTextNode(textToAddArray[i]));
}
}
tr.appendChild(td);
}
}
// level
if( log.level == "INFO" ){
tr.className = "info";
}
else if ( log.level == "WARNING" ){
tr.className = "warning";
}
else if ( log.level == "CRITICAL"){
tr.className = "danger"
}
tableBody.appendChild(tr);
}
function createHead(callback) {
if (document.getElementById('table_log_head').childNodes.length > 1)
return
$.getJSON( urlForHead, function( data ) {
var tr = document.createElement('TR');
for (i in data) {
var head = data[i];
var th = document.createElement('TH');
if (head == itemToPlot) {
toPlotLocationLog = i;
}
th.appendChild(document.createTextNode(head));
tr.appendChild(th);
}
document.getElementById('table_log_head').appendChild(tr);
callback();
});
}