gian/phpmyadmin
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Extract Functions.createProfilingChart() into a module

Browse Source 
Signed-off-by: Maurício Meneghini Fauth <mauricio@fauth.dev>
This commit is contained in:
Maurício Meneghini Fauth 2022-12-09 15:57:30 -03:00
parent 2cf3f49f35
commit ea2dc6664a
No known key found for this signature in database
GPG Key ID: 6A16FD38AFC89CC8
5 changed files with 79 additions and 81 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

71
js/src/modules/functions.js
View File

@ -9,7 +9,6 @@ import highlightSql from './sql-highlight.js';
import { ajaxRemoveMessage, ajaxShowMessage } from './ajax-message.js';
import handleCreateViewModal from './functions/handleCreateViewModal.js';
/* global ChartType, ColumnType, DataTable, JQPlotChartFactory */ // js/chart.js
/* global DatabaseStructure */ // js/database/structure.js
/* global firstDayOfCalendar, maxInputVars, themeImagePath */ // templates/javascript/variables.twig
@ -1591,76 +1590,6 @@ Functions.showWarningForIntTypes = function () {
}
};
/**
* Creates a Profiling Chart. Used in sql.js
* and in server/status/monitor.js
*
* @param target
* @param data
*
* @return {object}
*/
Functions.createProfilingChart = function (target, data) {
// create the chart
var factory = new JQPlotChartFactory();
var chart = factory.createChart(ChartType.PIE, target);
// create the data table and add columns
var dataTable = new DataTable();
dataTable.addColumn(ColumnType.STRING, '');
dataTable.addColumn(ColumnType.NUMBER, '');
dataTable.setData(data);
var windowWidth = $(window).width();
var location = 's';
if (windowWidth > 768) {
location = 'se';
}
// draw the chart and return the chart object
chart.draw(dataTable, {
seriesDefaults: {
rendererOptions: {
showDataLabels: true
}
},
highlighter: {
tooltipLocation: 'se',
sizeAdjust: 0,
tooltipAxes: 'pieref',
formatString: '%s, %.9Ps'
},
legend: {
show: true,
location: location,
rendererOptions: {
numberColumns: 2
}
},
// from https://web.archive.org/web/20190321233412/http://tango.freedesktop.org/Tango_Icon_Theme_Guidelines
seriesColors: [
'#fce94f',
'#fcaf3e',
'#e9b96e',
'#8ae234',
'#729fcf',
'#ad7fa8',
'#ef2929',
'#888a85',
'#c4a000',
'#ce5c00',
'#8f5902',
'#4e9a06',
'#204a87',
'#5c3566',
'#a40000',
'#babdb6',
'#2e3436'
]
});
return chart;
};
/**
* Formats a profiling duration nicely (in us and ms time).
* Used in server/status/monitor.js

73
js/src/modules/functions/createProfilingChart.js Normal file
View File

@ -0,0 +1,73 @@
import $ from 'jquery';
/* global ChartType, ColumnType, DataTable, JQPlotChartFactory */ // js/chart.js
/**
* Creates a Profiling Chart. Used in sql.js
* and in server/status/monitor.js
*
* @param {string} target
* @param {any[]} data
*
* @return {object}
*/
export default function createProfilingChart (target, data) {
// create the chart
var factory = new JQPlotChartFactory();
var chart = factory.createChart(ChartType.PIE, target);
// create the data table and add columns
var dataTable = new DataTable();
dataTable.addColumn(ColumnType.STRING, '');
dataTable.addColumn(ColumnType.NUMBER, '');
dataTable.setData(data);
var windowWidth = $(window).width();
var location = 's';
if (windowWidth > 768) {
location = 'se';
}
// draw the chart and return the chart object
chart.draw(dataTable, {
seriesDefaults: {
rendererOptions: {
showDataLabels: true
}
},
highlighter: {
tooltipLocation: 'se',
sizeAdjust: 0,
tooltipAxes: 'pieref',
formatString: '%s, %.9Ps'
},
legend: {
show: true,
location: location,
rendererOptions: {
numberColumns: 2
}
},
// from https://web.archive.org/web/20190321233412/http://tango.freedesktop.org/Tango_Icon_Theme_Guidelines
seriesColors: [
'#fce94f',
'#fcaf3e',
'#e9b96e',
'#8ae234',
'#729fcf',
'#ad7fa8',
'#ef2929',
'#888a85',
'#c4a000',
'#ce5c00',
'#8f5902',
'#4e9a06',
'#204a87',
'#5c3566',
'#a40000',
'#babdb6',
'#2e3436'
]
});
return chart;
}

6
js/src/server/status/monitor.js
View File

@ -4,6 +4,7 @@ import { Functions } from '../../modules/functions.js';
import { CommonParams } from '../../modules/common.js';
import { Config } from '../../modules/config.js';
import tooltip from '../../modules/tooltip.js';
import createProfilingChart from '../../modules/functions/createProfilingChart.js';
/**
* @fileoverview Javascript functions used in server status monitor page
@ -2297,10 +2298,7 @@ AJAX.registerOnload('server/status/monitor.js', function () {
return false;
});
profilingChart = Functions.createProfilingChart(
'queryProfiling',
chartData
);
profilingChart = createProfilingChart('queryProfiling', chartData);
}
});
return profilingChart;

7
js/src/server/status/queries.js
View File

@ -1,6 +1,6 @@
import $ from 'jquery';
import { AJAX } from '../../modules/ajax.js';
import { Functions } from '../../modules/functions.js';
import createProfilingChart from '../../modules/functions/createProfilingChart.js';
/**
* @fileoverview Javascript functions used in server status query page
@ -33,10 +33,7 @@ AJAX.registerOnload('server/status/queries.js', function () {
});
$('#serverstatusquerieschart').data(
'queryPieChart',
Functions.createProfilingChart(
'serverstatusquerieschart',
cdata
)
createProfilingChart('serverstatusquerieschart', cdata)
);
}
} catch (exception) {

3
js/src/sql.js
View File

@ -6,6 +6,7 @@ import { CommonActions, CommonParams } from './modules/common.js';
import { Config } from './modules/config.js';
import highlightSql from './modules/sql-highlight.js';
import { ajaxRemoveMessage, ajaxShowMessage } from './modules/ajax-message.js';
import createProfilingChart from './modules/functions/createProfilingChart.js';
/**
* @fileoverview functions used wherever an sql query form is used
@ -1276,7 +1277,7 @@ Sql.makeProfilingChart = function () {
$('#profilingchart').html('').show();
$('#profilingChartData').html('');
Functions.createProfilingChart('profilingchart', data);
createProfilingChart('profilingchart', data);
};
/**