@netdata/charts
Version:
Netdata frontend SDK and chart utilities
403 lines (402 loc) • 21 kB
JavaScript
;
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
Object.defineProperty(exports, "__esModule", {
value: true
});
exports["default"] = void 0;
var _makeKeyboardListener2 = _interopRequireDefault(require("../../helpers/makeKeyboardListener"));
var _makeExecuteLatest = _interopRequireDefault(require("../../helpers/makeExecuteLatest"));
var _units = _interopRequireDefault(require("../../helpers/units"));
var _unitConversion = _interopRequireDefault(require("../../helpers/unitConversion"));
var _makeNode = _interopRequireDefault(require("../makeNode"));
var _api = require("./api");
var _makeDimensions = _interopRequireDefault(require("./makeDimensions"));
var _makeControllers = _interopRequireDefault(require("./filters/makeControllers"));
var _makeDataFetch = _interopRequireDefault(require("./makeDataFetch"));
var _makeGetUnitSign = _interopRequireWildcard(require("./makeGetUnitSign"));
var _makeWeights = _interopRequireDefault(require("./makeWeights"));
var _getAggregateMethod = _interopRequireDefault(require("./filters/getAggregateMethod"));
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
function _toConsumableArray(r) { return _arrayWithoutHoles(r) || _iterableToArray(r) || _unsupportedIterableToArray(r) || _nonIterableSpread(); }
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
function _iterableToArray(r) { if ("undefined" != typeof Symbol && null != r[Symbol.iterator] || null != r["@@iterator"]) return Array.from(r); }
function _arrayWithoutHoles(r) { if (Array.isArray(r)) return _arrayLikeToArray(r); }
function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
var themeIndex = {
"default": 0,
dark: 1
};
var maxBackoffMs = 30 * 1000;
var maxRegularNumberLength = 18;
var formatExponential = function formatExponential(value) {
return value.toExponential(3).replace(/(\.\d*?)0+e/, "$1e").replace(/\.e/, "e");
};
var formatNumber = function formatNumber(node, converted, fractionDigits, unitsConversionFractionDigits) {
var formatted = Intl.NumberFormat(node.getAttribute("locale") || undefined, {
useGrouping: true,
minimumFractionDigits: isNaN(fractionDigits) || fractionDigits < 0 ? 0 : fractionDigits,
maximumFractionDigits: fractionDigits === null || isNaN(fractionDigits) || fractionDigits < 0 ? unitsConversionFractionDigits === -1 ? 4 : unitsConversionFractionDigits : fractionDigits
}).format(converted);
if (!Number.isFinite(converted) || formatted.length <= maxRegularNumberLength) return formatted;
return formatExponential(converted);
};
var defaultMakeTrack = function defaultMakeTrack() {
return function (value) {
return value;
};
};
var _default = exports["default"] = function _default() {
var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
sdk = _ref.sdk,
parent = _ref.parent,
_ref$getChart = _ref.getChart,
getChart = _ref$getChart === void 0 ? _api.fetchChartData : _ref$getChart,
_ref$attributes = _ref.attributes,
attributes = _ref$attributes === void 0 ? {} : _ref$attributes,
_ref$makeTrack = _ref.makeTrack,
makeTrack = _ref$makeTrack === void 0 ? defaultMakeTrack : _ref$makeTrack;
var executeLatest = (0, _makeExecuteLatest["default"])();
var node = (0, _makeNode["default"])({
sdk: sdk,
parent: parent,
attributes: attributes
});
node.getChart = getChart;
var fetchTimeoutId = null;
node.getRoot = function () {
return sdk.getRoot();
};
node.backoffMs = null;
node.backoff = function (ms) {
if (!node) return;
if (ms) {
node.backoffMs = ms;
return;
}
var tmpBackoffMs = node.backoffMs ? node.backoffMs * 2 : node.getUpdateEvery();
node.backoffMs = tmpBackoffMs > maxBackoffMs ? maxBackoffMs : tmpBackoffMs;
};
var uiInstances = {};
node.getUpdateEvery = function () {
if (!node) return;
var _node$getAttributes = node.getAttributes(),
loaded = _node$getAttributes.loaded,
viewUpdateEvery = _node$getAttributes.viewUpdateEvery,
updateEvery = _node$getAttributes.updateEvery;
if (viewUpdateEvery) return viewUpdateEvery * 1000;
return loaded ? updateEvery * 1000 || 1000 : 0;
};
var cachedDateWindow = null;
var prevAfter = null;
var prevRenderedAt = null;
var prevLiveAnchor = null;
var prevNow = null;
node.getDateWindow = function () {
var _node$getAttributes2 = node.getAttributes(),
after = _node$getAttributes2.after,
before = _node$getAttributes2.before,
renderedAt = _node$getAttributes2.renderedAt,
liveAnchor = _node$getAttributes2.liveAnchor;
var now = sdk.getRoot().getAttribute("fetchAt", Date.now());
var anchor = liveAnchor !== null && liveAnchor !== void 0 ? liveAnchor : now;
if (prevAfter === after && prevRenderedAt === renderedAt && prevLiveAnchor === liveAnchor && prevNow === now) return cachedDateWindow;
prevAfter = after;
prevRenderedAt = renderedAt;
prevLiveAnchor = liveAnchor;
prevNow = now;
cachedDateWindow = after > 0 ? [after * 1000, before * 1000] : renderedAt ? [renderedAt + after * 1000, renderedAt] : [anchor + after * 1000, anchor];
return cachedDateWindow;
};
node.startAutofetch = function () {
if (!node) return;
var _node$getAttributes3 = node.getAttributes(),
fetchStartedAt = _node$getAttributes3.fetchStartedAt,
loading = _node$getAttributes3.loading,
autofetch = _node$getAttributes3.autofetch,
active = _node$getAttributes3.active;
if (!autofetch || loading || !active) return;
if (node.getRoot().getAttribute("paused")) return;
if (fetchStartedAt === 0) {
node.trigger("fetch");
return;
}
var fetchingPeriod = Date.now() - fetchStartedAt;
var updateEveryMs = node.getUpdateEvery();
var div = fetchingPeriod / updateEveryMs;
var updateEveryMultiples = Math.floor(div);
if (updateEveryMultiples >= 1) {
node.lastFetch = node.getDateWindow();
node.trigger("fetch");
return;
}
var remaining = node.backoffMs || updateEveryMs - Math.round((div - Math.floor(div)) * updateEveryMs);
clearTimeout(fetchTimeoutId);
fetchTimeoutId = setTimeout(function () {
node.startAutofetch();
}, remaining);
};
node.getUI = function () {
var uiName = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : "default";
return uiInstances[uiName];
};
node.setUI = function (newUi) {
var uiName = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : "default";
uiInstances[uiName] = newUi;
};
var render = executeLatest.add(function () {
return Object.keys(uiInstances).forEach(function (uiName) {
return uiInstances[uiName].render();
});
});
node.on("render", render);
(0, _unitConversion["default"])(node);
node.getConvertedValue = function (value) {
var _ref2 = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
fractionDigits = _ref2.fractionDigits,
_ref2$key = _ref2.key,
key = _ref2$key === void 0 ? "units" : _ref2$key,
dimensionId = _ref2.dimensionId,
unitAttributes = _ref2.unitAttributes;
if (!node) return;
if (value === null) return "-";
var _ref3 = unitAttributes || node.getUnitAttributes(dimensionId, key),
method = _ref3.method,
unitsConversionFractionDigits = _ref3.fractionDigits,
divider = _ref3.divider;
var converted = (0, _units["default"])(node, method, value, divider);
if (converted !== null && isNaN(converted)) return converted;
fractionDigits = fractionDigits !== null && fractionDigits !== void 0 ? fractionDigits : node.getAttribute("staticFractionDigits");
return formatNumber(node, converted, fractionDigits, unitsConversionFractionDigits);
};
node.getConvertedValueWithUnit = function (value) {
var _ref4 = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
fractionDigits = _ref4.fractionDigits,
_ref4$key = _ref4.key,
key = _ref4$key === void 0 ? "units" : _ref4$key,
dimensionId = _ref4.dimensionId,
unitAttributes = _ref4.unitAttributes;
var attrs = unitAttributes || node.getUnitAttributes(dimensionId, key);
var convertedValue = node.getConvertedValue(value, {
fractionDigits: fractionDigits,
key: key,
dimensionId: dimensionId,
unitAttributes: attrs
});
var unit = node.getUnitSign({
key: key,
dimensionId: dimensionId,
unitAttributes: attrs
});
return unit ? "".concat(convertedValue, " ").concat(unit) : convertedValue;
};
node.focus = function (event) {
if (!node) return;
if (node.getAttribute("focused") && node.getAttribute("hovering")) return;
node.updateAttributes({
focused: true
});
sdk.trigger("hoverChart", node, event);
node.trigger("hoverChart", event);
};
node.blur = function (event) {
if (!node) return;
if (!node.getAttribute("focused") && !node.getAttribute("hovering")) return;
node.updateAttributes({
focused: false
});
sdk.trigger("blurChart", node, event);
node.trigger("blurChart", event);
};
node.activate = function () {
if (!node) return;
node.updateAttribute("active", true);
sdk.trigger("active", node, true);
node.trigger("active", true);
};
node.deactivate = function () {
if (!node) return;
node.updateAttribute("active", false);
sdk.trigger("active", node, false);
node.trigger("active", false);
};
node.getFirstEntry = function () {
return node.getAttribute("firstEntry");
};
node.getUnits = function () {
if (!node) return;
var _node$getAttributes4 = node.getAttributes(),
units = _node$getAttributes4.units;
return units;
};
node.getApplicableNodes = function (attributes, options) {
if (!node) return [];
if (!node.match(attributes)) return [node];
var ancestor = node.getAncestor(attributes);
if (!ancestor) return [node];
return ancestor.getNodes(attributes, options);
};
node.stopAutofetch = function () {
var force = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;
clearTimeout(fetchTimeoutId);
if (!node || !force) return;
if (!node.getAttribute("active") && node.getAttribute("loaded") && node.getAttribute("loading")) {
node.cancelFetch();
}
};
(0, _makeDimensions["default"])(node, sdk);
(0, _makeDataFetch["default"])(node, sdk);
(0, _makeWeights["default"])(node, sdk);
node.type = "chart";
(0, _makeGetUnitSign.makeGetUnitAttributesForValue)(node);
(0, _makeGetUnitSign["default"])(node);
node.track = makeTrack(node);
var _makeKeyboardListener = (0, _makeKeyboardListener2["default"])(),
onKeyChange = _makeKeyboardListener.onKeyChange,
initKeyboardListener = _makeKeyboardListener.initKeyboardListener,
clearKeyboardListener = _makeKeyboardListener.clearKeyboardListener;
onKeyChange(["Alt", "Shift", "KeyF"], function () {
if (!node) return;
node.updateAttribute("fullscreen", !node.getAttribute("fullscreen"));
});
onKeyChange(["Alt", "Shift", "KeyR"], function () {
if (!node) return;
node.resetNavigation();
});
node.onAttributeChange("autofetch", function (autofetch) {
if (!node) return;
if (autofetch) {
node.startAutofetch();
} else {
node.stopAutofetch(false);
}
});
node.onAttributeChange("active", function (active) {
if (!node) return;
if (!active) return node.stopAutofetch();
if (node.getAttribute("autofetch")) return node.startAutofetch();
});
node.onAttributeChange("focused", function (focused) {
if (!node) return;
focused ? initKeyboardListener() : clearKeyboardListener();
node.invalidateClosestRowCache();
});
node.onAttributeChange("fullscreen", function (fullscreen) {
if (!node) return;
sdk.trigger("fullscreen", node, fullscreen);
});
node.makeChartUI = function (uiName) {
var chartLibrary = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : node.getAttribute("chartLibrary");
var force = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
if (!(chartLibrary in sdk.ui)) console.error("Chart library \"".concat(chartLibrary, "\" does not exist in ").concat(Object.keys(sdk.ui).join(", ")));
if (node.getUI(uiName) && !force) return;
var makeChartLibrary = sdk.ui[chartLibrary];
var chartUi = makeChartLibrary(sdk, node);
node.setUI(chartUi, uiName);
};
node.makeSubChart = function () {
var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
var subChart = sdk.makeChartCore(options);
var chartUi = sdk.makeChartUI(subChart);
subChart.setUI(chartUi, "default");
return subChart;
};
node.getThemeIndex = function () {
if (!node) return;
return themeIndex[node.getAttribute("theme")] || themeIndex["default"];
};
node.getThemeAttribute = function (name) {
var _attributes$name;
if (!node) return;
var attributes = node.getAttributes();
var index = node.getThemeIndex();
return ((_attributes$name = attributes[name]) === null || _attributes$name === void 0 ? void 0 : _attributes$name[index]) || name;
};
node.getNodeIdsForHostLabels = function (fallback) {
var _node$getAttributes5 = node.getAttributes(),
selectedNodeLabelsFilter = _node$getAttributes5.selectedNodeLabelsFilter,
nodesScope = _node$getAttributes5.nodesScope,
nodes = _node$getAttributes5.nodes,
nodesById = _node$getAttributes5.nodesById;
var byLabel = (selectedNodeLabelsFilter || []).reduce(function (h, label) {
var _label$split = label.split("|"),
_label$split2 = _slicedToArray(_label$split, 2),
key = _label$split2[0],
value = _label$split2[1];
if (!h[key]) h[key] = [];
h[key].push(value);
return h;
}, {});
var dbNodeIds = Object.keys(nodes);
var nodeIds = dbNodeIds.length ? dbNodeIds : nodesScope.length ? nodesScope : nodesById ? Object.keys(nodesById) : [];
if (!nodesById) return fallback !== null && fallback !== void 0 ? fallback : nodeIds;
return nodeIds.filter(function (id) {
return !!nodesById[id] && Object.keys(byLabel).every(function (label) {
return byLabel[label].length ? "".concat(byLabel[label]).includes(nodesById[id].labels[label]) : false;
});
});
};
node.getFilteredNodeIds = function () {
var _node$getAttributes6 = node.getAttributes(),
selectedNodeLabelsFilter = _node$getAttributes6.selectedNodeLabelsFilter,
nodesById = _node$getAttributes6.nodesById,
selectedNodes = _node$getAttributes6.selectedNodes;
if (!(selectedNodeLabelsFilter !== null && selectedNodeLabelsFilter !== void 0 && selectedNodeLabelsFilter.length) || !nodesById) return selectedNodes;
var nodeIdsForHostLabels = node.getNodeIdsForHostLabels();
return _toConsumableArray(new Set([].concat(_toConsumableArray(selectedNodes), _toConsumableArray(nodeIdsForHostLabels))));
};
node.getFilteredAvailableNodeIds = function () {
var selectedNodes = node.getFilteredNodeIds();
var dataNodes = node.getAttribute("nodes") || {};
var dataNodeIds = Object.keys(dataNodes);
if (!(selectedNodes !== null && selectedNodes !== void 0 && selectedNodes.length)) return dataNodeIds.length ? dataNodeIds : undefined;
return selectedNodes.filter(function (nodeId) {
return dataNodeIds.includes(nodeId);
});
};
var destroy = function destroy() {
if (!node) return;
if (executeLatest) executeLatest.clear();
node.destroy();
node.stopAutofetch();
clearKeyboardListener();
Object.keys(uiInstances).forEach(function (uiName) {
return uiInstances[uiName].unmount();
});
setTimeout(function () {
uiInstances = null;
node = null;
}, 2000);
};
node.intl = function (key) {
var _en$key, _en$key2;
var _ref5 = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
_ref5$count = _ref5.count,
count = _ref5$count === void 0 ? 1 : _ref5$count,
_ref5$pluralize = _ref5.pluralize,
pluralize = _ref5$pluralize === void 0 ? true : _ref5$pluralize,
_ref5$fallback = _ref5.fallback,
fallback = _ref5$fallback === void 0 ? "" : _ref5$fallback;
if (!node) return key;
var en = node.getAttribute("en");
if (!(en !== null && en !== void 0 && en[key])) return count === 1 ? fallback || key : pluralize ? "".concat(fallback || key, "s") : fallback || key;
if (typeof en[key] === "string") return en[key];
return count === 1 ? ((_en$key = en[key]) === null || _en$key === void 0 ? void 0 : _en$key.one) || key : ((_en$key2 = en[key]) === null || _en$key2 === void 0 ? void 0 : _en$key2.other) || (pluralize ? "".concat(key, "s") : key);
};
node.setAttribute("aggregationMethod", attributes.aggregationMethod || (0, _getAggregateMethod["default"])(node));
return _objectSpread(_objectSpread(_objectSpread({}, node), (0, _makeControllers["default"])(node)), {}, {
destroy: destroy,
onKeyChange: onKeyChange,
sdk: sdk
});
};