Nemcio/NodeBB
1
0
Fork 0
mirror of https://github.com/NodeBB/NodeBB.git synced 2025-11-02 12:05:57 +01:00
Code Issues Packages Projects Releases Wiki Activity

refactor: have Graph.init and Graph.update return promises

Browse Source
This commit is contained in:
Julian Lam
2021-02-23 15:17:09 -05:00
parent f8e1a74c26
commit 3fa2e3cef2
1 changed files with 81 additions and 67 deletions
Download Patch File Download Diff File Expand all files Collapse all files

148
public/src/admin/modules/dashboard-line-graph.js
View File

@@ -1,6 +1,6 @@
'use strict'; 'use strict';
define('admin/modules/dashboard-line-graph', ['Chart', 'translator', 'benchpress', 'api'], function (Chart, translator, Benchpress, api) { define('admin/modules/dashboard-line-graph', ['Chart', 'translator', 'benchpress', 'api', 'hooks'], function (Chart, translator, Benchpress, api, hooks) {
const Graph = { const Graph = {
_current: null, _current: null,
}; };
@@ -16,62 +16,70 @@ define('admin/modules/dashboard-line-graph', ['Chart', 'translator', 'benchpress
Chart.defaults.global.tooltips.enabled = false; Chart.defaults.global.tooltips.enabled = false;
} }
Graph.handleUpdateControls({ set });
var t = translator.Translator.create(); var t = translator.Translator.create();
t.translateKey(`admin/menu:${ajaxify.data.template.name.replace('admin/', '')}`, []).then((key) => { return new Promise((resolve) => {
const data = { t.translateKey(`admin/menu:${ajaxify.data.template.name.replace('admin/', '')}`, []).then((key) => {
labels: trafficLabels, const data = {
datasets: [ labels: trafficLabels,
{ datasets: [
label: key, {
backgroundColor: 'rgba(151,187,205,0.2)', label: key,
borderColor: 'rgba(151,187,205,1)', backgroundColor: 'rgba(151,187,205,0.2)',
pointBackgroundColor: 'rgba(151,187,205,1)', borderColor: 'rgba(151,187,205,1)',
pointHoverBackgroundColor: 'rgba(151,187,205,1)', pointBackgroundColor: 'rgba(151,187,205,1)',
pointBorderColor: '#fff', pointHoverBackgroundColor: 'rgba(151,187,205,1)',
pointHoverBorderColor: 'rgba(151,187,205,1)', pointBorderColor: '#fff',
data: dataset || [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0], pointHoverBorderColor: 'rgba(151,187,205,1)',
}, data: dataset || [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
], },
}; ],
};
canvas.width = $(canvas).parent().width(); canvas.width = $(canvas).parent().width();
data.datasets[0].yAxisID = 'left-y-axis'; data.datasets[0].yAxisID = 'left-y-axis';
Graph._current = new Chart(canvasCtx, { Graph._current = new Chart(canvasCtx, {
type: 'line', type: 'line',
data: data, data: data,
options: { options: {
responsive: true, responsive: true,
legend: { legend: {
display: true, display: true,
},
scales: {
yAxes: [{
id: 'left-y-axis',
ticks: {
beginAtZero: true,
precision: 0,
},
type: 'linear',
position: 'left',
scaleLabel: {
display: true,
labelString: key,
},
}],
},
tooltips: {
mode: 'x',
},
}, },
scales: { });
yAxes: [{
id: 'left-y-axis', if (!dataset) {
ticks: { Graph.update(set).then(resolve);
beginAtZero: true, } else {
precision: 0, resolve(Graph._current);
}, }
type: 'linear',
position: 'left',
scaleLabel: {
display: true,
labelString: key,
},
}],
},
tooltips: {
mode: 'x',
},
},
}); });
if (!dataset) {
Graph.update(set);
}
}); });
};
Graph.handleUpdateControls = ({ set }) => {
$('[data-action="updateGraph"]:not([data-units="custom"])').on('click', function () { $('[data-action="updateGraph"]:not([data-units="custom"])').on('click', function () {
var until = new Date(); var until = new Date();
var amount = $(this).attr('data-amount'); var amount = $(this).attr('data-amount');
@@ -151,29 +159,35 @@ define('admin/modules/dashboard-line-graph', ['Chart', 'translator', 'benchpress
amount = ajaxify.data.query.count amount = ajaxify.data.query.count
) => { ) => {
if (!Graph._current) { if (!Graph._current) {
return; return Promise.reject(new Error('[[error:invalid-data]]'));
} }
api.get(`/admin/analytics/${set}`, { units, until, amount }).then((dataset) => { return new Promise((resolve) => {
if (units === 'days') { api.get(`/admin/analytics/${set}`, { units, until, amount }).then((dataset) => {
Graph._current.data.xLabels = utils.getDaysArray(until, amount); if (units === 'days') {
} else { Graph._current.data.xLabels = utils.getDaysArray(until, amount);
Graph._current.data.xLabels = utils.getHoursArray(); } else {
} Graph._current.data.xLabels = utils.getHoursArray();
}
Graph._current.data.datasets[0].data = dataset; Graph._current.data.datasets[0].data = dataset;
Graph._current.data.labels = Graph._current.data.xLabels; Graph._current.data.labels = Graph._current.data.xLabels;
Graph._current.update(); Graph._current.update();
// Update address bar and "View as JSON" button url // Update address bar and "View as JSON" button url
var apiEl = $('#view-as-json'); var apiEl = $('#view-as-json');
var newHref = $.param({ var newHref = $.param({
units: units || 'hours', units: units || 'hours',
until: until, until: until,
count: amount, count: amount,
});
apiEl.attr('href', `${config.relative_path}/api/v3/admin/analytics/${ajaxify.data.set}?${newHref}`);
ajaxify.updateHistory(`${ajaxify.data.url.slice(1)}?${newHref}`, true);
hooks.fire('action:admin.dashboard.updateGraph', {
graph: Graph._current,
});
resolve(Graph._current);
}); });
apiEl.attr('href', `${config.relative_path}/api/v3/admin/analytics/${ajaxify.data.set}?${newHref}`);
ajaxify.updateHistory(`${ajaxify.data.url.slice(1)}?${newHref}`, true);
}); });
}; };