From 4a13700cc5b5e3ff831dcd03c8e75a15e8463cea Mon Sep 17 00:00:00 2001 From: Alexander Moisseev Date: Tue, 21 Aug 2018 21:45:23 +0300 Subject: [PATCH] [WebUI] Avoid throughput summary table reinitialization on data update --- interface/js/app/graph.js | 77 ++++++++++++++++++++++++--------------- 1 file changed, 48 insertions(+), 29 deletions(-) diff --git a/interface/js/app/graph.js b/interface/js/app/graph.js index 46c6062fd..12e6b4676 100644 --- a/interface/js/app/graph.js +++ b/interface/js/app/graph.js @@ -23,11 +23,13 @@ THE SOFTWARE. */ -/* global d3:false */ +/* global d3:false, FooTable:false */ define(["jquery", "d3evolution", "footable"], function ($, D3Evolution) { "use strict"; + var ft; + var rrd_pie_config = { header: {}, size: { @@ -137,7 +139,7 @@ define(["jquery", "d3evolution", "footable"], }, []); } - function drawRrdTable(data, unit) { + function updateSummaryTable(data) { var total_messages = 0; var rows = data.map(function (curr, i) { total_messages += curr.value; @@ -153,58 +155,75 @@ define(["jquery", "d3evolution", "footable"], document.getElementById("rrd-total-value").innerHTML = total_messages; - $("#rrd-table").footable({ + ft.rows.load(rows); + } + + function initSummaryTable(data, unit) { + return FooTable.init("#rrd-table", { sorting: { enabled: true }, columns: [ {name: "label", title: "Action"}, {name: "value", title: "Messages", defaultContent: ""}, - {name: "min", title: "Minimum, " + unit, defaultContent: ""}, - {name: "avg", title: "Average, " + unit, defaultContent: ""}, - {name: "max", title: "Maximum, " + unit, defaultContent: ""}, + {name: "min", title: "Minimum, " + unit + "", defaultContent: ""}, + {name: "avg", title: "Average, " + unit + "", defaultContent: ""}, + {name: "max", title: "Maximum, " + unit + "", defaultContent: ""}, {name: "last", title: "Last, " + unit}, ], - rows: rows + on: { + "ready.ft.table": function () { + updateSummaryTable(data); + } + } }); } + function drawRrdTable(data, unit) { + if (ft) { + updateSummaryTable(data); + } else { + ft = initSummaryTable(data, unit); + } + } + var ui = {}; var prevUnit = "msg/s"; ui.draw = function (rspamd, graphs, neighbours, checked_server, type) { - function updateWidgets(data) { - // Autoranging - var scaleFactor = 1; + var rrd_summary = []; var unit = "msg/s"; - var yMax = d3.max(d3.merge(data), function (d) { return d.y; }); - if (yMax < 1) { - scaleFactor = 60; - unit = "msg/min"; - data.forEach(function (s) { - s.forEach(function (d) { - if (d.y !== null) { d.y *= scaleFactor; } + + if (data) { + // Autoranging + var scaleFactor = 1; + var yMax = d3.max(d3.merge(data), function (d) { return d.y; }); + if (yMax < 1) { + scaleFactor = 60; + unit = "msg/min"; + data.forEach(function (s) { + s.forEach(function (d) { + if (d.y !== null) { d.y *= scaleFactor; } + }); }); - }); + } + + rrd_summary = getRrdSummary(data, scaleFactor); + graphs.rrd_pie = rspamd.drawPie(graphs.rrd_pie, + "rrd-pie", + rrd_summary, + rrd_pie_config); + } else if (graphs.rrd_pie) { + graphs.rrd_pie.destroy(); } graphs.graph.data(data); if (unit !== prevUnit) { graphs.graph.yAxisLabel("Message rate, " + unit); + $(".unit").text(unit); prevUnit = unit; } - - if (!data) { - graphs.rrd_pie.destroy(); - drawRrdTable([]); - return; - } - var rrd_summary = getRrdSummary(data, scaleFactor); - graphs.rrd_pie = rspamd.drawPie(graphs.rrd_pie, - "rrd-pie", - rrd_summary, - rrd_pie_config); drawRrdTable(rrd_summary, unit); } -- 2.39.5