Skip to content

Commit 49d3f61

Browse files
jaapmarcusjaapmarcus
authored
Feature/2859 Replace RRD image with chartjs (hestiacp#3045)
* Add support for rrd-tool export * Include chartjs * Fix include path chartjs * Fix behaviour mysql, postgresql and ethernet ports behaviour * Disable timer We should be able rewrite / remove parts of it when done... * Replace RRD images with chartjs * Use day / week / year instead daily weekly and yearly * Disable linting for 3rd part libary * Move libraries to /js/vendor/ Some as still hard code in init.js and app.js * Update .eslintignore
1 parent 4210688 commit 49d3f61

File tree

16 files changed

+309
-33
lines changed

16 files changed

+309
-33
lines changed

‎bin/v-export-rrd‎

Lines changed: 196 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,196 @@
1+
#!/bin/bash
2+
# info: export rrd charts as json
3+
# options: [CHART] [TIMESPAN]
4+
#
5+
# example: v-export-rrd chart format
6+
7+
#----------------------------------------------------------#
8+
# Variables & Functions #
9+
#----------------------------------------------------------#
10+
11+
chart=$1
12+
timespan=${2-hour}
13+
14+
# Includes
15+
# shellcheck source=/etc/hestiacp/hestia.conf
16+
source /etc/hestiacp/hestia.conf
17+
# shellcheck source=/usr/local/hestia/func/main.sh
18+
source $HESTIA/func/main.sh
19+
# load config file
20+
source_conf "$HESTIA/conf/hestia.conf"
21+
22+
#----------------------------------------------------------#
23+
# Verifications #
24+
#----------------------------------------------------------#
25+
26+
check_args '1' "$#" 'chart'
27+
28+
#----------------------------------------------------------#
29+
# Action #
30+
#----------------------------------------------------------#
31+
32+
function generate_load_table () {
33+
rrdtool xport --json -s $start -e $end --step $step \
34+
DEF:la=$RRD/la/la.rrd:LA:AVERAGE \
35+
DEF:pr=$RRD/la/la.rrd:PR:AVERAGE \
36+
XPORT:la:load \
37+
XPORT:pr:Proccess
38+
}
39+
40+
function generate_mem_table () {
41+
rrdtool xport --json -s $start -e $end --step $step \
42+
DEF:used=$RRD/mem/mem.rrd:RAM:AVERAGE \
43+
DEF:swap=$RRD/mem/mem.rrd:SWAP:AVERAGE \
44+
DEF:free=$RRD/mem/mem.rrd:FREE:AVERAGE \
45+
XPORT:used:Used \
46+
XPORT:swap:Swap \
47+
XPORT:free:Free
48+
}
49+
50+
function generate_apache2_table () {
51+
rrdtool xport --json -s $start -e $end --step $step \
52+
DEF:a=$RRD/web/apache2.rrd:A:AVERAGE \
53+
XPORT:a:Connections
54+
}
55+
56+
function generate_httpd_table () {
57+
rrdtool xport --json -s $start -e $end --step $step \
58+
DEF:a=$RRD/web/httpd.rrd:A:AVERAGE \
59+
XPORT:a:Connections
60+
}
61+
62+
function generate_nginx_table () {
63+
rrdtool xport --json -s $start -e $end --step $step \
64+
DEF:a=$RRD/web/nginx.rrd:A:AVERAGE \
65+
XPORT:a:Connections
66+
}
67+
68+
function generate_ftp_table () {
69+
rrdtool xport --json -s $start -e $end --step $step \
70+
DEF:a=$RRD/ftp/ftp.rrd:A:AVERAGE \
71+
XPORT:a:Connections
72+
}
73+
74+
function generate_ssh_table () {
75+
rrdtool xport --json -s $start -e $end --step $step \
76+
DEF:a=$RRD/ssh/ssh.rrd:A:AVERAGE \
77+
XPORT:a:Connections
78+
}
79+
80+
function generate_mysql_table () {
81+
if [ -f "$RRD/db/mysql_$host.rrd" ]; then
82+
rrdtool xport --json -s $start -e $end --step $step \
83+
DEF:a=$RRD/db/mysql_$host.rrd:A:AVERAGE \
84+
DEF:s=$RRD/db/mysql_$host.rrd:S:AVERAGE \
85+
XPORT:a:Queries \
86+
XPORT:s:Slow
87+
else
88+
echo "Does not exists";
89+
exit 1;
90+
fi
91+
}
92+
93+
function generate_pgsql_table () {
94+
if [ -f "$RRD/db/pgsql_$host.rrd" ]; then
95+
rrdtool xport --json -s $start -e $end --step $step \
96+
DEF:a=$RRD/db/pgsql_$host.rrd:A:AVERAGE \
97+
DEF:t=$RRD/db/pgsql_$host.rrd:T:AVERAGE \
98+
XPORT:a:Queries \
99+
XPORT:t:Transactions
100+
else
101+
echo "Does not exists";
102+
exit 1;
103+
fi
104+
}
105+
106+
function generate_mail_table () {
107+
rrdtool xport --json -s $start -e $end --step $step \
108+
DEF:a=$RRD/mail/mail.rrd:A:AVERAGE \
109+
XPORT:a:Emails
110+
}
111+
112+
function generate_net_table () {
113+
if [ -f "$RRD/net/$host.rrd" ]; then
114+
rrdtool xport --json -s $start -e $end --step $step \
115+
DEF:inoctets=$RRD/net/$host.rrd:RX:AVERAGE \
116+
DEF:outoctets=$RRD/net/$host.rrd:TX:AVERAGE \
117+
XPORT:inoctets:"Input (rx)" \
118+
XPORT:outoctets:"Output (rx)"
119+
else
120+
echo "Does not exists";
121+
exit 1;
122+
fi
123+
}
124+
125+
126+
127+
if [ "$timespan" = "week" ]; then
128+
start=$(date -d "7 days ago" +%s);
129+
# every 30 min
130+
step=3600
131+
elif [ "$timespan" = "month" ]; then
132+
start=$(date -d "1 month ago" +%s);
133+
step=21600
134+
elif [ "$timespan" = "year" ]; then
135+
start=$(date -d "1 year ago" +%s);
136+
step=172800
137+
else
138+
start=$(date -d "1 day ago" +%s);
139+
# every 5min
140+
step=300
141+
fi
142+
end=$(date +%s)
143+
144+
host=$(echo $chart | cut -d'_' -f2 );
145+
chart=$(echo $chart | cut -d'_' -f1 );
146+
147+
case $chart in
148+
"la")
149+
generate_load_table
150+
;;
151+
152+
"mem")
153+
generate_mem_table
154+
;;
155+
156+
"apache2")
157+
generate_apache2_table
158+
;;
159+
160+
"httpd")
161+
generate_httpd_table
162+
;;
163+
164+
"nginx")
165+
generate_nginx_table
166+
;;
167+
168+
"ftp")
169+
generate_ftp_table
170+
;;
171+
172+
"ssh")
173+
generate_ssh_table
174+
;;
175+
176+
"mysql")
177+
generate_mysql_table
178+
;;
179+
180+
"pgsql")
181+
generate_pgsql_table
182+
;;
183+
184+
"mail")
185+
generate_mail_table
186+
;;
187+
188+
"net")
189+
generate_net_table
190+
;;
191+
192+
193+
*)
194+
echo "Does not exists";
195+
exit 1;
196+
esac

‎web/.eslintignore‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
js/jquery/*.js
1+
js/vendor/

‎web/js/events.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -208,7 +208,7 @@ VE.helpers.toggleHiddenPasswordText = function(ref, triggering_elm) {
208208
var reloadTimer = 150;
209209
var reloadFunction = '';
210210

211-
$(document).ready(startTime);
211+
//$(document).ready(startTime);
212212
function startTime(){
213213
if ($(".spinner")[0]){
214214
reloadFunction = setInterval(updateInterval, 100);

‎web/js/pages/list_rrd.js‎

Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
// Default max of 3 lines are drawn for memory. Colors need to be update to work better
2+
colors=['rgba(255,52,120,0.5)','rgba(255,52,0,0.5)','rgba(255,255,120,0.5)'];
3+
// Other markups are working see https://www.chartjs.org/docs/latest/
4+
5+
//todo make charts reponsive
6+
$(document).ready( function(){
7+
$('canvas').each(function(){
8+
9+
$.post('/list/rrd/ajax.php',{service:$(this).attr('id'),period:$(this).attr('period')}, function(response){
10+
labels=[];
11+
//data is stored as start, end time and step between each step
12+
for(i = response.meta.start; i < response.meta.end; i=i + response.meta.step){
13+
labels.push(new Date(i * 1000).toLocaleString());
14+
}
15+
datasets = [];
16+
//response.data stores data as i[x,y] useless for chartjs split in separate datasets
17+
for(i = 0; i < response.meta.legend.length; i++){
18+
data=[];
19+
for( b of response.data){
20+
data.push(b[i]);
21+
}
22+
dataset={label: response.meta.legend[i], data: data, borderColor: colors[i]};
23+
datasets.push(dataset);
24+
}
25+
//draw chart
26+
const ctx = document.getElementById(response.service).getContext('2d');
27+
const myChart = new Chart(ctx, {
28+
type: 'line',
29+
data: {
30+
labels: labels,
31+
datasets: datasets
32+
},
33+
options: {
34+
scales: {
35+
y: {
36+
beginAtZero: true
37+
}
38+
}
39+
}
40+
});
41+
},'json');
42+
});
43+
})

‎web/js/vendor/chart.min.js‎

Lines changed: 13 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

web/inc/jquery/jquery-3.6.1.min.js renamed to web/js/vendor/jquery/jquery-3.6.1.min.js

File renamed without changes.

web/js/jquery/jquery-ui.min.js renamed to web/js/vendor/jquery/jquery-ui.min.js

File renamed without changes.

web/js/jquery/jquery.cookie.js renamed to web/js/vendor/jquery/jquery.cookie.js

File renamed without changes.

web/js/jquery/jquery.finder.js renamed to web/js/vendor/jquery/jquery.finder.js

File renamed without changes.

‎web/list/rrd/ajax.php‎

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
<?php
2+
use function Hestiacp\quoteshellarg\quoteshellarg;
3+
// Main include
4+
include($_SERVER['DOCUMENT_ROOT']."/inc/main.php");
5+
6+
// Check user
7+
if ($_SESSION['userContext'] != 'admin') {
8+
header('Location: /list/user');
9+
exit;
10+
}
11+
12+
if (empty($_POST['period'])) {
13+
$period = "daily";
14+
} else {
15+
if (in_array($_POST['period'] ,array('day', 'week','month','year'))) {
16+
$period=$_POST['period'];
17+
} else {
18+
$period = "daily";
19+
}
20+
}
21+
22+
if (empty($_POST['service'])) {
23+
$service = "la";
24+
} else {
25+
$service = $_POST['service'];
26+
}
27+
28+
// Data
29+
exec(HESTIA_CMD."v-export-rrd ".quoteshellarg($service)." ".quoteshellarg($period), $output, $return_var);
30+
$data = json_decode(implode('', $output), true);
31+
$data['service'] = $service;
32+
echo json_encode($data);

0 commit comments

Comments
 (0)