Skip to content

Commit ea2dc66

Browse files
MauricioFauthMauricioFauth
committed
Extract Functions.createProfilingChart() into a module
Signed-off-by: Maurício Meneghini Fauth <mauricio@fauth.dev>
1 parent 2cf3f49 commit ea2dc66

5 files changed

Lines changed: 79 additions & 81 deletions

File tree

‎js/src/modules/functions.js‎

Lines changed: 0 additions & 71 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,6 @@ import highlightSql from './sql-highlight.js';
99
import { ajaxRemoveMessage, ajaxShowMessage } from './ajax-message.js';
1010
import handleCreateViewModal from './functions/handleCreateViewModal.js';
1111

12-
/* global ChartType, ColumnType, DataTable, JQPlotChartFactory */ // js/chart.js
1312
/* global DatabaseStructure */ // js/database/structure.js
1413
/* global firstDayOfCalendar, maxInputVars, themeImagePath */ // templates/javascript/variables.twig
1514

@@ -1591,76 +1590,6 @@ Functions.showWarningForIntTypes = function () {
15911590
}
15921591
};
15931592

1594-
/**
1595-
* Creates a Profiling Chart. Used in sql.js
1596-
* and in server/status/monitor.js
1597-
*
1598-
* @param target
1599-
* @param data
1600-
*
1601-
* @return {object}
1602-
*/
1603-
Functions.createProfilingChart = function (target, data) {
1604-
// create the chart
1605-
var factory = new JQPlotChartFactory();
1606-
var chart = factory.createChart(ChartType.PIE, target);
1607-
1608-
// create the data table and add columns
1609-
var dataTable = new DataTable();
1610-
dataTable.addColumn(ColumnType.STRING, '');
1611-
dataTable.addColumn(ColumnType.NUMBER, '');
1612-
dataTable.setData(data);
1613-
1614-
var windowWidth = $(window).width();
1615-
var location = 's';
1616-
if (windowWidth > 768) {
1617-
location = 'se';
1618-
}
1619-
1620-
// draw the chart and return the chart object
1621-
chart.draw(dataTable, {
1622-
seriesDefaults: {
1623-
rendererOptions: {
1624-
showDataLabels: true
1625-
}
1626-
},
1627-
highlighter: {
1628-
tooltipLocation: 'se',
1629-
sizeAdjust: 0,
1630-
tooltipAxes: 'pieref',
1631-
formatString: '%s, %.9Ps'
1632-
},
1633-
legend: {
1634-
show: true,
1635-
location: location,
1636-
rendererOptions: {
1637-
numberColumns: 2
1638-
}
1639-
},
1640-
// from https://web.archive.org/web/20190321233412/http://tango.freedesktop.org/Tango_Icon_Theme_Guidelines
1641-
seriesColors: [
1642-
'#fce94f',
1643-
'#fcaf3e',
1644-
'#e9b96e',
1645-
'#8ae234',
1646-
'#729fcf',
1647-
'#ad7fa8',
1648-
'#ef2929',
1649-
'#888a85',
1650-
'#c4a000',
1651-
'#ce5c00',
1652-
'#8f5902',
1653-
'#4e9a06',
1654-
'#204a87',
1655-
'#5c3566',
1656-
'#a40000',
1657-
'#babdb6',
1658-
'#2e3436'
1659-
]
1660-
});
1661-
return chart;
1662-
};
1663-
16641593
/**
16651594
* Formats a profiling duration nicely (in us and ms time).
16661595
* Used in server/status/monitor.js

‎js/src/modules/functions/createProfilingChart.js‎

Lines changed: 73 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,73 @@
1+
import $ from 'jquery';
2+
3+
/* global ChartType, ColumnType, DataTable, JQPlotChartFactory */ // js/chart.js
4+
5+
/**
6+
* Creates a Profiling Chart. Used in sql.js
7+
* and in server/status/monitor.js
8+
*
9+
* @param {string} target
10+
* @param {any[]} data
11+
*
12+
* @return {object}
13+
*/
14+
export default function createProfilingChart (target, data) {
15+
// create the chart
16+
var factory = new JQPlotChartFactory();
17+
var chart = factory.createChart(ChartType.PIE, target);
18+
19+
// create the data table and add columns
20+
var dataTable = new DataTable();
21+
dataTable.addColumn(ColumnType.STRING, '');
22+
dataTable.addColumn(ColumnType.NUMBER, '');
23+
dataTable.setData(data);
24+
25+
var windowWidth = $(window).width();
26+
var location = 's';
27+
if (windowWidth > 768) {
28+
location = 'se';
29+
}
30+
31+
// draw the chart and return the chart object
32+
chart.draw(dataTable, {
33+
seriesDefaults: {
34+
rendererOptions: {
35+
showDataLabels: true
36+
}
37+
},
38+
highlighter: {
39+
tooltipLocation: 'se',
40+
sizeAdjust: 0,
41+
tooltipAxes: 'pieref',
42+
formatString: '%s, %.9Ps'
43+
},
44+
legend: {
45+
show: true,
46+
location: location,
47+
rendererOptions: {
48+
numberColumns: 2
49+
}
50+
},
51+
// from https://web.archive.org/web/20190321233412/http://tango.freedesktop.org/Tango_Icon_Theme_Guidelines
52+
seriesColors: [
53+
'#fce94f',
54+
'#fcaf3e',
55+
'#e9b96e',
56+
'#8ae234',
57+
'#729fcf',
58+
'#ad7fa8',
59+
'#ef2929',
60+
'#888a85',
61+
'#c4a000',
62+
'#ce5c00',
63+
'#8f5902',
64+
'#4e9a06',
65+
'#204a87',
66+
'#5c3566',
67+
'#a40000',
68+
'#babdb6',
69+
'#2e3436'
70+
]
71+
});
72+
return chart;
73+
}

‎js/src/server/status/monitor.js‎

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import { Functions } from '../../modules/functions.js';
44
import { CommonParams } from '../../modules/common.js';
55
import { Config } from '../../modules/config.js';
66
import tooltip from '../../modules/tooltip.js';
7+
import createProfilingChart from '../../modules/functions/createProfilingChart.js';
78

89
/**
910
* @fileoverview Javascript functions used in server status monitor page
@@ -2297,10 +2298,7 @@ AJAX.registerOnload('server/status/monitor.js', function () {
22972298
return false;
22982299
});
22992300

2300-
profilingChart = Functions.createProfilingChart(
2301-
'queryProfiling',
2302-
chartData
2303-
);
2301+
profilingChart = createProfilingChart('queryProfiling', chartData);
23042302
}
23052303
});
23062304
return profilingChart;

‎js/src/server/status/queries.js‎

Lines changed: 2 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import $ from 'jquery';
22
import { AJAX } from '../../modules/ajax.js';
3-
import { Functions } from '../../modules/functions.js';
3+
import createProfilingChart from '../../modules/functions/createProfilingChart.js';
44

55
/**
66
* @fileoverview Javascript functions used in server status query page
@@ -33,10 +33,7 @@ AJAX.registerOnload('server/status/queries.js', function () {
3333
});
3434
$('#serverstatusquerieschart').data(
3535
'queryPieChart',
36-
Functions.createProfilingChart(
37-
'serverstatusquerieschart',
38-
cdata
39-
)
36+
createProfilingChart('serverstatusquerieschart', cdata)
4037
);
4138
}
4239
} catch (exception) {

‎js/src/sql.js‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@ import { CommonActions, CommonParams } from './modules/common.js';
66
import { Config } from './modules/config.js';
77
import highlightSql from './modules/sql-highlight.js';
88
import { ajaxRemoveMessage, ajaxShowMessage } from './modules/ajax-message.js';
9+
import createProfilingChart from './modules/functions/createProfilingChart.js';
910

1011
/**
1112
* @fileoverview functions used wherever an sql query form is used
@@ -1276,7 +1277,7 @@ Sql.makeProfilingChart = function () {
12761277
$('#profilingchart').html('').show();
12771278
$('#profilingChartData').html('');
12781279

1279-
Functions.createProfilingChart('profilingchart', data);
1280+
createProfilingChart('profilingchart', data);
12801281
};
12811282

12821283
/**

0 commit comments

Comments
 (0)