85 lines
2.6 KiB
JavaScript
85 lines
2.6 KiB
JavaScript
import * as domlib from '../domlib';
|
|
import * as gui from '../gui';
|
|
import * as socket from '../socket';
|
|
import * as store from '../store';
|
|
import View from '../view';
|
|
|
|
export class StatisticsView extends View {
|
|
|
|
constructor () {
|
|
super();
|
|
domlib.newAt(this.el, 'h1').innerHTML = 'Statistics';
|
|
|
|
const table = domlib.newAt(this.el, 'table');
|
|
|
|
table.classList.add('stats');
|
|
|
|
let tr = domlib.newAt(table, 'tr'),
|
|
title = domlib.newAt(tr, 'th');
|
|
|
|
title.innerHTML = 'Nodes';
|
|
title.setAttribute('colspan', '2');
|
|
this.nodes = domlib.newAt(tr, 'td');
|
|
|
|
tr = domlib.newAt(table, 'tr');
|
|
title = domlib.newAt(tr, 'th');
|
|
title.innerHTML = 'Clients';
|
|
title.setAttribute('colspan', '2');
|
|
this.clients = domlib.newAt(tr, 'td');
|
|
|
|
tr = domlib.newAt(table, 'tr');
|
|
tr.classList.add('line');
|
|
domlib.newAt(tr, 'th').innerHTML = 'Wifi';
|
|
domlib.newAt(tr, 'th').innerHTML = '2.4 Ghz';
|
|
domlib.newAt(tr, 'th').innerHTML = '5 Ghz';
|
|
|
|
tr = domlib.newAt(table, 'tr');
|
|
this.clientsWifi = domlib.newAt(tr, 'td');
|
|
this.clientsWifi24 = domlib.newAt(tr, 'td');
|
|
this.clientsWifi5 = domlib.newAt(tr, 'td');
|
|
|
|
// Channels table
|
|
domlib.newAt(this.el, 'h1').innerHTML = 'Channels';
|
|
this.channelTabelle = domlib.newAt(this.el, 'table');
|
|
this.channelTabelle.classList.add('stats');
|
|
|
|
socket.setEvent('stats', (msg) => {
|
|
if (msg.body) {
|
|
this.nodes.innerHTML = msg.body.Nodes;
|
|
this.clients.innerHTML = msg.body.Clients;
|
|
this.clientsWifi.innerHTML = msg.body.ClientsWifi;
|
|
this.clientsWifi24.innerHTML = msg.body.ClientsWifi24;
|
|
this.clientsWifi5.innerHTML = msg.body.ClientsWifi5;
|
|
|
|
while(this.channelTabelle.hasChildNodes()) {
|
|
this.channelTabelle.removeChild(this.channelTabelle.firstElementChild);
|
|
}
|
|
|
|
let tr = domlib.newAt(this.channelTabelle, 'tr');
|
|
|
|
let title = domlib.newAt(tr, 'th');
|
|
title.innerHTML = '2.4 Ghz';
|
|
title.setAttribute('colspan', '2');
|
|
|
|
title = domlib.newAt(tr, 'th');
|
|
title.innerHTML = '5 Ghz';
|
|
title.setAttribute('colspan', '2');
|
|
const storeNodes = store.getNodes();
|
|
for (let ch = 1; ch <= 33; ch++) {
|
|
tr = domlib.newAt(this.channelTabelle, 'tr');
|
|
if (ch < 14) {
|
|
domlib.newAt(tr, 'td').innerHTML = ch;
|
|
domlib.newAt(tr, 'td').innerHTML = storeNodes.reduce((c, node) => node.wireless.channel24 === ch ? c + 1 : c, 0);
|
|
} else {
|
|
domlib.newAt(tr, 'td');
|
|
domlib.newAt(tr, 'td');
|
|
}
|
|
const ch5 = 32 + ch * 4;
|
|
domlib.newAt(tr, 'td').innerHTML = ch5;
|
|
domlib.newAt(tr, 'td').innerHTML = storeNodes.reduce((c, node) => node.wireless.channel5 === ch5 ? c + 1 : c, 0);
|
|
}
|
|
}
|
|
});
|
|
}
|
|
}
|