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

Fix merge conflicts

Browse Source
This commit is contained in:
Marc Delisle 2012-09-22 06:48:24 -04:00
commit 9671e65dac
7 changed files with 169 additions and 12023 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
build.xml
View File

@ -78,7 +78,7 @@
<target name="phpcs" description="Generate checkstyle.xml using PHP_CodeSniffer excluding test, tcpdf directories">
<exec executable="phpcs">
<arg line="
--ignore=*/php-gettext/*,*/tcpdf/*,*/canvg/*,*/codemirror/*,*/highcharts/*,*/openlayers/*,*/jquery/*,*/jqplot/*,*/build/*,*/bfShapeFiles/*,*/PMAStandard/*
--ignore=*/php-gettext/*,*/tcpdf/*,*/canvg/*,*/codemirror/*,*/openlayers/*,*/jquery/*,*/jqplot/*,*/build/*,*/bfShapeFiles/*,*/PMAStandard/*
--report=checkstyle
--report-file=${basedir}/build/logs/checkstyle.xml
--standard=PMAStandard

201
js/functions.js
View File

@ -1683,200 +1683,9 @@ function PMA_createTableDialog( $div, url , target)
}
/**
* Creates a highcharts chart in the given container
*
* @param var settings object with highcharts properties that should be applied. (See also http://www.highcharts.com/ref/)
* requires at least settings.chart.renderTo and settings.series to be set.
* In addition there may be an additional property object 'realtime' that allows for realtime charting:
* realtime: {
* url: adress to get the data from (will always add token, ajax_request=1 and chart_data=1 to the GET request)
* type: the GET request will also add type=[value of the type property] to the request
* callback: Callback function that should draw the point, it's called with 4 parameters in this order:
* - the chart object
* - the current response value of the GET request, JSON parsed
* - the previous response value of the GET request, JSON parsed
* - the number of added points
* error: Callback function when the get request fails. TODO: Apply callback on timeouts aswell
* }
*
* @return object The created highcharts instance
*/
function PMA_createChart(passedSettings)
{
var container = passedSettings.chart.renderTo;
var settings = {
chart: {
type: 'spline',
marginRight: 10,
backgroundColor: 'none',
events: {
/* Live charting support */
load: function() {
var thisChart = this;
var lastValue = null, curValue = null;
var numLoadedPoints = 0, otherSum = 0;
var diff;
// No realtime updates for graphs that are being exported, and disabled when realtime is not set
// Also don't do live charting if we don't have the server time
if (thisChart.options.chart.forExport == true ||
! thisChart.options.realtime ||
! thisChart.options.realtime.callback ||
! server_time_diff) {
return;
}
thisChart.options.realtime.timeoutCallBack = function() {
thisChart.options.realtime.postRequest = $.post(
thisChart.options.realtime.url,
thisChart.options.realtime.postData,
function(data) {
try {
curValue = jQuery.parseJSON(data.message);
} catch (err) {
if (thisChart.options.realtime.error) {
thisChart.options.realtime.error(err);
}
return;
}
if (lastValue==null) {
diff = curValue.x - thisChart.xAxis[0].getExtremes().max;
} else {
diff = parseInt(curValue.x - lastValue.x);
}
thisChart.xAxis[0].setExtremes(
thisChart.xAxis[0].getExtremes().min+diff,
thisChart.xAxis[0].getExtremes().max+diff,
false
);
thisChart.options.realtime.callback(thisChart, curValue, lastValue, numLoadedPoints);
lastValue = curValue;
numLoadedPoints++;
// Timeout has been cleared => don't start a new timeout
if (chart_activeTimeouts[container] == null) {
return;
}
chart_activeTimeouts[container] = setTimeout(
thisChart.options.realtime.timeoutCallBack,
thisChart.options.realtime.refreshRate
);
});
};
chart_activeTimeouts[container] = setTimeout(thisChart.options.realtime.timeoutCallBack, 5);
}
}
},
plotOptions: {
series: {
marker: {
radius: 3
}
}
},
credits: {
enabled:false
},
xAxis: {
type: 'datetime'
},
yAxis: {
min: 0,
title: {
text: PMA_messages['strTotalCount']
},
plotLines: [{
value: 0,
width: 1,
color: '#808080'
}]
},
tooltip: {
formatter: function() {
return '<b>' + this.series.name +'</b><br/>' +
Highcharts.dateFormat('%Y-%m-%d %H:%M:%S', this.x) + '<br/>' +
Highcharts.numberFormat(this.y, 2);
}
},
exporting: {
enabled: true
},
series: []
};
/* Set/Get realtime chart default values */
if (passedSettings.realtime) {
if (!passedSettings.realtime.refreshRate) {
passedSettings.realtime.refreshRate = 5000;
}
if (!passedSettings.realtime.numMaxPoints) {
passedSettings.realtime.numMaxPoints = 30;
}
// Allow custom POST vars to be added
passedSettings.realtime.postData = $.extend(false, { ajax_request: true, chart_data: 1, type: passedSettings.realtime.type }, passedSettings.realtime.postData);
if (server_time_diff) {
settings.xAxis.min = new Date().getTime() - server_time_diff - passedSettings.realtime.numMaxPoints * passedSettings.realtime.refreshRate;
settings.xAxis.max = new Date().getTime() - server_time_diff + passedSettings.realtime.refreshRate;
}
}
// Overwrite/Merge default settings with passedsettings
$.extend(true, settings, passedSettings);
return new Highcharts.Chart(settings);
}
/*
* Creates a Profiling Chart. Used in server_status_monitor.js
*/
function PMA_createProfilingChart(data, options)
{
return PMA_createChart($.extend(true, {
chart: {
renderTo: 'profilingchart',
type: 'pie'
},
title: { text:'', margin:0 },
series: [{
type: 'pie',
name: PMA_messages['strQueryExecutionTime'],
data: data
}],
plotOptions: {
pie: {
allowPointSelect: true,
cursor: 'pointer',
dataLabels: {
enabled: true,
distance: 35,
formatter: function() {
return '<b>'+ this.point.name +'</b><br/>'+ Highcharts.numberFormat(this.percentage, 2) +' %';
}
}
}
},
tooltip: {
formatter: function() {
return '<b>'+ this.point.name +'</b><br/>'+PMA_prettyProfilingNum(this.y)+'<br/>('+Highcharts.numberFormat(this.percentage, 2) +' %)';
}
}
}, options));
}
/*
* Creates a Profiling Chart with jqplot. Used in sql.js
* and in server_status_monitor.js
*/
function PMA_createProfilingChartJqplot(target, data)
{
@ -1918,11 +1727,11 @@ function PMA_createProfilingChartJqplot(target, data)
}
/**
* Formats a profiling duration nicely (in us and ms time). Used in PMA_createProfilingChart() and server_status.js
* Formats a profiling duration nicely (in us and ms time). Used in server_status.js
*
* @param integer Number to be formatted, should be in the range of microsecond to second
* @param integer Acuracy, how many numbers right to the comma should be
* @return string The formatted number
* @param integer Number to be formatted, should be in the range of microsecond to second
* @param integer Accuracy, how many numbers right to the comma should be
* @return string The formatted number
*/
function PMA_prettyProfilingNum(num, acc)
{

651
js/highcharts/exporting.js
View File

@ -1,651 +0,0 @@
/**
* @license Highcharts JS v2.1.4 (2011-03-02)
* Exporting module
*
* (c) 2010 Torstein Hønsi
*
* License: www.highcharts.com/license
*
* Please Note: This file has been adjusted for use in phpMyAdmin,
* to allow chart exporting without the batik library
*/
// JSLint options:
/*global Highcharts, document, window, Math, setTimeout */
(function() { // encapsulate
// create shortcuts
var HC = Highcharts,
Chart = HC.Chart,
addEvent = HC.addEvent,
createElement = HC.createElement,
discardElement = HC.discardElement,
css = HC.css,
merge = HC.merge,
each = HC.each,
extend = HC.extend,
math = Math,
mathMax = math.max,
doc = document,
win = window,
hasTouch = 'ontouchstart' in doc.documentElement,
M = 'M',
L = 'L',
DIV = 'div',
HIDDEN = 'hidden',
NONE = 'none',
PREFIX = 'highcharts-',
ABSOLUTE = 'absolute',
PX = 'px',
// Add language and get the defaultOptions
defaultOptions = HC.setOptions({
lang: {
downloadPNG: 'Download PNG image',
downloadJPEG: 'Download JPEG image',
downloadPDF: 'Download PDF document',
downloadSVG: 'Download SVG vector image',
exportButtonTitle: 'Export to raster or vector image',
printButton: 'Print the chart'
}
});
// Buttons and menus are collected in a separate config option set called 'navigation'.
// This can be extended later to add control buttons like zoom and pan right click menus.
defaultOptions.navigation = {
menuStyle: {
border: '1px solid #A0A0A0',
background: '#FFFFFF'
},
menuItemStyle: {
padding: '0 5px',
background: NONE,
color: '#303030',
fontSize: hasTouch ? '14px' : '11px'
},
menuItemHoverStyle: {
background: '#4572A5',
color: '#FFFFFF'
},
buttonOptions: {
align: 'right',
backgroundColor: {
linearGradient: [0, 0, 0, 20],
stops: [
[0.4, '#F7F7F7'],
[0.6, '#E3E3E3']
]
},
borderColor: '#B0B0B0',
borderRadius: 3,
borderWidth: 1,
//enabled: true,
height: 20,
hoverBorderColor: '#909090',
hoverSymbolFill: '#81A7CF',
hoverSymbolStroke: '#4572A5',
symbolFill: '#E0E0E0',
//symbolSize: 12,
symbolStroke: '#A0A0A0',
//symbolStrokeWidth: 1,
symbolX: 11.5,
symbolY: 10.5,
verticalAlign: 'top',
width: 24,
y: 10
}
};
// Add the export related options
defaultOptions.exporting = {
//enabled: true,
//filename: 'chart',
type: 'image/png',
url: 'file_echo.php',
width: 800,
buttons: {
exportButton: {
//enabled: true,
symbol: 'exportIcon',
x: -10,
symbolFill: '#A8BF77',
hoverSymbolFill: '#768F3E',
_titleKey: 'exportButtonTitle',
menuName: 'export',
menuItems: [{
textKey: 'downloadPNG',
onclick: function() {
this.exportChart();
}
},{
textKey: 'downloadSVG',
onclick: function() {
this.exportChart({
type: 'image/svg+xml'
});
}
},{
textKey: 'printButton',
onclick: function() {
this.print();
}
}]
}
}
};
extend(Chart.prototype, {
/**
* Return an SVG representation of the chart
*
* @param additionalOptions {Object} Additional chart options for the generated SVG representation
*/
getSVG: function(additionalOptions) {
var chart = this,
chartCopy,
sandbox,
svg,
seriesOptions,
config,
pointOptions,
pointMarker,
options = merge(chart.options, additionalOptions); // copy the options and add extra options
// IE compatibility hack for generating SVG content that it doesn't really understand
if (!doc.createElementNS) {
doc.createElementNS = function(ns, tagName) {
var elem = doc.createElement(tagName);
elem.getBBox = function() {
return chart.renderer.Element.prototype.getBBox.apply({ element: elem });
};
return elem;
};
}
// create a sandbox where a new chart will be generated
sandbox = createElement(DIV, null, {
position: ABSOLUTE,
top: '-9999em',
width: chart.chartWidth + PX,
height: chart.chartHeight + PX
}, doc.body);
// override some options
extend(options.chart, {
renderTo: sandbox,
forExport: true
});
options.exporting.enabled = false; // hide buttons in print
options.chart.plotBackgroundImage = null; // the converter doesn't handle images
// prepare for replicating the chart
options.series = [];
each(chart.series, function(serie) {
seriesOptions = serie.options;
seriesOptions.animation = false; // turn off animation
seriesOptions.showCheckbox = false;
// remove image markers
if (seriesOptions && seriesOptions.marker && /^url\(/.test(seriesOptions.marker.symbol)) {
seriesOptions.marker.symbol = 'circle';
}
seriesOptions.data = [];
each(serie.data, function(point) {
// extend the options by those values that can be expressed in a number or array config
config = point.config;
pointOptions = {
x: point.x,
y: point.y,
name: point.name
};
if (typeof config == 'object' && point.config && config.constructor != Array) {
extend(pointOptions, config);
}
seriesOptions.data.push(pointOptions); // copy fresh updated data
// remove image markers
pointMarker = point.config && point.config.marker;
if (pointMarker && /^url\(/.test(pointMarker.symbol)) {
delete pointMarker.symbol;
}
});
options.series.push(seriesOptions);
});
// generate the chart copy
chartCopy = new Highcharts.Chart(options);
// get the SVG from the container's innerHTML
svg = chartCopy.container.innerHTML;
// free up memory
options = null;
chartCopy.destroy();
discardElement(sandbox);
// sanitize
svg = svg
.replace(/zIndex="[^"]+"/g, '')
.replace(/isShadow="[^"]+"/g, '')
.replace(/symbolName="[^"]+"/g, '')
.replace(/jQuery[0-9]+="[^"]+"/g, '')
.replace(/isTracker="[^"]+"/g, '')
.replace(/url\([^#]+#/g, 'url(#')
/*.replace(/<svg /, '<svg xmlns:xlink="http://www.w3.org/1999/xlink" ')
.replace(/ href=/, ' xlink:href=')
.replace(/preserveAspectRatio="none">/g, 'preserveAspectRatio="none"/>')*/
/* This fails in IE < 8
.replace(/([0-9]+)\.([0-9]+)/g, function(s1, s2, s3) { // round off to save weight
return s2 +'.'+ s3[0];
})*/
// IE specific
.replace(/id=([^" >]+)/g, 'id="$1"')
.replace(/class=([^" ]+)/g, 'class="$1"')
.replace(/ transform /g, ' ')
.replace(/:(path|rect)/g, '$1')
.replace(/style="([^"]+)"/g, function(s) {
return s.toLowerCase();
});
// IE9 beta bugs with innerHTML. Test again with final IE9.
svg = svg.replace(/(url\(#highcharts-[0-9]+)&quot;/g, '$1')
.replace(/&quot;/g, "'");
if (svg.match(/ xmlns="/g).length == 2) {
svg = svg.replace(/xmlns="[^"]+"/, '');
}
return svg;
},
/**
* Submit the SVG representation of the chart to the server
* @param {Object} options Exporting options. Possible members are url, type and width.
* @param {Object} chartOptions Additional chart options for the SVG representation of the chart
*/
exportChart: function(options, chartOptions) {
var form,
chart = this,
canvas=createElement('canvas');
$('body').append(canvas);
$(canvas).css('position','absolute');
$(canvas).css('left','-10000px');
var submitData = function(chartData) {
// merge the options
options = merge(chart.options.exporting, options);
// create the form
form = createElement('form', {
method: 'post',
action: options.url
}, {
display: NONE
}, doc.body);
// add the values
each(['filename', 'type', 'width', 'image','token'], function(name) {
createElement('input', {
type: HIDDEN,
name: name,
value: {
filename: options.filename || 'chart',
type: options.type,
width: options.width,
image: chartData,
token: pma_token
}[name]
}, null, form);
});
// submit
form.submit();
// clean up
discardElement(form);
}
if(options && options.type=='image/svg+xml') {
submitData(chart.getSVG(chartOptions));
} else {
if (typeof FlashCanvas != "undefined") {
FlashCanvas.initElement(canvas);
}
// Generate data uri and submit once done
canvg(canvas, chart.getSVG(chartOptions),{
ignoreAnimation:true,
ignoreMouse:true,
renderCallback:function() {
// IE8 fix: flashcanvas doesn't update the canvas immediately, thus requiring setTimeout.
// See also http://groups.google.com/group/flashcanvas/browse_thread/thread/e36ff7a03e1bfb0a
setTimeout(function() { submitData(canvas.toDataURL()); }, 100);
}
});
}
},
/**
* Print the chart
*/
print: function() {
var chart = this,
container = chart.container,
origDisplay = [],
origParent = container.parentNode,
body = doc.body,
childNodes = body.childNodes;
if (chart.isPrinting) { // block the button while in printing mode
return;
}
chart.isPrinting = true;
// hide all body content
each(childNodes, function(node, i) {
if (node.nodeType == 1) {
origDisplay[i] = node.style.display;
node.style.display = NONE;
}
});
// pull out the chart
body.appendChild(container);
// print
win.print();
// allow the browser to prepare before reverting
setTimeout(function() {
// put the chart back in
origParent.appendChild(container);
// restore all body content
each(childNodes, function(node, i) {
if (node.nodeType == 1) {
node.style.display = origDisplay[i];
}
});
chart.isPrinting = false;
}, 1000);
},
/**
* Display a popup menu for choosing the export type
*
* @param {String} name An identifier for the menu
* @param {Array} items A collection with text and onclicks for the items
* @param {Number} x The x position of the opener button
* @param {Number} y The y position of the opener button
* @param {Number} width The width of the opener button
* @param {Number} height The height of the opener button
*/
contextMenu: function(name, items, x, y, width, height) {
var chart = this,
navOptions = chart.options.navigation,
menuItemStyle = navOptions.menuItemStyle,
chartWidth = chart.chartWidth,
chartHeight = chart.chartHeight,
cacheName = 'cache-'+ name,
menu = chart[cacheName],
menuPadding = mathMax(width, height), // for mouse leave detection
boxShadow = '3px 3px 10px #888',
innerMenu,
hide,
menuStyle;
// create the menu only the first time
if (!menu) {
// create a HTML element above the SVG
chart[cacheName] = menu = createElement(DIV, {
className: PREFIX + name
}, {
position: ABSOLUTE,
zIndex: 1000,
padding: menuPadding + PX
}, chart.container);
innerMenu = createElement(DIV, null,
extend({
MozBoxShadow: boxShadow,
WebkitBoxShadow: boxShadow,
boxShadow: boxShadow
}, navOptions.menuStyle) , menu);
// hide on mouse out
hide = function() {
css(menu, { display: NONE });
};
addEvent(menu, 'mouseleave', hide);
// create the items
each(items, function(item) {
if (item) {
var div = createElement(DIV, {
onmouseover: function() {
css(this, navOptions.menuItemHoverStyle);
},
onmouseout: function() {
css(this, menuItemStyle);
},
innerHTML: item.text || HC.getOptions().lang[item.textKey]
}, extend({
cursor: 'pointer'
}, menuItemStyle), innerMenu);
div[hasTouch ? 'ontouchstart' : 'onclick'] = function() {
hide();
item.onclick.apply(chart, arguments);
};
}
});
chart.exportMenuWidth = menu.offsetWidth;
chart.exportMenuHeight = menu.offsetHeight;
}
menuStyle = { display: 'block' };
// if outside right, right align it
if (x + chart.exportMenuWidth > chartWidth) {
menuStyle.right = (chartWidth - x - width - menuPadding) + PX;
} else {
menuStyle.left = (x - menuPadding) + PX;
}
// if outside bottom, bottom align it
if (y + height + chart.exportMenuHeight > chartHeight) {
menuStyle.bottom = (chartHeight - y - menuPadding) + PX;
} else {
menuStyle.top = (y + height - menuPadding) + PX;
}
css(menu, menuStyle);
},
/**
* Add the export button to the chart
*/
addButton: function(options) {
var chart = this,
renderer = chart.renderer,
btnOptions = merge(chart.options.navigation.buttonOptions, options),
onclick = btnOptions.onclick,
menuItems = btnOptions.menuItems,
//position = chart.getAlignment(btnOptions),
/*buttonLeft = position.x,
buttonTop = position.y,*/
buttonWidth = btnOptions.width,
buttonHeight = btnOptions.height,
box,
symbol,
button,
borderWidth = btnOptions.borderWidth,
boxAttr = {
stroke: btnOptions.borderColor
},
symbolAttr = {
stroke: btnOptions.symbolStroke,
fill: btnOptions.symbolFill
};
if (btnOptions.enabled === false) {
return;
}
// element to capture the click
function revert() {
symbol.attr(symbolAttr);
box.attr(boxAttr);
}
// the box border
box = renderer.rect(
0,
0,
buttonWidth,
buttonHeight,
btnOptions.borderRadius,
borderWidth
)
//.translate(buttonLeft, buttonTop) // to allow gradients
.align(btnOptions, true)
.attr(extend({
fill: btnOptions.backgroundColor,
'stroke-width': borderWidth,
zIndex: 19
}, boxAttr)).add();
// the invisible element to track the clicks
button = renderer.rect(
0,
0,
buttonWidth,
buttonHeight,
0
)
.align(btnOptions)
.attr({
fill: 'rgba(255, 255, 255, 0.001)',
title: HC.getOptions().lang[btnOptions._titleKey],
zIndex: 21
}).css({
cursor: 'pointer'
})
.on('mouseover', function() {
symbol.attr({
stroke: btnOptions.hoverSymbolStroke,
fill: btnOptions.hoverSymbolFill
});
box.attr({
stroke: btnOptions.hoverBorderColor
});
})
.on('mouseout', revert)
.on('click', revert)
.add();
//addEvent(button.element, 'click', revert);
// add the click event
if (menuItems) {
onclick = function(e) {
revert();
var bBox = button.getBBox();
chart.contextMenu(btnOptions.menuName, menuItems, bBox.x, bBox.y, buttonWidth, buttonHeight);
};
}
/*addEvent(button.element, 'click', function() {
onclick.apply(chart, arguments);
});*/
button.on('click', function() {
onclick.apply(chart, arguments);
});
// the icon
symbol = renderer.symbol(
btnOptions.symbol,
btnOptions.symbolX,
btnOptions.symbolY,
(btnOptions.symbolSize || 12) / 2
)
.align(btnOptions, true)
.attr(extend(symbolAttr, {
'stroke-width': btnOptions.symbolStrokeWidth || 1,
zIndex: 20
})).add();
}
});
// Create the export icon
HC.Renderer.prototype.symbols.exportIcon = function(x, y, radius) {
return [
M, // the disk
x - radius, y + radius,
L,
x + radius, y + radius,
x + radius, y + radius * 0.5,
x - radius, y + radius * 0.5,
'Z',
M, // the arrow
x, y + radius * 0.5,
L,
x - radius * 0.5, y - radius / 3,
x - radius / 6, y - radius / 3,
x - radius / 6, y - radius,
x + radius / 6, y - radius,
x + radius / 6, y - radius / 3,
x + radius * 0.5, y - radius / 3,
'Z'
];
};
// Add the buttons on chart load
Chart.prototype.callbacks.push(function(chart) {
var n,
exportingOptions = chart.options.exporting,
buttons = exportingOptions.buttons;
if (exportingOptions.enabled !== false) {
for (n in buttons) {
chart.addButton(buttons[n]);
}
for (n in chart.options.buttons) {
chart.addButton(chart.options.buttons[n]);
}
}
});
})();

11052
js/highcharts/highcharts.js
View File

File diff suppressed because it is too large Load Diff

9
js/server_status.js
View File

@ -7,7 +7,7 @@
* @requires jQueryUI
* @requires jQueryCookie
* @requires jQueryTablesorter
* @requires Highcharts
* @requires jqPlot
* @requires canvg
* @requires js/functions.js
*
@ -125,11 +125,8 @@ $(function() {
/*** Table sort tooltip ***/
PMA_createqTip($('table.sortable thead th'), PMA_messages['strSortHint']);
// Tell highcarts not to use UTC dates (global setting)
Highcharts.setOptions({
global: {
useUTC: false
}
$.ajaxSetup({
cache: false
});
// Add tabs

269
js/server_status_monitor.js
View File

@ -98,6 +98,14 @@ $(function() {
}
};
// time span selection
var selectionTimeDiff = new Array();
var selectionStartX, selectionStartY, selectionEndX, selectionEndY;
var drawTimeSpan = false;
// chart tooltip
var tooltipBox;
/* Add OS specific system info charts to the preset chart list */
switch(server_os) {
case 'WINNT':
@ -294,14 +302,6 @@ $(function() {
}
};
Highcharts.setOptions({
lang: {
settings: PMA_messages['strSettings'],
removeChart: PMA_messages['strRemoveChart'],
editChart: PMA_messages['strEditChart']
}
});
$('a[href="#rearrangeCharts"], a[href="#endChartEditMode"]').click(function() {
editMode = !editMode;
if ($(this).attr('href') == '#endChartEditMode') {
@ -1038,99 +1038,6 @@ $(function() {
/* Adds a chart to the chart grid */
function addChart(chartObj, initialize) {
/* series = [];
for (var j = 0; j<chartObj.nodes.length; j++)
series.push(chartObj.nodes[j]);
}
settings = {
chart: {
renderTo: 'gridchart' + runtime.chartAI,
width: chartSize().width,
height: chartSize().height,
marginRight: 5,
zoomType: 'x',
events: {
selection: function(event) {
if (editMode || $('#logAnalyseDialog').length == 0) {
return false;
}
var extremesObject = event.xAxis[0],
min = extremesObject.min,
max = extremesObject.max;
$('#logAnalyseDialog input[name="dateStart"]')
.val(Highcharts.dateFormat('%Y-%m-%d %H:%M:%S', new Date(min)));
$('#logAnalyseDialog input[name="dateEnd"]')
.val(Highcharts.dateFormat('%Y-%m-%d %H:%M:%S', new Date(max)));
var dlgBtns = { };
dlgBtns[PMA_messages['strFromSlowLog']] = function() {
loadLog('slow');
$(this).dialog("close");
};
dlgBtns[PMA_messages['strFromGeneralLog']] = function() {
loadLog('general');
$(this).dialog("close");
};
function loadLog(type) {
var dateStart = Date.parse($('#logAnalyseDialog input[name="dateStart"]').prop('value')) || min;
var dateEnd = Date.parse($('#logAnalyseDialog input[name="dateEnd"]').prop('value')) || max;
loadLogStatistics({
src: type,
start: dateStart,
end: dateEnd,
removeVariables: $('input#removeVariables').prop('checked'),
limitTypes: $('input#limitTypes').prop('checked')
});
}
$('#logAnalyseDialog').dialog({
width: 'auto',
height: 'auto',
buttons: dlgBtns
});
return false;
}
}
},
xAxis: {
min: runtime.xmin,
max: runtime.xmax
},
yAxis: {
title: {
text: ''
}
},
tooltip: {
formatter: function() {
var s = '<b>' + Highcharts.dateFormat('%H:%M:%S', this.x) + '</b>';
$.each(this.points, function(i, point) {
s += '<br/><span style="color:' + point.series.color + '">' + point.series.name + ':</span> ' +
((parseInt(point.y) == point.y) ? point.y : Highcharts.numberFormat(this.y, 2)) + ' ' + (point.series.options.unit || '');
});
return s;
},
shared: true
},
legend: {
enabled: false
},
series: series,
buttons: gridbuttons,
title: { text: chartObj.title }
};
*/
var settings = {
title: chartObj.title,
@ -1191,6 +1098,113 @@ $(function() {
buildRequiredDataList();
}
// time span selection
$('#gridchart' + runtime.chartAI).bind('jqplotMouseDown', function(ev, gridpos, datapos, neighbor, plot) {
drawTimeSpan = true;
selectionTimeDiff.push(datapos.xaxis);
if($('#selection_box').length) {
$('#selection_box').remove();
}
selectionBox = $('<div id="selection_box" style="z-index:1000;height:250px;position:absolute;background-color:#87CEEB;opacity:0.4;filter:alpha(opacity=40);pointer-events:none;">');
$(document.body).append(selectionBox);
selectionStartX = ev.pageX;
selectionStartY = ev.pageY;
selectionBox
.attr({id: 'selection_box'})
.css({
top: selectionStartY-gridpos.y,
left: selectionStartX
})
.fadeIn();
});
$('#gridchart' + runtime.chartAI).bind('jqplotMouseUp', function(ev, gridpos, datapos, neighbor, plot) {
if(! drawTimeSpan)
return;
selectionTimeDiff.push(datapos.xaxis);
if(selectionTimeDiff[1] < selectionTimeDiff[0]) {
selectionTimeDiff = [];
return;
}
//get date from timestamp
var min = new Date(Math.ceil(selectionTimeDiff[0]));
var max = new Date(Math.ceil(selectionTimeDiff[1]));
PMA_getLogAnalyseDialog(min, max);
selectionTimeDiff = [];
drawTimeSpan = false;
});
$('#gridchart' + runtime.chartAI).bind('jqplotMouseMove', function(ev, gridpos, datapos, neighbor, plot) {
if(neighbor != null) {
if ($('#tooltip_box').length) {
$('#tooltip_box')
.css({
left: ev.pageX + 15,
top: ev.pageY + 15,
padding:'5px'
})
.fadeIn();
}
var xVal = new Date(Math.ceil(neighbor.data[0]));
var xValHours = xVal.getHours();
(xValHours < 10) ? (xValHours = "0" + xValHours) : "";
var xValMinutes = xVal.getMinutes();
(xValMinutes < 10) ? (xValMinutes = "0" + xValMinutes) : "";
var xValSeconds = xVal.getSeconds();
(xValSeconds < 10) ? (xValSeconds = "0" + xValSeconds) : "";
xVal = xValHours + ":" + xValMinutes + ":" + xValSeconds;
var s = '<b>' + xVal + '<br/>' + neighbor.data[1] + '</b>';
$('#tooltip_box').html(s);
}
if(! drawTimeSpan)
return;
if (selectionStartX != undefined) {
$('#selection_box')
.css({
width: Math.ceil(ev.pageX - selectionStartX)
})
.fadeIn();
}
});
$('#gridchart' + runtime.chartAI).bind('jqplotMouseEnter', function(ev, gridpos, datapos, neighbor, plot) {
if($('#tooltip_box').length) {
tooltipBox.remove();
}
tooltipBox = $('<div style="z-index:1000;height:40px;position:absolute;background-color:#FFFFFD;opacity:0.8;filter:alpha(opacity=80);">');
$(document.body).append(tooltipBox);
tooltipBox
.attr({id: 'tooltip_box'})
.css({
top: ev.pageY + 15,
left: ev.pageX + 15
})
.fadeIn();
});
$('#gridchart' + runtime.chartAI).bind('jqplotMouseLeave', function(ev, gridpos, datapos, neighbor, plot) {
if($('#tooltip_box').length) {
tooltipBox.remove();
}
drawTimeSpan = false;
});
$(document.body).mouseup(function() {
if($('#selection_box').length) {
selectionBox.remove();
}
});
// Edit, Print icon only in edit mode
$('table#chartGrid div svg').find('*[zIndex=20], *[zIndex=21], *[zIndex=19]').toggle(editMode);
@ -1252,6 +1266,44 @@ $(function() {
});
}
function PMA_getLogAnalyseDialog(min, max) {
$('#logAnalyseDialog input[name="dateStart"]')
.attr('value', formatDate(min, 'yyyy-MM-dd HH:mm:ss'));
$('#logAnalyseDialog input[name="dateEnd"]')
.attr('value', formatDate(max, 'yyyy-MM-dd HH:mm:ss'));
var dlgBtns = { };
dlgBtns[PMA_messages['strFromSlowLog']] = function() {
loadLog('slow', min, max);
$(this).dialog("close");
};
dlgBtns[PMA_messages['strFromGeneralLog']] = function() {
loadLog('general', min, max);
$(this).dialog("close");
};
$('#logAnalyseDialog').dialog({
width: 'auto',
height: 'auto',
buttons: dlgBtns
});
}
function loadLog(type, min, max) {
var dateStart = Date.parse($('#logAnalyseDialog input[name="dateStart"]').prop('value')) || min;
var dateEnd = Date.parse($('#logAnalyseDialog input[name="dateEnd"]').prop('value')) || max;
loadLogStatistics({
src: type,
start: dateStart,
end: dateEnd,
removeVariables: $('input#removeVariables').prop('checked'),
limitTypes: $('input#limitTypes').prop('checked')
});
}
/* Removes a chart from the grid */
function removeChart(chartObj) {
var htmlnode = chartObj.options.chart.renderTo;
@ -1959,17 +2011,10 @@ $(function() {
return false;
});
profilingChart = PMA_createProfilingChart(chartData, {
chart: {
renderTo: 'queryProfiling'
},
plotOptions: {
pie: {
size: '50%'
}
}
});
profilingChart = PMA_createProfilingChartJqplot(
'queryProfiling',
chartData
);
$('div#queryProfiling').resizable();
}

8
server_status.php
View File

@ -467,17 +467,15 @@ $scripts->addFile('server_status.js');
$scripts->addFile('jquery/jquery.tablesorter.js');
$scripts->addFile('jquery/jquery.cookie.js'); // For tab persistence
// Charting
$scripts->addFile('highcharts/highcharts.js');
/* Files required for chart exporting */
$scripts->addFile('highcharts/exporting.js');
$scripts->addFile('server_status.js');
$scripts->addFile('jquery/jquery-ui-1.8.16.custom.js');
/* < IE 9 doesn't support canvas natively */
if (PMA_USR_BROWSER_AGENT == 'IE' && PMA_USR_BROWSER_VER < 9) {
$scripts->addFile('canvg/flashcanvas.js');
}
$scripts->addFile('canvg/canvg.js');
// for profiling chart
// for charting
$scripts->addFile('jqplot/jquery.jqplot.js');
$scripts->addFile('jqplot/plugins/jqplot.pieRenderer.js');
$scripts->addFile('jqplot/plugins/jqplot.canvasTextRenderer.js');