Adding upstream version 1.44.3.upstream/1.44.3upstream

Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>

1 files changed, 281 insertions, 0 deletions

diff --git a/web/gui/src/dashboard.js/charting/easy-pie-chart.js b/web/gui/src/dashboard.js/charting/easy-pie-chart.js
new file mode 100644
index 00000000..6905a103
--- /dev/null
+++ b/web/gui/src/dashboard.js/charting/easy-pie-chart.js
@@ -0,0 +1,281 @@
+// ----------------------------------------------------------------------------------------------------------------
+
+NETDATA.easypiechartPercentFromValueMinMax = function (state, value, min, max) {
+    if (typeof value !== 'number') {
+        value = 0;
+    }
+    if (typeof min !== 'number') {
+        min = 0;
+    }
+    if (typeof max !== 'number') {
+        max = 0;
+    }
+
+    if (min > max) {
+        let t = min;
+        min = max;
+        max = t;
+    }
+
+    if (min > value) {
+        min = value;
+    }
+    if (max < value) {
+        max = value;
+    }
+
+    state.legendFormatValueDecimalsFromMinMax(min, max);
+
+    if (state.tmp.easyPieChartMin === null && min > 0) {
+        min = 0;
+    }
+    if (state.tmp.easyPieChartMax === null && max < 0) {
+        max = 0;
+    }
+
+    let pcent;
+
+    if (min < 0 && max > 0) {
+        // it is both positive and negative
+        // zero at the top center of the chart
+        max = (-min > max) ? -min : max;
+        pcent = Math.round(value * 100 / max);
+    } else if (value >= 0 && min >= 0 && max >= 0) {
+        // clockwise
+        pcent = Math.round((value - min) * 100 / (max - min));
+        if (pcent === 0) {
+            pcent = 0.1;
+        }
+    } else {
+        // counter clockwise
+        pcent = Math.round((value - max) * 100 / (max - min));
+        if (pcent === 0) {
+            pcent = -0.1;
+        }
+    }
+
+    return pcent;
+};
+
+// ----------------------------------------------------------------------------------------------------------------
+// easy-pie-chart
+
+NETDATA.easypiechartInitialize = function (callback) {
+    if (typeof netdataNoEasyPieChart === 'undefined' || !netdataNoEasyPieChart) {
+        $.ajax({
+            url: NETDATA.easypiechart_js,
+            cache: true,
+            dataType: "script",
+            xhrFields: {withCredentials: true} // required for the cookie
+        })
+            .done(function () {
+                NETDATA.registerChartLibrary('easypiechart', NETDATA.easypiechart_js);
+            })
+            .fail(function () {
+                NETDATA.chartLibraries.easypiechart.enabled = false;
+                NETDATA.error(100, NETDATA.easypiechart_js);
+            })
+            .always(function () {
+                if (typeof callback === "function") {
+                    return callback();
+                }
+            })
+    } else {
+        NETDATA.chartLibraries.easypiechart.enabled = false;
+        if (typeof callback === "function") {
+            return callback();
+        }
+    }
+};
+
+NETDATA.easypiechartClearSelection = function (state, force) {
+    if (typeof state.tmp.easyPieChartEvent !== 'undefined' && typeof state.tmp.easyPieChartEvent.timer !== 'undefined') {
+        NETDATA.timeout.clear(state.tmp.easyPieChartEvent.timer);
+        state.tmp.easyPieChartEvent.timer = undefined;
+    }
+
+    if (state.isAutoRefreshable() && state.data !== null && force !== true) {
+        NETDATA.easypiechartChartUpdate(state, state.data);
+    }
+    else {
+        state.tmp.easyPieChartLabel.innerText = state.legendFormatValue(null);
+        state.tmp.easyPieChart_instance.update(0);
+    }
+    state.tmp.easyPieChart_instance.enableAnimation();
+
+    return true;
+};
+
+NETDATA.easypiechartSetSelection = function (state, t) {
+    if (state.timeIsVisible(t) !== true) {
+        return NETDATA.easypiechartClearSelection(state, true);
+    }
+
+    let slot = state.calculateRowForTime(t);
+    if (slot < 0 || slot >= state.data.result.length) {
+        return NETDATA.easypiechartClearSelection(state, true);
+    }
+
+    if (typeof state.tmp.easyPieChartEvent === 'undefined') {
+        state.tmp.easyPieChartEvent = {
+            timer: undefined,
+            value: 0,
+            pcent: 0
+        };
+    }
+
+    let value = state.data.result[state.data.result.length - 1 - slot];
+    let min = (state.tmp.easyPieChartMin === null) ? NETDATA.commonMin.get(state) : state.tmp.easyPieChartMin;
+    let max = (state.tmp.easyPieChartMax === null) ? NETDATA.commonMax.get(state) : state.tmp.easyPieChartMax;
+    let pcent = NETDATA.easypiechartPercentFromValueMinMax(state, value, min, max);
+
+    state.tmp.easyPieChartEvent.value = value;
+    state.tmp.easyPieChartEvent.pcent = pcent;
+    state.tmp.easyPieChartLabel.innerText = state.legendFormatValue(value);
+
+    if (state.tmp.easyPieChartEvent.timer === undefined) {
+        state.tmp.easyPieChart_instance.disableAnimation();
+
+        state.tmp.easyPieChartEvent.timer = NETDATA.timeout.set(function () {
+            state.tmp.easyPieChartEvent.timer = undefined;
+            state.tmp.easyPieChart_instance.update(state.tmp.easyPieChartEvent.pcent);
+        }, 0);
+    }
+
+    return true;
+};
+
+NETDATA.easypiechartChartUpdate = function (state, data) {
+    let value, min, max, pcent;
+
+    if (NETDATA.globalPanAndZoom.isActive() || state.isAutoRefreshable() === false) {
+        value = null;
+        pcent = 0;
+    }
+    else {
+        value = data.result[0];
+        min = (state.tmp.easyPieChartMin === null) ? NETDATA.commonMin.get(state) : state.tmp.easyPieChartMin;
+        max = (state.tmp.easyPieChartMax === null) ? NETDATA.commonMax.get(state) : state.tmp.easyPieChartMax;
+        pcent = NETDATA.easypiechartPercentFromValueMinMax(state, value, min, max);
+    }
+
+    state.tmp.easyPieChartLabel.innerText = state.legendFormatValue(value);
+    state.tmp.easyPieChart_instance.update(pcent);
+    return true;
+};
+
+NETDATA.easypiechartChartCreate = function (state, data) {
+    let chart = $(state.element_chart);
+
+    let value = data.result[0];
+    let min = NETDATA.dataAttribute(state.element, 'easypiechart-min-value', null);
+    let max = NETDATA.dataAttribute(state.element, 'easypiechart-max-value', null);
+
+    if (min === null) {
+        min = NETDATA.commonMin.get(state);
+        state.tmp.easyPieChartMin = null;
+    }
+    else {
+        state.tmp.easyPieChartMin = min;
+    }
+
+    if (max === null) {
+        max = NETDATA.commonMax.get(state);
+        state.tmp.easyPieChartMax = null;
+    }
+    else {
+        state.tmp.easyPieChartMax = max;
+    }
+
+    let size = state.chartWidth();
+    let stroke = Math.floor(size / 22);
+    if (stroke < 3) {
+        stroke = 2;
+    }
+
+    let valuefontsize = Math.floor((size * 2 / 3) / 5);
+    let valuetop = Math.round((size - valuefontsize - (size / 40)) / 2);
+    state.tmp.easyPieChartLabel = document.createElement('span');
+    state.tmp.easyPieChartLabel.className = 'easyPieChartLabel';
+    state.tmp.easyPieChartLabel.innerText = state.legendFormatValue(value);
+    state.tmp.easyPieChartLabel.style.fontSize = valuefontsize + 'px';
+    state.tmp.easyPieChartLabel.style.top = valuetop.toString() + 'px';
+    state.element_chart.appendChild(state.tmp.easyPieChartLabel);
+
+    let titlefontsize = Math.round(valuefontsize * 1.6 / 3);
+    let titletop = Math.round(valuetop - (titlefontsize * 2) - (size / 40));
+    state.tmp.easyPieChartTitle = document.createElement('span');
+    state.tmp.easyPieChartTitle.className = 'easyPieChartTitle';
+    state.tmp.easyPieChartTitle.innerText = state.title;
+    state.tmp.easyPieChartTitle.style.fontSize = titlefontsize + 'px';
+    state.tmp.easyPieChartTitle.style.lineHeight = titlefontsize + 'px';
+    state.tmp.easyPieChartTitle.style.top = titletop.toString() + 'px';
+    state.element_chart.appendChild(state.tmp.easyPieChartTitle);
+
+    let unitfontsize = Math.round(titlefontsize * 0.9);
+    let unittop = Math.round(valuetop + (valuefontsize + unitfontsize) + (size / 40));
+    state.tmp.easyPieChartUnits = document.createElement('span');
+    state.tmp.easyPieChartUnits.className = 'easyPieChartUnits';
+    state.tmp.easyPieChartUnits.innerText = state.units_current;
+    state.tmp.easyPieChartUnits.style.fontSize = unitfontsize + 'px';
+    state.tmp.easyPieChartUnits.style.top = unittop.toString() + 'px';
+    state.element_chart.appendChild(state.tmp.easyPieChartUnits);
+
+    let barColor = NETDATA.dataAttribute(state.element, 'easypiechart-barcolor', undefined);
+    if (typeof barColor === 'undefined' || barColor === null) {
+        barColor = state.chartCustomColors()[0];
+    } else {
+        // <div ... data-easypiechart-barcolor="(function(percent){return(percent < 50 ? '#5cb85c' : percent < 85 ? '#f0ad4e' : '#cb3935');})" ...></div>
+        let tmp = eval(barColor);
+        if (typeof tmp === 'function') {
+            barColor = tmp;
+        }
+    }
+
+    let pcent = NETDATA.easypiechartPercentFromValueMinMax(state, value, min, max);
+    chart.data('data-percent', pcent);
+
+    chart.easyPieChart({
+        barColor: barColor,
+        trackColor: NETDATA.dataAttribute(state.element, 'easypiechart-trackcolor', NETDATA.themes.current.easypiechart_track),
+        scaleColor: NETDATA.dataAttribute(state.element, 'easypiechart-scalecolor', NETDATA.themes.current.easypiechart_scale),
+        scaleLength: NETDATA.dataAttribute(state.element, 'easypiechart-scalelength', 5),
+        lineCap: NETDATA.dataAttribute(state.element, 'easypiechart-linecap', 'round'),
+        lineWidth: NETDATA.dataAttribute(state.element, 'easypiechart-linewidth', stroke),
+        trackWidth: NETDATA.dataAttribute(state.element, 'easypiechart-trackwidth', undefined),
+        size: NETDATA.dataAttribute(state.element, 'easypiechart-size', size),
+        rotate: NETDATA.dataAttribute(state.element, 'easypiechart-rotate', 0),
+        animate: NETDATA.dataAttribute(state.element, 'easypiechart-animate', {duration: 500, enabled: true}),
+        easing: NETDATA.dataAttribute(state.element, 'easypiechart-easing', undefined)
+    });
+
+    // when we just re-create the chart
+    // do not animate the first update
+    let animate = true;
+    if (typeof state.tmp.easyPieChart_instance !== 'undefined') {
+        animate = false;
+    }
+
+    state.tmp.easyPieChart_instance = chart.data('easyPieChart');
+    if (animate === false) {
+        state.tmp.easyPieChart_instance.disableAnimation();
+    }
+    state.tmp.easyPieChart_instance.update(pcent);
+    if (animate === false) {
+        state.tmp.easyPieChart_instance.enableAnimation();
+    }
+
+    state.legendSetUnitsString = function (units) {
+        if (typeof state.tmp.easyPieChartUnits !== 'undefined' && state.tmp.units !== units) {
+            state.tmp.easyPieChartUnits.innerText = units;
+            state.tmp.units = units;
+        }
+    };
+    state.legendShowUndefined = function () {
+        if (typeof state.tmp.easyPieChart_instance !== 'undefined') {
+            NETDATA.easypiechartClearSelection(state);
+        }
+    };
+
+    return true;
+};