IntenseWebs/LibreQoS
3
0
Fork 0
mirror of https://github.com/LibreQoE/LibreQoS.git synced 2025-02-25 18:55:32 -06:00
Code Issues Packages Projects Releases Wiki Activity

You can sort the timeline entries.

Browse Source
This commit is contained in:
Herbert Wolverson 2024-07-27 09:31:43 -05:00
parent 80995b7f95
commit ac700677ee
1 changed files with 49 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

54
src/rust/lqosd/src/node_manager/js_build/src/asn_explorer.js
View File

@ -14,6 +14,13 @@ let graphMaxTime = Number.MIN_SAFE_INTEGER;
const itemsPerPage = 20; const itemsPerPage = 20;
let page = 0; let page = 0;
let sortBy = "start";
let sortOptionsList = [
{ tag: "start", label: "Start Time" },
{ tag: "duration", label: "Duration" },
{ tag: "bytes", label: "Bytes" },
];
function unixTimeToDate(unixTime) { function unixTimeToDate(unixTime) {
return new Date(unixTime * 1000).toLocaleString(); return new Date(unixTime * 1000).toLocaleString();
} }
@ -89,10 +96,24 @@ function renderAsn(asn, data) {
// Get the flow data // Get the flow data
asnData = data; asnData = data;
// Sort data by row.start, ascending // Sort by the selected sort key
data.sort((a, b) => { switch (sortBy) {
return a.start - b.start; case "start": {
}); data.sort((a, b) => {
return a.start - b.start;
});
} break;
case "duration": {
data.sort((a, b) => {
return b.duration_nanos - a.duration_nanos;
});
} break;
case "bytes": {
data.sort((a, b) => {
return (b.total_bytes.down + b.total_bytes.up) - (a.total_bytes.down + a.total_bytes.up);
});
}
}
let div = document.createElement("div"); let div = document.createElement("div");
div.classList.add("row"); div.classList.add("row");
@ -140,7 +161,6 @@ function renderAsn(asn, data) {
headerDiv.appendChild(headerTime1); headerDiv.appendChild(headerTime1);
let headerTime2 = document.createElement("div"); let headerTime2 = document.createElement("div");
headerTime2.classList.add("col-4", "text-secondary", "text-end"); headerTime2.classList.add("col-4", "text-secondary", "text-end");
console.log(maxTime);
headerTime2.innerText = unixTimeToDate(maxTime); headerTime2.innerText = unixTimeToDate(maxTime);
headerDiv.appendChild(headerTime2); headerDiv.appendChild(headerTime2);
@ -220,11 +240,35 @@ function renderAsn(asn, data) {
paginator.innerText = "Page " + (page + 1) + " of " + Math.ceil(data.length / itemsPerPage); paginator.innerText = "Page " + (page + 1) + " of " + Math.ceil(data.length / itemsPerPage);
paginator.id = "paginator"; paginator.id = "paginator";
let sortOptions = document.createElement("span");
sortOptions.classList.add("text-secondary", "small", "ms-2", "me-2");
sortOptions.innerText = "Sort by: ";
let sortBox = document.createElement("select");
sortBox.classList.add("small");
sortBox.id = "sortBox";
sortOptionsList.forEach((option) => {
let opt = document.createElement("option");
opt.value = option.tag;
opt.innerText = option.label;
if (option.tag === sortBy) {
opt.selected = true;
}
sortBox.appendChild(opt);
});
sortBox.onchange = () => {
let sortBox = document.getElementById("sortBox");
sortBy = sortBox.value;
renderAsn(asn, data);
}
let controlDiv = document.createElement("div"); let controlDiv = document.createElement("div");
controlDiv.classList.add("mb-2"); controlDiv.classList.add("mb-2");
controlDiv.appendChild(prevButton); controlDiv.appendChild(prevButton);
controlDiv.appendChild(paginator); controlDiv.appendChild(paginator);
controlDiv.appendChild(nextButton); controlDiv.appendChild(nextButton);
controlDiv.appendChild(sortOptions);
controlDiv.appendChild(sortBox);
target.appendChild(controlDiv); target.appendChild(controlDiv);
target.appendChild(headerDiv); target.appendChild(headerDiv);