DGNum/gestioCOF
13
2
Fork 1
Code Issues 77 Pull requests 14 Packages Projects Releases 12 Wiki Activity

Simplify statistic.js

Browse source 
On supprime des fonctions inutiles, on lint, et on simplifie 2-3 options
inutilisées.
This commit is contained in:
Ludovic Stephan 2020-03-09 16:19:06 +01:00
parent 48ad5cd1c7
commit c66fb7eb6f
1 changed files with 41 additions and 67 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

108
kfet/static/kfet/js/statistic.js
View file

@ -1,28 +1,15 @@
(function($){ (function ($) {
window.StatsGroup = function (url, target) { window.StatsGroup = function (url, target) {
// a class to properly display statictics // a class to properly display statictics
// url : points to an ObjectResumeStat that lists the options through JSON // url : points to an ObjectResumeStat that lists the options through JSON
// target : element of the DOM where to put the stats // target : element of the DOM where to put the stats
var self = this;
var element = $(target); var element = $(target);
var content = $("<div class='full'>"); var content = $("<div class='full'>");
var buttons; var buttons;
function dictToArray (dict, start) { function handleTimeChart(data) {
// converts the dicts returned by JSONResponse to Arrays
// necessary because for..in does not guarantee the order
if (start === undefined) start = 0;
var array = new Array();
for (var k in dict) {
array[k] = dict[k];
}
array.splice(0, start);
return array;
}
function handleTimeChart (data) {
// reads the balance data and put it into chartjs formatting // reads the balance data and put it into chartjs formatting
chart_data = new Array(); chart_data = new Array();
for (var i = 0; i < data.length; i++) { for (var i = 0; i < data.length; i++) {
@ -36,7 +23,7 @@
return chart_data; return chart_data;
} }
function showStats () { function showStats() {
// CALLBACK : called when a button is selected // CALLBACK : called when a button is selected
// shows the focus on the correct button // shows the focus on the correct button
@ -44,24 +31,20 @@
$(this).addClass("focus"); $(this).addClass("focus");
// loads data and shows it // loads data and shows it
$.getJSON(this.stats_target_url, {format: 'json'}, displayStats); $.getJSON(this.stats_target_url, displayStats);
} }
function displayStats (data) { function displayStats(data) {
// reads the json data and updates the chart display // reads the json data and updates the chart display
var chart_datasets = []; var chart_datasets = [];
var charts = dictToArray(data.charts);
// are the points indexed by timestamps? // are the points indexed by timestamps?
var is_time_chart = data.is_time_chart || false; var is_time_chart = data.is_time_chart || false;
// reads the charts data // reads the charts data
for (var i = 0; i < charts.length; i++) { for (let chart of data.charts) {
var chart = charts[i];
// format the data // format the data
var chart_data = is_time_chart ? handleTimeChart(chart.values) : dictToArray(chart.values, 0); var chart_data = is_time_chart ? handleTimeChart(chart.values) : chart.values;
chart_datasets.push( chart_datasets.push(
{ {
@ -76,29 +59,24 @@
// options for chartjs // options for chartjs
var chart_options = var chart_options =
{ {
responsive: true, responsive: true,
maintainAspectRatio: false, maintainAspectRatio: false,
tooltips: { tooltips: {
mode: 'index', mode: 'index',
intersect: false, intersect: false,
}, },
hover: { hover: {
mode: 'nearest', mode: 'nearest',
intersect: false, intersect: false,
} }
}; };
// additionnal options for time-indexed charts // additionnal options for time-indexed charts
if (is_time_chart) { if (is_time_chart) {
chart_options['scales'] = { chart_options['scales'] = {
xAxes: [{ xAxes: [{
type: "time", type: "time",
display: true,
scaleLabel: {
display: false,
labelString: 'Date'
},
time: { time: {
tooltipFormat: 'll HH:mm', tooltipFormat: 'll HH:mm',
displayFormats: { displayFormats: {
@ -115,26 +93,19 @@
} }
}], }],
yAxes: [{
display: true,
scaleLabel: {
display: false,
labelString: 'value'
}
}]
}; };
} }
// global object for the options // global object for the options
var chart_model = var chart_model =
{ {
type: 'line', type: 'line',
options: chart_options, options: chart_options,
data: { data: {
labels: data.labels || [], labels: data.labels || [],
datasets: chart_datasets, datasets: chart_datasets,
} }
}; };
// saves the previous charts to be destroyed // saves the previous charts to be destroyed
var prev_chart = content.children(); var prev_chart = content.children();
@ -151,23 +122,26 @@
} }
// initialize the interface // initialize the interface
function initialize (data) { function initialize(data) {
// creates the bar with the buttons // creates the bar with the buttons
buttons = $("<ul>", buttons = $("<ul>",
{class: "nav stat-nav", {
"aria-label": "select-period"}); class: "nav stat-nav",
"aria-label": "select-period"
});
var to_click; var to_click;
var context = data.stats;
for (var i = 0; i < context.length; i++) { for (let stat of data.stats) {
// creates the button // creates the button
var btn_wrapper = $("<li>", {role:"presentation"}); var btn_wrapper = $("<li>", { role: "presentation" });
var btn = $("<a>", var btn = $("<a>",
{class: "btn btn-nav", {
type: "button"}) class: "btn btn-nav",
.text(context[i].label) type: "button"
.prop("stats_target_url", context[i].url) })
.text(stat.label)
.prop("stats_target_url", stat.url)
.on("click", showStats); .on("click", showStats);
// saves the default option to select // saves the default option to select
@ -189,7 +163,7 @@
// constructor // constructor
(function () { (function () {
$.getJSON(url, {format: 'json'}, initialize); $.getJSON(url, initialize);
})(); })();
}; };
})(jQuery); })(jQuery);