2019-05-17 08:40:41 +00:00
|
|
|
function memStuff(window, document, Chartist) {
|
|
|
|
'use strict';
|
2018-02-22 02:27:17 +00:00
|
|
|
|
2019-05-17 08:40:41 +00:00
|
|
|
Chartist.plugins = Chartist.plugins || {};
|
|
|
|
Chartist.plugins.byteUnits = function(options) {
|
|
|
|
options = Chartist.extend({}, {}, options);
|
|
|
|
|
|
|
|
return function byteUnits(chart) {
|
|
|
|
if(!chart instanceof Chartist.Line) return;
|
|
|
|
|
|
|
|
chart.on('created', function() {
|
|
|
|
console.log("running created")
|
|
|
|
const vbits = document.getElementsByClassName("ct-vertical");
|
|
|
|
if(vbits==null) return;
|
|
|
|
|
|
|
|
let tbits = [];
|
|
|
|
for(let i = 0; i < vbits.length; i++) {
|
|
|
|
tbits[i] = vbits[i].innerHTML;
|
|
|
|
}
|
|
|
|
console.log("tbits:",tbits);
|
|
|
|
|
|
|
|
const calc = (places) => {
|
|
|
|
if(places==3) return;
|
|
|
|
|
|
|
|
const matcher = vbits[0].innerHTML;
|
|
|
|
let allMatch = true;
|
|
|
|
for(let i = 0; i < tbits.length; i++) {
|
|
|
|
let val = convertByteUnit(tbits[i], places);
|
|
|
|
if(val!=matcher) allMatch = false;
|
|
|
|
vbits[i].innerHTML = val;
|
|
|
|
}
|
|
|
|
|
|
|
|
if(allMatch) calc(places + 1);
|
|
|
|
}
|
|
|
|
calc(0);
|
|
|
|
});
|
|
|
|
};
|
|
|
|
};
|
|
|
|
}
|
2018-02-22 02:27:17 +00:00
|
|
|
|
2020-02-23 09:08:47 +00:00
|
|
|
function perfStuff(window, document, Chartist) {
|
|
|
|
'use strict';
|
|
|
|
|
|
|
|
Chartist.plugins = Chartist.plugins || {};
|
|
|
|
Chartist.plugins.perfUnits = function(options) {
|
|
|
|
options = Chartist.extend({}, {}, options);
|
|
|
|
|
|
|
|
return function perfUnits(chart) {
|
|
|
|
if(!chart instanceof Chartist.Line) return;
|
|
|
|
|
|
|
|
chart.on('created', function() {
|
|
|
|
console.log("running created")
|
|
|
|
const vbits = document.getElementsByClassName("ct-vertical");
|
|
|
|
if(vbits==null) return;
|
|
|
|
|
|
|
|
let tbits = [];
|
|
|
|
for(let i = 0; i < vbits.length; i++) {
|
|
|
|
tbits[i] = vbits[i].innerHTML;
|
|
|
|
}
|
|
|
|
console.log("tbits:",tbits);
|
|
|
|
|
|
|
|
const calc = (places) => {
|
|
|
|
if(places==3) return;
|
|
|
|
|
|
|
|
const matcher = vbits[0].innerHTML;
|
|
|
|
let allMatch = true;
|
|
|
|
for(let i = 0; i < tbits.length; i++) {
|
|
|
|
let val = convertPerfUnit(tbits[i], places);
|
|
|
|
if(val!=matcher) allMatch = false;
|
|
|
|
vbits[i].innerHTML = val;
|
|
|
|
}
|
|
|
|
|
|
|
|
if(allMatch) calc(places + 1);
|
|
|
|
}
|
|
|
|
calc(0);
|
|
|
|
});
|
|
|
|
};
|
|
|
|
};
|
|
|
|
}
|
|
|
|
|
2019-05-01 06:59:51 +00:00
|
|
|
const Kilobyte = 1024;
|
|
|
|
const Megabyte = Kilobyte * 1024;
|
|
|
|
const Gigabyte = Megabyte * 1024;
|
|
|
|
const Terabyte = Gigabyte * 1024;
|
|
|
|
const Petabyte = Terabyte * 1024;
|
|
|
|
|
2019-05-03 08:34:18 +00:00
|
|
|
function convertByteUnit(bytes, places = 0) {
|
|
|
|
let out;
|
|
|
|
if(bytes >= Petabyte) out = [bytes / Petabyte, "PB"];
|
|
|
|
else if(bytes >= Terabyte) out = [bytes / Terabyte, "TB"];
|
|
|
|
else if(bytes >= Gigabyte) out = [bytes / Gigabyte, "GB"];
|
|
|
|
else if(bytes >= Megabyte) out = [bytes / Megabyte, "MB"];
|
|
|
|
else if(bytes >= Kilobyte) out = [bytes / Kilobyte, "KB"];
|
|
|
|
else out = [bytes,"b"];
|
|
|
|
|
|
|
|
if(places==0) return Math.ceil(out[0]) + out[1];
|
|
|
|
else {
|
|
|
|
let ex = Math.pow(10, places);
|
|
|
|
return (Math.round(out[0], ex) / ex) + out[1];
|
|
|
|
}
|
2019-05-01 06:59:51 +00:00
|
|
|
}
|
|
|
|
|
2020-02-23 09:08:47 +00:00
|
|
|
let ms = 1000;
|
|
|
|
let sec = ms * 1000;
|
|
|
|
let min = sec * 60;
|
|
|
|
let hour = min * 60;
|
|
|
|
let day = hour * 24;
|
|
|
|
function convertPerfUnit(quan, places = 0) {
|
|
|
|
let out;
|
|
|
|
if(quan >= day) out = [quan / day, "d"];
|
|
|
|
else if(quan >= hour) out = [quan / hour, "h"];
|
|
|
|
else if(quan >= min) out = [quan / min, "m"];
|
|
|
|
else if(quan >= sec) out = [quan / sec, "s"];
|
|
|
|
else if(quan >= ms) out = [quan / ms, "ms"];
|
|
|
|
else out = [quan,"μs"];
|
|
|
|
|
|
|
|
if(places==0) return Math.ceil(out[0]) + out[1];
|
|
|
|
else {
|
|
|
|
let ex = Math.pow(10, places);
|
|
|
|
return (Math.round(out[0], ex) / ex) + out[1];
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2019-02-23 06:29:19 +00:00
|
|
|
// TODO: Fully localise this
|
|
|
|
// TODO: Load rawLabels and seriesData dynamically rather than potentially fiddling with nonces for the CSP?
|
2020-02-23 09:08:47 +00:00
|
|
|
function buildStatsChart(rawLabels, seriesData, timeRange, legendNames, typ=0) {
|
2019-03-16 12:50:31 +00:00
|
|
|
console.log("buildStatsChart");
|
2019-05-08 05:26:38 +00:00
|
|
|
console.log("seriesData:",seriesData);
|
2018-02-22 02:27:17 +00:00
|
|
|
let labels = [];
|
2019-03-03 02:28:17 +00:00
|
|
|
let aphrases = phraseBox["analytics"];
|
2019-02-24 01:29:06 +00:00
|
|
|
if(timeRange=="one-year") {
|
2019-03-03 02:28:17 +00:00
|
|
|
labels = [aphrases["analytics.now"],"1" + aphrases["analytics.months_short"]];
|
2019-02-24 01:29:06 +00:00
|
|
|
for(let i = 2; i < 12; i++) {
|
2019-05-01 06:59:51 +00:00
|
|
|
labels.push(i + aphrases["analytics.months_short"]);
|
2019-02-24 01:29:06 +00:00
|
|
|
}
|
|
|
|
} else if(timeRange=="three-months") {
|
2019-03-03 02:28:17 +00:00
|
|
|
labels = [aphrases["analytics.now"],"3" + aphrases["analytics.days_short"]]
|
|
|
|
for(let i = 6; i < 90; i = i + 3) {
|
2019-05-08 05:56:18 +00:00
|
|
|
if (i%2==0) labels.push("");
|
|
|
|
else labels.push(i + aphrases["analytics.days_short"]);
|
2019-02-24 01:29:06 +00:00
|
|
|
}
|
|
|
|
} else if(timeRange=="one-month") {
|
2019-03-03 02:28:17 +00:00
|
|
|
labels = [aphrases["analytics.now"],"1" + aphrases["analytics.days_short"]];
|
2018-02-22 02:27:17 +00:00
|
|
|
for(let i = 2; i < 30; i++) {
|
2019-05-08 05:56:18 +00:00
|
|
|
if (i%2==0) labels.push("");
|
|
|
|
else labels.push(i + aphrases["analytics.days_short"]);
|
2018-02-22 02:27:17 +00:00
|
|
|
}
|
|
|
|
} else if(timeRange=="one-week") {
|
2019-03-03 02:28:17 +00:00
|
|
|
labels = [aphrases["analytics.now"]];
|
2018-02-22 02:27:17 +00:00
|
|
|
for(let i = 2; i < 14; i++) {
|
|
|
|
if (i%2==0) labels.push("");
|
2019-03-03 02:28:17 +00:00
|
|
|
else labels.push(Math.floor(i/2) + aphrases["analytics.days"]);
|
2018-02-22 02:27:17 +00:00
|
|
|
}
|
2019-05-08 05:56:18 +00:00
|
|
|
} else if (timeRange=="two-days" || timeRange == "one-day" || timeRange == "twelve-hours") {
|
|
|
|
for(const i in rawLabels) {
|
|
|
|
if (i%2==0) {
|
|
|
|
labels.push("");
|
|
|
|
continue;
|
|
|
|
}
|
|
|
|
let date = new Date(rawLabels[i]*1000);
|
2019-12-31 21:57:54 +00:00
|
|
|
console.log("date:", date);
|
2019-05-08 05:56:18 +00:00
|
|
|
let minutes = "0" + date.getMinutes();
|
|
|
|
let label = date.getHours() + ":" + minutes.substr(-2);
|
|
|
|
console.log("label:", label);
|
|
|
|
labels.push(label);
|
|
|
|
}
|
2018-02-22 02:27:17 +00:00
|
|
|
} else {
|
|
|
|
for(const i in rawLabels) {
|
|
|
|
let date = new Date(rawLabels[i]*1000);
|
2019-12-31 21:57:54 +00:00
|
|
|
console.log("date:", date);
|
2018-02-22 02:27:17 +00:00
|
|
|
let minutes = "0" + date.getMinutes();
|
|
|
|
let label = date.getHours() + ":" + minutes.substr(-2);
|
|
|
|
console.log("label:", label);
|
|
|
|
labels.push(label);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
labels = labels.reverse()
|
2019-05-01 06:59:51 +00:00
|
|
|
for(let i = 0; i < seriesData.length; i++) {
|
2019-02-23 06:29:19 +00:00
|
|
|
seriesData[i] = seriesData[i].reverse();
|
|
|
|
}
|
2018-02-22 02:27:17 +00:00
|
|
|
|
2019-05-01 06:59:51 +00:00
|
|
|
let config = {height: '250px', plugins:[]};
|
2019-02-23 06:29:19 +00:00
|
|
|
if(legendNames.length > 0) config.plugins = [
|
2019-05-01 06:59:51 +00:00
|
|
|
Chartist.plugins.legend({legendNames: legendNames})
|
|
|
|
];
|
2020-02-23 09:08:47 +00:00
|
|
|
if(typ==1) config.plugins.push(Chartist.plugins.byteUnits());
|
|
|
|
else if(typ==2) config.plugins.push(Chartist.plugins.perfUnits());
|
2018-02-22 02:27:17 +00:00
|
|
|
Chartist.Line('.ct_chart', {
|
|
|
|
labels: labels,
|
2019-02-23 06:29:19 +00:00
|
|
|
series: seriesData,
|
|
|
|
}, config);
|
2019-03-21 22:59:41 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
runInitHook("analytics_loaded");
|