mirror of
https://github.com/YunoHost-Apps/phpmyadmin_ynh.git
synced 2024-09-03 19:56:46 +02:00
623 lines
22 KiB
JavaScript
623 lines
22 KiB
JavaScript
|
// TODO: change the axis
|
||
|
|
/* vim: set expandtab sw=4 ts=4 sts=4: */
|
||
|
|
/**
|
||
|
|
** @fileoverview JavaScript functions used on tbl_select.php
|
||
|
|
**
|
||
|
|
** @requires jQuery
|
||
|
|
** @requires js/functions.js
|
||
|
|
**/
|
||
|
|
|
||
|
|
|
||
|
|
/**
|
||
|
|
** Display Help/Info
|
||
|
|
**/
|
||
|
|
function displayHelp() {
|
||
|
|
PMA_ajaxShowMessage(PMA_messages.strDisplayHelp, 10000);
|
||
|
|
}
|
||
|
|
|
||
|
|
/**
|
||
|
|
** Extend the array object for max function
|
||
|
|
** @param array
|
||
|
|
**/
|
||
|
|
Array.max = function (array) {
|
||
|
|
return Math.max.apply(Math, array);
|
||
|
|
};
|
||
|
|
|
||
|
|
/**
|
||
|
|
** Extend the array object for min function
|
||
|
|
** @param array
|
||
|
|
**/
|
||
|
|
Array.min = function (array) {
|
||
|
|
return Math.min.apply(Math, array);
|
||
|
|
};
|
||
|
|
|
||
|
|
/**
|
||
|
|
** Checks if a string contains only numeric value
|
||
|
|
** @param n: String (to be checked)
|
||
|
|
**/
|
||
|
|
function isNumeric(n) {
|
||
|
|
return !isNaN(parseFloat(n)) && isFinite(n);
|
||
|
|
}
|
||
|
|
|
||
|
|
/**
|
||
|
|
** Checks if an object is empty
|
||
|
|
** @param n: Object (to be checked)
|
||
|
|
**/
|
||
|
|
function isEmpty(obj) {
|
||
|
|
var name;
|
||
|
|
for (name in obj) {
|
||
|
|
return false;
|
||
|
|
}
|
||
|
|
return true;
|
||
|
|
}
|
||
|
|
|
||
|
|
/**
|
||
|
|
** Converts a date/time into timestamp
|
||
|
|
** @param val String Date
|
||
|
|
** @param type Sring Field type(datetime/timestamp/time/date)
|
||
|
|
**/
|
||
|
|
function getTimeStamp(val, type) {
|
||
|
|
if (type.toString().search(/datetime/i) != -1 ||
|
||
|
|
type.toString().search(/timestamp/i) != -1
|
||
|
|
) {
|
||
|
|
return $.datepicker.parseDateTime('yy-mm-dd', 'HH:mm:ss', val);
|
||
|
|
}
|
||
|
|
else if (type.toString().search(/time/i) != -1) {
|
||
|
|
return $.datepicker.parseDateTime('yy-mm-dd', 'HH:mm:ss', '1970-01-01 ' + val);
|
||
|
|
}
|
||
|
|
else if (type.toString().search(/date/i) != -1) {
|
||
|
|
return $.datepicker.parseDate('yy-mm-dd', val);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/**
|
||
|
|
** Classifies the field type into numeric,timeseries or text
|
||
|
|
** @param field: field type (as in database structure)
|
||
|
|
**/
|
||
|
|
function getType(field) {
|
||
|
|
if (field.toString().search(/int/i) != -1 ||
|
||
|
|
field.toString().search(/decimal/i) != -1 ||
|
||
|
|
field.toString().search(/year/i) != -1
|
||
|
|
) {
|
||
|
|
return 'numeric';
|
||
|
|
} else if (field.toString().search(/time/i) != -1 ||
|
||
|
|
field.toString().search(/date/i) != -1
|
||
|
|
) {
|
||
|
|
return 'time';
|
||
|
|
} else {
|
||
|
|
return 'text';
|
||
|
|
}
|
||
|
|
}
|
||
|
|
/**
|
||
|
|
** Converts a categorical array into numeric array
|
||
|
|
** @param array categorical values array
|
||
|
|
**/
|
||
|
|
function getCord(arr) {
|
||
|
|
var newCord = [];
|
||
|
|
var original = $.extend(true, [], arr);
|
||
|
|
arr = jQuery.unique(arr).sort();
|
||
|
|
$.each(original, function (index, value) {
|
||
|
|
newCord.push(jQuery.inArray(value, arr));
|
||
|
|
});
|
||
|
|
return [newCord, arr, original];
|
||
|
|
}
|
||
|
|
|
||
|
|
/**
|
||
|
|
** Scrolls the view to the display section
|
||
|
|
**/
|
||
|
|
function scrollToChart() {
|
||
|
|
var x = $('#dataDisplay').offset().top - 100; // 100 provides buffer in viewport
|
||
|
|
$('html,body').animate({scrollTop: x}, 500);
|
||
|
|
}
|
||
|
|
|
||
|
|
/**
|
||
|
|
* Unbind all event handlers before tearing down a page
|
||
|
|
*/
|
||
|
|
AJAX.registerTeardown('tbl_zoom_plot_jqplot.js', function () {
|
||
|
|
$('#tableid_0').unbind('change');
|
||
|
|
$('#tableid_1').unbind('change');
|
||
|
|
$('#tableid_2').unbind('change');
|
||
|
|
$('#tableid_3').unbind('change');
|
||
|
|
$('#inputFormSubmitId').unbind('click');
|
||
|
|
$('#togglesearchformlink').unbind('click');
|
||
|
|
$("#dataDisplay").find(':input').die('keydown');
|
||
|
|
$('button.button-reset').unbind('click');
|
||
|
|
$('div#resizer').unbind('resizestop');
|
||
|
|
$('div#querychart').unbind('jqplotDataClick');
|
||
|
|
});
|
||
|
|
|
||
|
|
AJAX.registerOnload('tbl_zoom_plot_jqplot.js', function () {
|
||
|
|
var cursorMode = ($("input[name='mode']:checked").val() == 'edit') ? 'crosshair' : 'pointer';
|
||
|
|
var currentChart = null;
|
||
|
|
var searchedDataKey = null;
|
||
|
|
var xLabel = $('#tableid_0').val();
|
||
|
|
var yLabel = $('#tableid_1').val();
|
||
|
|
// will be updated via Ajax
|
||
|
|
var xType = $('#types_0').val();
|
||
|
|
var yType = $('#types_1').val();
|
||
|
|
var dataLabel = $('#dataLabel').val();
|
||
|
|
var lastX;
|
||
|
|
var lastY;
|
||
|
|
var zoomRatio = 1;
|
||
|
|
|
||
|
|
|
||
|
|
// Get query result
|
||
|
|
var searchedData = jQuery.parseJSON($('#querydata').html());
|
||
|
|
|
||
|
|
/**
|
||
|
|
** Input form submit on field change
|
||
|
|
**/
|
||
|
|
|
||
|
|
// first column choice corresponds to the X axis
|
||
|
|
$('#tableid_0').change(function () {
|
||
|
|
//AJAX request for field type, collation, operators, and value field
|
||
|
|
$.post('tbl_zoom_select.php', {
|
||
|
|
'ajax_request' : true,
|
||
|
|
'change_tbl_info' : true,
|
||
|
|
'db' : PMA_commonParams.get('db'),
|
||
|
|
'table' : PMA_commonParams.get('table'),
|
||
|
|
'field' : $('#tableid_0').val(),
|
||
|
|
'it' : 0,
|
||
|
|
'token' : PMA_commonParams.get('token')
|
||
|
|
}, function (data) {
|
||
|
|
$('#tableFieldsId tr:eq(1) td:eq(0)').html(data.field_type);
|
||
|
|
$('#tableFieldsId tr:eq(1) td:eq(1)').html(data.field_collation);
|
||
|
|
$('#tableFieldsId tr:eq(1) td:eq(2)').html(data.field_operators);
|
||
|
|
$('#tableFieldsId tr:eq(1) td:eq(3)').html(data.field_value);
|
||
|
|
xLabel = $('#tableid_0').val();
|
||
|
|
$('#types_0').val(data.field_type);
|
||
|
|
xType = data.field_type;
|
||
|
|
$('#collations_0').val(data.field_collations);
|
||
|
|
addDateTimePicker();
|
||
|
|
});
|
||
|
|
});
|
||
|
|
|
||
|
|
// second column choice corresponds to the Y axis
|
||
|
|
$('#tableid_1').change(function () {
|
||
|
|
//AJAX request for field type, collation, operators, and value field
|
||
|
|
$.post('tbl_zoom_select.php', {
|
||
|
|
'ajax_request' : true,
|
||
|
|
'change_tbl_info' : true,
|
||
|
|
'db' : PMA_commonParams.get('db'),
|
||
|
|
'table' : PMA_commonParams.get('table'),
|
||
|
|
'field' : $('#tableid_1').val(),
|
||
|
|
'it' : 1,
|
||
|
|
'token' : PMA_commonParams.get('token')
|
||
|
|
}, function (data) {
|
||
|
|
$('#tableFieldsId tr:eq(3) td:eq(0)').html(data.field_type);
|
||
|
|
$('#tableFieldsId tr:eq(3) td:eq(1)').html(data.field_collation);
|
||
|
|
$('#tableFieldsId tr:eq(3) td:eq(2)').html(data.field_operators);
|
||
|
|
$('#tableFieldsId tr:eq(3) td:eq(3)').html(data.field_value);
|
||
|
|
yLabel = $('#tableid_1').val();
|
||
|
|
$('#types_1').val(data.field_type);
|
||
|
|
yType = data.field_type;
|
||
|
|
$('#collations_1').val(data.field_collations);
|
||
|
|
addDateTimePicker();
|
||
|
|
});
|
||
|
|
});
|
||
|
|
|
||
|
|
$('#tableid_2').change(function () {
|
||
|
|
//AJAX request for field type, collation, operators, and value field
|
||
|
|
$.post('tbl_zoom_select.php', {
|
||
|
|
'ajax_request' : true,
|
||
|
|
'change_tbl_info' : true,
|
||
|
|
'db' : PMA_commonParams.get('db'),
|
||
|
|
'table' : PMA_commonParams.get('table'),
|
||
|
|
'field' : $('#tableid_2').val(),
|
||
|
|
'it' : 2,
|
||
|
|
'token' : PMA_commonParams.get('token')
|
||
|
|
}, function (data) {
|
||
|
|
$('#tableFieldsId tr:eq(6) td:eq(0)').html(data.field_type);
|
||
|
|
$('#tableFieldsId tr:eq(6) td:eq(1)').html(data.field_collation);
|
||
|
|
$('#tableFieldsId tr:eq(6) td:eq(2)').html(data.field_operators);
|
||
|
|
$('#tableFieldsId tr:eq(6) td:eq(3)').html(data.field_value);
|
||
|
|
$('#types_2').val(data.field_type);
|
||
|
|
$('#collations_2').val(data.field_collations);
|
||
|
|
addDateTimePicker();
|
||
|
|
});
|
||
|
|
});
|
||
|
|
|
||
|
|
$('#tableid_3').change(function () {
|
||
|
|
//AJAX request for field type, collation, operators, and value field
|
||
|
|
$.post('tbl_zoom_select.php', {
|
||
|
|
'ajax_request' : true,
|
||
|
|
'change_tbl_info' : true,
|
||
|
|
'db' : PMA_commonParams.get('db'),
|
||
|
|
'table' : PMA_commonParams.get('table'),
|
||
|
|
'field' : $('#tableid_3').val(),
|
||
|
|
'it' : 3,
|
||
|
|
'token' : PMA_commonParams.get('token')
|
||
|
|
}, function (data) {
|
||
|
|
$('#tableFieldsId tr:eq(8) td:eq(0)').html(data.field_type);
|
||
|
|
$('#tableFieldsId tr:eq(8) td:eq(1)').html(data.field_collation);
|
||
|
|
$('#tableFieldsId tr:eq(8) td:eq(2)').html(data.field_operators);
|
||
|
|
$('#tableFieldsId tr:eq(8) td:eq(3)').html(data.field_value);
|
||
|
|
$('#types_3').val(data.field_type);
|
||
|
|
$('#collations_3').val(data.field_collations);
|
||
|
|
addDateTimePicker();
|
||
|
|
});
|
||
|
|
});
|
||
|
|
|
||
|
|
/**
|
||
|
|
* Input form validation
|
||
|
|
**/
|
||
|
|
$('#inputFormSubmitId').click(function () {
|
||
|
|
if ($('#tableid_0').get(0).selectedIndex === 0 || $('#tableid_1').get(0).selectedIndex === 0) {
|
||
|
|
PMA_ajaxShowMessage(PMA_messages.strInputNull);
|
||
|
|
} else if (xLabel == yLabel) {
|
||
|
|
PMA_ajaxShowMessage(PMA_messages.strSameInputs);
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
/**
|
||
|
|
** Prepare a div containing a link, otherwise it's incorrectly displayed
|
||
|
|
** after a couple of clicks
|
||
|
|
**/
|
||
|
|
$('<div id="togglesearchformdiv"><a id="togglesearchformlink"></a></div>')
|
||
|
|
.insertAfter('#zoom_search_form')
|
||
|
|
// don't show it until we have results on-screen
|
||
|
|
.hide();
|
||
|
|
|
||
|
|
$('#togglesearchformlink')
|
||
|
|
.html(PMA_messages.strShowSearchCriteria)
|
||
|
|
.bind('click', function () {
|
||
|
|
var $link = $(this);
|
||
|
|
$('#zoom_search_form').slideToggle();
|
||
|
|
if ($link.text() == PMA_messages.strHideSearchCriteria) {
|
||
|
|
$link.text(PMA_messages.strShowSearchCriteria);
|
||
|
|
} else {
|
||
|
|
$link.text(PMA_messages.strHideSearchCriteria);
|
||
|
|
}
|
||
|
|
// avoid default click action
|
||
|
|
return false;
|
||
|
|
});
|
||
|
|
|
||
|
|
/**
|
||
|
|
** Set dialog properties for the data display form
|
||
|
|
**/
|
||
|
|
var buttonOptions = {};
|
||
|
|
/*
|
||
|
|
* Handle saving of a row in the editor
|
||
|
|
*/
|
||
|
|
buttonOptions[PMA_messages.strSave] = function () {
|
||
|
|
//Find changed values by comparing form values with selectedRow Object
|
||
|
|
var newValues = {};//Stores the values changed from original
|
||
|
|
var sqlTypes = {};
|
||
|
|
var it = 0;
|
||
|
|
var xChange = false;
|
||
|
|
var yChange = false;
|
||
|
|
var key;
|
||
|
|
for (key in selectedRow) {
|
||
|
|
var oldVal = selectedRow[key];
|
||
|
|
var newVal = ($('#edit_fields_null_id_' + it).prop('checked')) ? null : $('#edit_fieldID_' + it).val();
|
||
|
|
if (newVal instanceof Array) { // when the column is of type SET
|
||
|
|
newVal = $('#edit_fieldID_' + it).map(function () {
|
||
|
|
return $(this).val();
|
||
|
|
}).get().join(",");
|
||
|
|
}
|
||
|
|
if (oldVal != newVal) {
|
||
|
|
selectedRow[key] = newVal;
|
||
|
|
newValues[key] = newVal;
|
||
|
|
if (key == xLabel) {
|
||
|
|
xChange = true;
|
||
|
|
searchedData[searchedDataKey][xLabel] = newVal;
|
||
|
|
} else if (key == yLabel) {
|
||
|
|
yChange = true;
|
||
|
|
searchedData[searchedDataKey][yLabel] = newVal;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
var $input = $('#edit_fieldID_' + it);
|
||
|
|
if ($input.hasClass('bit')) {
|
||
|
|
sqlTypes[key] = 'bit';
|
||
|
|
}
|
||
|
|
it++;
|
||
|
|
} //End data update
|
||
|
|
|
||
|
|
//Update the chart series and replot
|
||
|
|
if (xChange || yChange) {
|
||
|
|
//Logic similar to plot generation, replot only if xAxis changes or yAxis changes.
|
||
|
|
//Code includes a lot of checks so as to replot only when necessary
|
||
|
|
if (xChange) {
|
||
|
|
xCord[searchedDataKey] = selectedRow[xLabel];
|
||
|
|
// [searchedDataKey][0] contains the x value
|
||
|
|
if (xType == 'numeric') {
|
||
|
|
series[0][searchedDataKey][0] = selectedRow[xLabel];
|
||
|
|
} else if (xType == 'time') {
|
||
|
|
series[0][searchedDataKey][0] =
|
||
|
|
getTimeStamp(selectedRow[xLabel], $('#types_0').val());
|
||
|
|
} else {
|
||
|
|
// TODO: text values
|
||
|
|
}
|
||
|
|
currentChart.series[0].data = series[0];
|
||
|
|
// TODO: axis changing
|
||
|
|
currentChart.replot();
|
||
|
|
|
||
|
|
}
|
||
|
|
if (yChange) {
|
||
|
|
yCord[searchedDataKey] = selectedRow[yLabel];
|
||
|
|
// [searchedDataKey][1] contains the y value
|
||
|
|
if (yType == 'numeric') {
|
||
|
|
series[0][searchedDataKey][1] = selectedRow[yLabel];
|
||
|
|
} else if (yType == 'time') {
|
||
|
|
series[0][searchedDataKey][1] =
|
||
|
|
getTimeStamp(selectedRow[yLabel], $('#types_1').val());
|
||
|
|
} else {
|
||
|
|
// TODO: text values
|
||
|
|
}
|
||
|
|
currentChart.series[0].data = series[0];
|
||
|
|
// TODO: axis changing
|
||
|
|
currentChart.replot();
|
||
|
|
}
|
||
|
|
} //End plot update
|
||
|
|
|
||
|
|
//Generate SQL query for update
|
||
|
|
if (!isEmpty(newValues)) {
|
||
|
|
var sql_query = 'UPDATE `' + PMA_commonParams.get('table') + '` SET ';
|
||
|
|
for (key in newValues) {
|
||
|
|
sql_query += '`' + key + '`=';
|
||
|
|
var value = newValues[key];
|
||
|
|
|
||
|
|
// null
|
||
|
|
if (value === null) {
|
||
|
|
sql_query += 'NULL, ';
|
||
|
|
|
||
|
|
// empty
|
||
|
|
} else if ($.trim(value) === '') {
|
||
|
|
sql_query += "'', ";
|
||
|
|
|
||
|
|
// other
|
||
|
|
} else {
|
||
|
|
// type explicitly identified
|
||
|
|
if (sqlTypes[key] !== null) {
|
||
|
|
if (sqlTypes[key] == 'bit') {
|
||
|
|
sql_query += "b'" + value + "', ";
|
||
|
|
}
|
||
|
|
// type not explicitly identified
|
||
|
|
} else {
|
||
|
|
if (!isNumeric(value)) {
|
||
|
|
sql_query += "'" + value + "', ";
|
||
|
|
} else {
|
||
|
|
sql_query += value + ', ';
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
// remove two extraneous characters ', '
|
||
|
|
sql_query = sql_query.substring(0, sql_query.length - 2);
|
||
|
|
sql_query += ' WHERE ' + PMA_urldecode(searchedData[searchedDataKey].where_clause);
|
||
|
|
|
||
|
|
//Post SQL query to sql.php
|
||
|
|
$.post('sql.php', {
|
||
|
|
'token' : PMA_commonParams.get('token'),
|
||
|
|
'db' : PMA_commonParams.get('db'),
|
||
|
|
'ajax_request' : true,
|
||
|
|
'sql_query' : sql_query,
|
||
|
|
'inline_edit' : false
|
||
|
|
}, function (data) {
|
||
|
|
if (data.success === true) {
|
||
|
|
$('#sqlqueryresults').html(data.sql_query);
|
||
|
|
$("#sqlqueryresults").trigger('appendAnchor');
|
||
|
|
} else {
|
||
|
|
PMA_ajaxShowMessage(data.error, false);
|
||
|
|
}
|
||
|
|
}); //End $.post
|
||
|
|
}//End database update
|
||
|
|
$("#dataDisplay").dialog('close');
|
||
|
|
};
|
||
|
|
buttonOptions[PMA_messages.strCancel] = function () {
|
||
|
|
$(this).dialog('close');
|
||
|
|
};
|
||
|
|
$("#dataDisplay").dialog({
|
||
|
|
autoOpen: false,
|
||
|
|
title: PMA_messages.strDataPointContent,
|
||
|
|
modal: true,
|
||
|
|
buttons: buttonOptions,
|
||
|
|
width: $('#dataDisplay').width() + 80,
|
||
|
|
open: function () {
|
||
|
|
$(this).find('input[type=checkbox]').css('margin', '0.5em');
|
||
|
|
}
|
||
|
|
});
|
||
|
|
/**
|
||
|
|
* Attach Ajax event handlers for input fields
|
||
|
|
* in the dialog. Used to submit the Ajax
|
||
|
|
* request when the ENTER key is pressed.
|
||
|
|
*/
|
||
|
|
$("#dataDisplay").find(':input').live('keydown', function (e) {
|
||
|
|
if (e.which === 13) { // 13 is the ENTER key
|
||
|
|
e.preventDefault();
|
||
|
|
if (typeof buttonOptions[PMA_messages.strSave] === 'function') {
|
||
|
|
buttonOptions[PMA_messages.strSave].call();
|
||
|
|
}
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
|
||
|
|
/*
|
||
|
|
* Generate plot using jqplot
|
||
|
|
*/
|
||
|
|
|
||
|
|
if (searchedData !== null) {
|
||
|
|
$('#zoom_search_form')
|
||
|
|
.slideToggle()
|
||
|
|
.hide();
|
||
|
|
$('#togglesearchformlink')
|
||
|
|
.text(PMA_messages.strShowSearchCriteria);
|
||
|
|
$('#togglesearchformdiv').show();
|
||
|
|
var selectedRow;
|
||
|
|
var colorCodes = ['#FF0000', '#00FFFF', '#0000FF', '#0000A0', '#FF0080', '#800080', '#FFFF00', '#00FF00', '#FF00FF'];
|
||
|
|
var series = [];
|
||
|
|
var xCord = [];
|
||
|
|
var yCord = [];
|
||
|
|
var tempX, tempY;
|
||
|
|
var it = 0;
|
||
|
|
var xMax; // xAxis extreme max
|
||
|
|
var xMin; // xAxis extreme min
|
||
|
|
var yMax; // yAxis extreme max
|
||
|
|
var yMin; // yAxis extreme min
|
||
|
|
var xVal;
|
||
|
|
var yVal;
|
||
|
|
var format;
|
||
|
|
|
||
|
|
var options = {
|
||
|
|
series: [
|
||
|
|
// for a scatter plot
|
||
|
|
{ showLine: false }
|
||
|
|
],
|
||
|
|
grid: {
|
||
|
|
drawBorder: false,
|
||
|
|
shadow: false,
|
||
|
|
background: 'rgba(0,0,0,0)'
|
||
|
|
},
|
||
|
|
axes: {
|
||
|
|
xaxis: {
|
||
|
|
label: $('#tableid_0').val(),
|
||
|
|
labelRenderer: $.jqplot.CanvasAxisLabelRenderer
|
||
|
|
},
|
||
|
|
yaxis: {
|
||
|
|
label: $('#tableid_1').val(),
|
||
|
|
labelRenderer: $.jqplot.CanvasAxisLabelRenderer
|
||
|
|
}
|
||
|
|
},
|
||
|
|
highlighter: {
|
||
|
|
show: true,
|
||
|
|
tooltipAxes: 'y',
|
||
|
|
yvalues: 2,
|
||
|
|
// hide the first y value
|
||
|
|
formatString: '<span class="hide">%s</span>%s'
|
||
|
|
},
|
||
|
|
cursor: {
|
||
|
|
show: true,
|
||
|
|
zoom: true,
|
||
|
|
showTooltip: false
|
||
|
|
}
|
||
|
|
};
|
||
|
|
|
||
|
|
// If data label is not set, do not show tooltips
|
||
|
|
if (dataLabel === '') {
|
||
|
|
options.highlighter.show = false;
|
||
|
|
}
|
||
|
|
|
||
|
|
// Classify types as either numeric,time,text
|
||
|
|
xType = getType(xType);
|
||
|
|
yType = getType(yType);
|
||
|
|
|
||
|
|
// could have multiple series but we'll have just one
|
||
|
|
series[0] = [];
|
||
|
|
|
||
|
|
if (xType == 'time') {
|
||
|
|
var originalXType = $('#types_0').val();
|
||
|
|
if (originalXType == 'date') {
|
||
|
|
format = '%Y-%m-%d';
|
||
|
|
}
|
||
|
|
// TODO: does not seem to work
|
||
|
|
//else if (originalXType == 'time') {
|
||
|
|
// format = '%H:%M';
|
||
|
|
//} else {
|
||
|
|
// format = '%Y-%m-%d %H:%M';
|
||
|
|
//}
|
||
|
|
$.extend(options.axes.xaxis, {
|
||
|
|
renderer: $.jqplot.DateAxisRenderer,
|
||
|
|
tickOptions: {
|
||
|
|
formatString: format
|
||
|
|
}
|
||
|
|
});
|
||
|
|
}
|
||
|
|
if (yType == 'time') {
|
||
|
|
var originalYType = $('#types_1').val();
|
||
|
|
if (originalYType == 'date') {
|
||
|
|
format = '%Y-%m-%d';
|
||
|
|
}
|
||
|
|
$.extend(options.axes.yaxis, {
|
||
|
|
renderer: $.jqplot.DateAxisRenderer,
|
||
|
|
tickOptions: {
|
||
|
|
formatString: format
|
||
|
|
}
|
||
|
|
});
|
||
|
|
}
|
||
|
|
|
||
|
|
$.each(searchedData, function (key, value) {
|
||
|
|
if (xType == 'numeric') {
|
||
|
|
xVal = parseFloat(value[xLabel]);
|
||
|
|
}
|
||
|
|
if (xType == 'time') {
|
||
|
|
xVal = getTimeStamp(value[xLabel], originalXType);
|
||
|
|
}
|
||
|
|
if (yType == 'numeric') {
|
||
|
|
yVal = parseFloat(value[yLabel]);
|
||
|
|
}
|
||
|
|
if (yType == 'time') {
|
||
|
|
yVal = getTimeStamp(value[yLabel], originalYType);
|
||
|
|
}
|
||
|
|
series[0].push([
|
||
|
|
xVal,
|
||
|
|
yVal,
|
||
|
|
// extra Y values
|
||
|
|
value[dataLabel], // for highlighter
|
||
|
|
// (may set an undefined value)
|
||
|
|
value.where_clause, // for click on point
|
||
|
|
key // key from searchedData
|
||
|
|
]);
|
||
|
|
});
|
||
|
|
|
||
|
|
// under IE 8, the initial display is mangled; after a manual
|
||
|
|
// resizing, it's ok
|
||
|
|
// under IE 9, everything is fine
|
||
|
|
currentChart = $.jqplot('querychart', series, options);
|
||
|
|
currentChart.resetZoom();
|
||
|
|
|
||
|
|
$('button.button-reset').click(function (event) {
|
||
|
|
event.preventDefault();
|
||
|
|
currentChart.resetZoom();
|
||
|
|
});
|
||
|
|
|
||
|
|
$('div#resizer').resizable();
|
||
|
|
$('div#resizer').bind('resizestop', function (event, ui) {
|
||
|
|
// make room so that the handle will still appear
|
||
|
|
$('div#querychart').height($('div#resizer').height() * 0.96);
|
||
|
|
$('div#querychart').width($('div#resizer').width() * 0.96);
|
||
|
|
currentChart.replot({resetAxes: true});
|
||
|
|
});
|
||
|
|
|
||
|
|
$('div#querychart').bind('jqplotDataClick',
|
||
|
|
function (event, seriesIndex, pointIndex, data) {
|
||
|
|
searchedDataKey = data[4]; // key from searchedData (global)
|
||
|
|
var field_id = 0;
|
||
|
|
var post_params = {
|
||
|
|
'ajax_request' : true,
|
||
|
|
'get_data_row' : true,
|
||
|
|
'db' : PMA_commonParams.get('db'),
|
||
|
|
'table' : PMA_commonParams.get('table'),
|
||
|
|
'where_clause' : data[3],
|
||
|
|
'token' : PMA_commonParams.get('token')
|
||
|
|
};
|
||
|
|
|
||
|
|
$.post('tbl_zoom_select.php', post_params, function (data) {
|
||
|
|
// Row is contained in data.row_info,
|
||
|
|
// now fill the displayResultForm with row values
|
||
|
|
var key;
|
||
|
|
for (key in data.row_info) {
|
||
|
|
$field = $('#edit_fieldID_' + field_id);
|
||
|
|
$field_null = $('#edit_fields_null_id_' + field_id);
|
||
|
|
if (data.row_info[key] === null) {
|
||
|
|
$field_null.prop('checked', true);
|
||
|
|
$field.val('');
|
||
|
|
} else {
|
||
|
|
$field_null.prop('checked', false);
|
||
|
|
if ($field.attr('multiple')) { // when the column is of type SET
|
||
|
|
$field.val(data.row_info[key].split(','));
|
||
|
|
} else {
|
||
|
|
$field.val(data.row_info[key]);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
field_id++;
|
||
|
|
}
|
||
|
|
selectedRow = {};
|
||
|
|
selectedRow = data.row_info;
|
||
|
|
});
|
||
|
|
|
||
|
|
$("#dataDisplay").dialog("open");
|
||
|
|
}
|
||
|
|
);
|
||
|
|
}
|
||
|
|
});
|