1 /* vim: set expandtab sw=4 ts=4 sts=4: */
3 * @fileoverview functions used wherever an sql query form is used
6 * @requires js/functions.js
14 * decode a string URL_encoded
17 * @return string the URL-decoded string
19 function PMA_urldecode (str) {
20 if (typeof str !== 'undefined') {
21 return decodeURIComponent(str.replace(/\+/g, '%20'));
26 * endecode a string URL_decoded
29 * @return string the URL-encoded string
31 function PMA_urlencode (str) {
32 if (typeof str !== 'undefined') {
33 return encodeURIComponent(str).replace(/\%20/g, '+');
38 * Saves SQL query in local storage or cookie
40 * @param string SQL query
43 function PMA_autosaveSQL (query) {
45 if (isStorageSupported('localStorage')) {
46 window.localStorage.auto_saved_sql = query;
48 Cookies.set('auto_saved_sql', query);
54 * Saves SQL query with sort in local storage or cookie
56 * @param string SQL query
59 function PMA_autosaveSQLSort (query) {
61 if (isStorageSupported('localStorage')) {
62 window.localStorage.auto_saved_sql_sort = query;
64 Cookies.set('auto_saved_sql_sort', query);
70 * Get the field name for the current field. Required to construct the query
73 * @param $table_results enclosing results table
74 * @param $this_field jQuery object that points to the current field's tr
76 function getFieldName ($table_results, $this_field) {
77 var this_field_index = $this_field.index();
78 // ltr or rtl direction does not impact how the DOM was generated
79 // check if the action column in the left exist
80 var left_action_exist = !$table_results.find('th:first').hasClass('draggable');
81 // number of column span for checkbox and Actions
82 var left_action_skip = left_action_exist ? $table_results.find('th:first').attr('colspan') - 1 : 0;
84 // If this column was sorted, the text of the a element contains something
85 // like <small>1</small> that is useful to indicate the order in case
86 // of a sort on multiple columns; however, we dont want this as part
87 // of the column name so we strip it ( .clone() to .end() )
88 var field_name = $table_results
90 .find('th:eq(' + (this_field_index - left_action_skip) + ') a')
91 .clone() // clone the element
92 .children() // select all the children
93 .remove() // remove all of them
94 .end() // go back to the selected element
95 .text(); // grab the text
96 // happens when just one row (headings contain no a)
97 if (field_name === '') {
98 var $heading = $table_results.find('thead').find('th:eq(' + (this_field_index - left_action_skip) + ')').children('span');
99 // may contain column comment enclosed in a span - detach it temporarily to read the column name
100 var $tempColComment = $heading.children().detach();
101 field_name = $heading.text();
102 // re-attach the column comment
103 $heading.append($tempColComment);
106 field_name = $.trim(field_name);
112 * Unbind all event handlers before tearing down a page
114 AJAX.registerTeardown('sql.js', function () {
115 $(document).off('click', 'a.delete_row.ajax');
116 $(document).off('submit', '.bookmarkQueryForm');
117 $('input#bkm_label').off('keyup');
118 $(document).off('makegrid', '.sqlqueryresults');
119 $(document).off('stickycolumns', '.sqlqueryresults');
120 $('#togglequerybox').off('click');
121 $(document).off('click', '#button_submit_query');
122 $(document).off('change', '#id_bookmark');
123 $('input[name=\'bookmark_variable\']').off('keypress');
124 $(document).off('submit', '#sqlqueryform.ajax');
125 $(document).off('click', 'input[name=navig].ajax');
126 $(document).off('submit', 'form[name=\'displayOptionsForm\'].ajax');
127 $(document).off('mouseenter', 'th.column_heading.pointer');
128 $(document).off('mouseleave', 'th.column_heading.pointer');
129 $(document).off('click', 'th.column_heading.marker');
130 $(window).off('scroll');
131 $(document).off('keyup', '.filter_rows');
132 $(document).off('click', '#printView');
133 if (codemirror_editor) {
134 codemirror_editor.off('change');
136 $('#sqlquery').off('input propertychange');
138 $('body').off('click', '.navigation .showAllRows');
139 $('body').off('click', 'a.browse_foreign');
140 $('body').off('click', '#simulate_dml');
141 $('body').off('keyup', '#sqlqueryform');
142 $('body').off('click', 'form[name="resultsForm"].ajax button[name="submit_mult"], form[name="resultsForm"].ajax input[name="submit_mult"]');
146 * @description <p>Ajax scripts for sql and browse pages</p>
148 * Actions ajaxified here:
150 * <li>Retrieve results of an SQL query</li>
151 * <li>Paginate the results table</li>
152 * <li>Sort the results table</li>
153 * <li>Change table according to display options</li>
154 * <li>Grid editing of data</li>
155 * <li>Saving a bookmark</li>
158 * @name document.ready
161 AJAX.registerOnload('sql.js', function () {
163 if (codemirror_editor) {
164 codemirror_editor.on('change', function () {
165 PMA_autosaveSQL(codemirror_editor.getValue());
168 $('#sqlquery').on('input propertychange', function () {
169 PMA_autosaveSQL($('#sqlquery').val());
171 // Save sql query with sort
172 $('select[name="sql_query"]').on('change', function () {
173 PMA_autosaveSQLSort($('select[name="sql_query"]').val());
175 // If sql query with sort for current table is stored, change sort by key select value
176 var sortStoredQuery = (isStorageSupported('localStorage') && typeof window.localStorage.auto_saved_sql_sort !== 'undefined') ? window.localStorage.auto_saved_sql_sort : Cookies.get('auto_saved_sql_sort');
177 if (typeof sortStoredQuery !== 'undefined' && sortStoredQuery !== $('select[name="sql_query"]').val() && $('select[name="sql_query"] option[value="' + sortStoredQuery + '"]').length !== 0) {
178 $('select[name="sql_query"]').val(sortStoredQuery).change();
183 // Delete row from SQL results
184 $(document).on('click', 'a.delete_row.ajax', function (e) {
186 var question = PMA_sprintf(PMA_messages.strDoYouReally, escapeHtml($(this).closest('td').find('div').text()));
188 $link.PMA_confirm(question, $link.attr('href'), function (url) {
189 $msgbox = PMA_ajaxShowMessage();
190 var params = 'ajax_request=1&is_js_confirmed=1';
191 if ($link.attr('data-post')) {
192 params += '&' + $link.attr('data-post');
194 $.post(url, params, function (data) {
196 PMA_ajaxShowMessage(data.message);
197 $link.closest('tr').remove();
199 PMA_ajaxShowMessage(data.error, false);
205 // Ajaxification for 'Bookmark this SQL query'
206 $(document).on('submit', '.bookmarkQueryForm', function (e) {
208 PMA_ajaxShowMessage();
209 $.post($(this).attr('action'), 'ajax_request=1&' + $(this).serialize(), function (data) {
211 PMA_ajaxShowMessage(data.message);
213 PMA_ajaxShowMessage(data.error, false);
218 /* Hides the bookmarkoptions checkboxes when the bookmark label is empty */
219 $('input#bkm_label').keyup(function () {
220 $('input#id_bkm_all_users, input#id_bkm_replace')
222 .toggle($(this).val().length > 0);
226 * Attach Event Handler for 'Copy to clipbpard
228 $(document).on('click', '#copyToClipBoard', function (event) {
229 event.preventDefault();
231 var textArea = document.createElement('textarea');
234 // *** This styling is an extra step which is likely not required. ***
236 // Why is it here? To ensure:
237 // 1. the element is able to have focus and selection.
238 // 2. if element was to flash render it has minimal visual impact.
239 // 3. less flakyness with selection and copying which **might** occur if
240 // the textarea element is not visible.
242 // The likelihood is the element won't even render, not even a flash,
243 // so some of these are just precautions. However in IE the element
244 // is visible whilst the popup box asking the user for permission for
245 // the web page to copy to the clipboard.
248 // Place in top-left corner of screen regardless of scroll position.
249 textArea.style.position = 'fixed';
250 textArea.style.top = 0;
251 textArea.style.left = 0;
253 // Ensure it has a small width and height. Setting to 1px / 1em
254 // doesn't work as this gives a negative w/h on some browsers.
255 textArea.style.width = '2em';
256 textArea.style.height = '2em';
258 // We don't need padding, reducing the size if it does flash render.
259 textArea.style.padding = 0;
261 // Clean up any borders.
262 textArea.style.border = 'none';
263 textArea.style.outline = 'none';
264 textArea.style.boxShadow = 'none';
266 // Avoid flash of white box if rendered for any reason.
267 textArea.style.background = 'transparent';
271 $('#serverinfo a').each(function () {
272 textArea.value += $(this).text().split(':')[1].trim() + '/';
274 textArea.value += '\t\t' + window.location.href;
275 textArea.value += '\n';
276 $('.success').each(function () {
277 textArea.value += $(this).text() + '\n\n';
280 $('.sql pre').each(function () {
281 textArea.value += $(this).text() + '\n\n';
284 $('.table_results .column_heading a').each(function () {
285 //Don't copy ordering number text within <small> tag
286 textArea.value += $(this).clone().find('small').remove().end().text() + '\t';
289 textArea.value += '\n';
290 $('.table_results tbody tr').each(function () {
291 $(this).find('.data span').each(function () {
292 textArea.value += $(this).text() + '\t';
294 textArea.value += '\n';
297 document.body.appendChild(textArea);
302 document.execCommand('copy');
304 alert('Sorry! Unable to copy');
307 document.body.removeChild(textArea);
308 }); // end of Copy to Clipboard action
311 * Attach Event Handler for 'Print' link
313 $(document).on('click', '#printView', function (event) {
314 event.preventDefault();
316 // Take to preview mode
318 }); // end of 'Print' action
321 * Attach the {@link makegrid} function to a custom event, which will be
322 * triggered manually everytime the table of results is reloaded
325 $(document).on('makegrid', '.sqlqueryresults', function () {
326 $('.table_results').each(function () {
332 * Attach a custom event for sticky column headings which will be
333 * triggered manually everytime the table of results is reloaded
336 $(document).on('stickycolumns', '.sqlqueryresults', function () {
337 $('.sticky_columns').remove();
338 $('.table_results').each(function () {
339 var $table_results = $(this);
340 // add sticky columns div
341 var $stick_columns = initStickyColumns($table_results);
342 rearrangeStickyColumns($stick_columns, $table_results);
343 // adjust sticky columns on scroll
344 $(window).on('scroll', function () {
345 handleStickyColumns($stick_columns, $table_results);
351 * Append the "Show/Hide query box" message to the query input form
354 * @name appendToggleSpan
356 // do not add this link more than once
357 if (! $('#sqlqueryform').find('a').is('#togglequerybox')) {
358 $('<a id="togglequerybox"></a>')
359 .html(PMA_messages.strHideQueryBox)
360 .appendTo('#sqlqueryform')
361 // initially hidden because at this point, nothing else
362 // appears under the link
365 // Attach the toggling of the query box visibility to a click
366 $('#togglequerybox').bind('click', function () {
368 $link.siblings().slideToggle('fast');
369 if ($link.text() === PMA_messages.strHideQueryBox) {
370 $link.text(PMA_messages.strShowQueryBox);
371 // cheap trick to add a spacer between the menu tabs
372 // and "Show query box"; feel free to improve!
373 $('#togglequerybox_spacer').remove();
374 $link.before('<br id="togglequerybox_spacer" />');
376 $link.text(PMA_messages.strHideQueryBox);
378 // avoid default click action
385 * Event handler for sqlqueryform.ajax button_submit_query
389 $(document).on('click', '#button_submit_query', function (event) {
390 $('.success,.error').hide();
391 // hide already existing error or success message
392 var $form = $(this).closest('form');
393 // the Go button related to query submission was clicked,
394 // instead of the one related to Bookmarks, so empty the
395 // id_bookmark selector to avoid misinterpretation in
396 // import.php about what needs to be done
397 $form.find('select[name=id_bookmark]').val('');
398 // let normal event propagation happen
402 * Event handler to show appropiate number of variable boxes
403 * based on the bookmarked query
405 $(document).on('change', '#id_bookmark', function (event) {
406 var varCount = $(this).find('option:selected').data('varcount');
407 if (typeof varCount === 'undefined') {
411 var $varDiv = $('#bookmark_variables');
413 for (var i = 1; i <= varCount; i++) {
414 $varDiv.append($('<label for="bookmark_variable_' + i + '">' + PMA_sprintf(PMA_messages.strBookmarkVariable, i) + '</label>'));
415 $varDiv.append($('<input type="text" size="10" name="bookmark_variable[' + i + ']" id="bookmark_variable_' + i + '"/>'));
418 if (varCount === 0) {
419 $varDiv.parent('.formelement').hide();
421 $varDiv.parent('.formelement').show();
426 * Event handler for hitting enter on sqlqueryform bookmark_variable
427 * (the Variable textfield in Bookmarked SQL query section)
431 $('input[name=bookmark_variable]').on('keypress', function (event) {
432 // force the 'Enter Key' to implicitly click the #button_submit_bookmark
433 var keycode = (event.keyCode ? event.keyCode : (event.which ? event.which : event.charCode));
434 if (keycode === 13) { // keycode for enter key
435 // When you press enter in the sqlqueryform, which
436 // has 2 submit buttons, the default is to run the
437 // #button_submit_query, because of the tabindex
439 // This submits #button_submit_bookmark instead,
440 // because when you are in the Bookmarked SQL query
441 // section and hit enter, you expect it to do the
442 // same action as the Go button in that section.
443 $('#button_submit_bookmark').click();
451 * Ajax Event handler for 'SQL Query Submit'
453 * @see PMA_ajaxShowMessage()
455 * @name sqlqueryform_submit
457 $(document).on('submit', '#sqlqueryform.ajax', function (event) {
458 event.preventDefault();
461 if (codemirror_editor) {
462 $form[0].elements.sql_query.value = codemirror_editor.getValue();
464 if (! checkSqlQuery($form[0])) {
468 // remove any div containing a previous error message
469 $('div.error').remove();
471 var $msgbox = PMA_ajaxShowMessage();
472 var $sqlqueryresultsouter = $('#sqlqueryresultsouter');
474 PMA_prepareForAjaxRequest($form);
476 $.post($form.attr('action'), $form.serialize() + '&ajax_page_request=true', function (data) {
477 if (typeof data !== 'undefined' && data.success === true) {
478 // success happens if the query returns rows or not
480 // show a message that stays on screen
481 if (typeof data.action_bookmark !== 'undefined') {
483 if ('1' === data.action_bookmark) {
484 $('#sqlquery').text(data.sql_query);
485 // send to codemirror if possible
486 setQuery(data.sql_query);
489 if ('2' === data.action_bookmark) {
490 $('#id_bookmark option[value=\'' + data.id_bookmark + '\']').remove();
491 // if there are no bookmarked queries now (only the empty option),
492 // remove the bookmark section
493 if ($('#id_bookmark option').length === 1) {
494 $('#fieldsetBookmarkOptions').hide();
495 $('#fieldsetBookmarkOptionsFooter').hide();
499 $sqlqueryresultsouter
502 PMA_highlightSQL($sqlqueryresultsouter);
505 if (history && history.pushState) {
506 history.replaceState({
511 AJAX.handleMenu.replace(data._menu);
513 PMA_MicroHistory.menus.replace(data._menu);
514 PMA_MicroHistory.menus.add(data._menuHash, data._menu);
516 } else if (data._menuHash) {
517 if (! (history && history.pushState)) {
518 PMA_MicroHistory.menus.replace(PMA_MicroHistory.menus.get(data._menuHash));
523 PMA_commonParams.setAll(data._params);
526 if (typeof data.ajax_reload !== 'undefined') {
527 if (data.ajax_reload.reload) {
528 if (data.ajax_reload.table_name) {
529 PMA_commonParams.set('table', data.ajax_reload.table_name);
530 PMA_commonActions.refreshMain();
532 PMA_reloadNavigation();
535 } else if (typeof data.reload !== 'undefined') {
536 // this happens if a USE or DROP command was typed
537 PMA_commonActions.setDb(data.db);
541 url = 'table_sql.php';
546 url = 'server_sql.php';
548 PMA_commonActions.refreshMain(url, function () {
549 $('#sqlqueryresultsouter')
552 PMA_highlightSQL($('#sqlqueryresultsouter'));
556 $('.sqlqueryresults').trigger('makegrid').trigger('stickycolumns');
557 $('#togglequerybox').show();
560 if (typeof data.action_bookmark === 'undefined') {
561 if ($('#sqlqueryform input[name="retain_query_box"]').is(':checked') !== true) {
562 if ($('#togglequerybox').siblings(':visible').length > 0) {
563 $('#togglequerybox').trigger('click');
567 } else if (typeof data !== 'undefined' && data.success === false) {
568 // show an error message that stays on screen
569 $sqlqueryresultsouter
573 PMA_ajaxRemoveMessage($msgbox);
575 }); // end SQL Query submit
578 * Ajax Event handler for the display options
580 * @name displayOptionsForm_submit
582 $(document).on('submit', 'form[name=\'displayOptionsForm\'].ajax', function (event) {
583 event.preventDefault();
587 var $msgbox = PMA_ajaxShowMessage();
588 $.post($form.attr('action'), $form.serialize() + '&ajax_request=true', function (data) {
589 PMA_ajaxRemoveMessage($msgbox);
590 var $sqlqueryresults = $form.parents('.sqlqueryresults');
594 .trigger('stickycolumns');
596 PMA_highlightSQL($sqlqueryresults);
598 }); // end displayOptionsForm handler
600 // Filter row handling. --STARTS--
601 $(document).on('keyup', '.filter_rows', function () {
602 var unique_id = $(this).data('for');
603 var $target_table = $('.table_results[data-uniqueId=\'' + unique_id + '\']');
604 var $header_cells = $target_table.find('th[data-column]');
605 var target_columns = Array();
606 // To handle colspan=4, in case of edit,copy etc options.
607 var dummy_th = ($('.edit_row_anchor').length !== 0 ?
608 '<th class="hide dummy_th"></th><th class="hide dummy_th"></th><th class="hide dummy_th"></th>'
610 // Selecting columns that will be considered for filtering and searching.
611 $header_cells.each(function () {
612 target_columns.push($.trim($(this).text()));
615 var phrase = $(this).val();
616 // Set same value to both Filter rows fields.
617 $('.filter_rows[data-for=\'' + unique_id + '\']').not(this).val(phrase);
619 $target_table.find('thead > tr').prepend(dummy_th);
620 $.uiTableFilter($target_table, phrase, target_columns);
621 $target_table.find('th.dummy_th').remove();
623 // Filter row handling. --ENDS--
625 // Prompt to confirm on Show All
626 $('body').on('click', '.navigation .showAllRows', function (e) {
628 var $form = $(this).parents('form');
630 if (! $(this).is(':checked')) { // already showing all rows
633 $form.PMA_confirm(PMA_messages.strShowAllRowsWarning, $form.attr('action'), function (url) {
638 function submitShowAllForm () {
639 var submitData = $form.serialize() + '&ajax_request=true&ajax_page_request=true';
640 PMA_ajaxShowMessage();
642 $.post($form.attr('action'), submitData, AJAX.responseHandler);
646 $('body').on('keyup', '#sqlqueryform', function () {
647 PMA_handleSimulateQueryButton();
651 * Ajax event handler for 'Simulate DML'.
653 $('body').on('click', '#simulate_dml', function () {
654 var $form = $('#sqlqueryform');
656 var delimiter = $('#id_sql_delimiter').val();
657 var db_name = $form.find('input[name="db"]').val();
659 if (codemirror_editor) {
660 query = codemirror_editor.getValue();
662 query = $('#sqlquery').val();
665 if (query.length === 0) {
666 alert(PMA_messages.strFormEmpty);
667 $('#sqlquery').focus();
671 var $msgbox = PMA_ajaxShowMessage();
674 url: $form.attr('action'),
676 server: PMA_commonParams.get('server'),
681 sql_delimiter: delimiter
683 success: function (response) {
684 PMA_ajaxRemoveMessage($msgbox);
685 if (response.success) {
686 var dialog_content = '<div class="preview_sql">';
687 if (response.sql_data) {
688 var len = response.sql_data.length;
689 for (var i = 0; i < len; i++) {
690 dialog_content += '<strong>' + PMA_messages.strSQLQuery +
691 '</strong>' + response.sql_data[i].sql_query +
692 PMA_messages.strMatchedRows +
693 ' <a href="' + response.sql_data[i].matched_rows_url +
694 '">' + response.sql_data[i].matched_rows + '</a><br>';
696 dialog_content += '<hr>';
700 dialog_content += response.message;
702 dialog_content += '</div>';
703 var $dialog_content = $(dialog_content);
704 var button_options = {};
705 button_options[PMA_messages.strClose] = function () {
706 $(this).dialog('close');
708 var $response_dialog = $('<div />').append($dialog_content).dialog({
712 buttons: button_options,
713 title: PMA_messages.strSimulateDML,
715 PMA_highlightSQL($(this));
722 PMA_ajaxShowMessage(response.error);
725 error: function (response) {
726 PMA_ajaxShowMessage(PMA_messages.strErrorProcessingRequest);
732 * Handles multi submits of results browsing page such as edit, delete and export
734 $('body').on('click', 'form[name="resultsForm"].ajax button[name="submit_mult"], form[name="resultsForm"].ajax input[name="submit_mult"]', function (e) {
736 var $button = $(this);
737 var $form = $button.closest('form');
738 var submitData = $form.serialize() + '&ajax_request=true&ajax_page_request=true&submit_mult=' + $button.val();
739 PMA_ajaxShowMessage();
741 $.post($form.attr('action'), submitData, AJAX.responseHandler);
746 * Starting from some th, change the class of all td under it.
747 * If isAddClass is specified, it will be used to determine whether to add or remove the class.
749 function PMA_changeClassForColumn ($this_th, newclass, isAddClass) {
750 // index 0 is the th containing the big T
751 var th_index = $this_th.index();
752 var has_big_t = $this_th.closest('tr').children(':first').hasClass('column_action');
753 // .eq() is zero-based
757 var $table = $this_th.parents('.table_results');
758 if (! $table.length) {
759 $table = $this_th.parents('table').siblings('.table_results');
761 var $tds = $table.find('tbody tr').find('td.data:eq(' + th_index + ')');
762 if (isAddClass === undefined) {
763 $tds.toggleClass(newclass);
765 $tds.toggleClass(newclass, isAddClass);
770 * Handles browse foreign values modal dialog
772 * @param object $this_a reference to the browse foreign value link
774 function browseForeignDialog ($this_a) {
775 var formId = '#browse_foreign_form';
776 var showAllId = '#foreign_showAll';
777 var tableId = '#browse_foreign_table';
778 var filterId = '#input_foreign_filter';
780 $.get($this_a.attr('href'), { 'ajax_request': true }, function (data) {
781 // Creates browse foreign value dialog
782 $dialog = $('<div>').append(data.message).dialog({
783 title: PMA_messages.strBrowseForeignValues,
784 width: Math.min($(window).width() - 100, 700),
785 maxHeight: $(window).height() - 100,
786 dialogClass: 'browse_foreign_modal',
787 close: function (ev, ui) {
788 // remove event handlers attached to elements related to dialog
789 $(tableId).off('click', 'td a.foreign_value');
790 $(formId).off('click', showAllId);
791 $(formId).off('submit');
792 // remove dialog itself
797 }).done(function () {
799 $(tableId).on('click', 'td a.foreign_value', function (e) {
801 var $input = $this_a.prev('input[type=text]');
802 // Check if input exists or get CEdit edit_box
803 if ($input.length === 0) {
804 $input = $this_a.closest('.edit_area').prev('.edit_box');
806 // Set selected value as input value
807 $input.val($(this).data('key'));
808 $dialog.dialog('close');
810 $(formId).on('click', showAllId, function () {
813 $(formId).on('submit', function (e) {
815 // if filter value is not equal to old value
816 // then reset page number to 1
817 if ($(filterId).val() !== $(filterId).data('old')) {
818 $(formId).find('select[name=pos]').val('0');
820 var postParams = $(this).serializeArray();
821 // if showAll button was clicked to submit form then
822 // add showAll button parameter to form
825 name: $(showAllId).attr('name'),
826 value: $(showAllId).val()
829 // updates values in dialog
830 $.post($(this).attr('action') + '?ajax_request=1', postParams, function (data) {
831 var $obj = $('<div>').html(data.message);
832 $(formId).html($obj.find(formId).html());
833 $(tableId).html($obj.find(tableId).html());
840 AJAX.registerOnload('sql.js', function () {
841 $('body').on('click', 'a.browse_foreign', function (e) {
843 browseForeignDialog($(this));
847 * vertical column highlighting in horizontal mode when hovering over the column header
849 $(document).on('mouseenter', 'th.column_heading.pointer', function (e) {
850 PMA_changeClassForColumn($(this), 'hover', true);
852 $(document).on('mouseleave', 'th.column_heading.pointer', function (e) {
853 PMA_changeClassForColumn($(this), 'hover', false);
857 * vertical column marking in horizontal mode when clicking the column header
859 $(document).on('click', 'th.column_heading.marker', function () {
860 PMA_changeClassForColumn($(this), 'marked');
864 * create resizable table
866 $('.sqlqueryresults').trigger('makegrid').trigger('stickycolumns');
872 function makeProfilingChart () {
873 if ($('#profilingchart').length === 0 ||
874 $('#profilingchart').html().length !== 0 ||
875 !$.jqplot || !$.jqplot.Highlighter || !$.jqplot.PieRenderer
881 $.each(JSON.parse($('#profilingChartData').html()), function (key, value) {
882 data.push([key, parseFloat(value)]);
885 // Remove chart and data divs contents
886 $('#profilingchart').html('').show();
887 $('#profilingChartData').html('');
889 PMA_createProfilingChart('profilingchart', data);
893 * initialize profiling data tables
895 function initProfilingTables () {
896 if (!$.tablesorter) {
900 $('#profiletable').tablesorter({
903 textExtraction: function (node) {
904 if (node.children.length > 0) {
905 return node.children[0].innerHTML;
907 return node.innerHTML;
912 $('#profilesummarytable').tablesorter({
915 textExtraction: function (node) {
916 if (node.children.length > 0) {
917 return node.children[0].innerHTML;
919 return node.innerHTML;
926 * Set position, left, top, width of sticky_columns div
928 function setStickyColumnsPosition ($sticky_columns, $table_results, position, top, left, margin_left) {
930 .css('position', position)
932 .css('left', left ? left : 'auto')
933 .css('margin-left', margin_left ? margin_left : '0px')
934 .css('width', $table_results.width());
938 * Initialize sticky columns
940 function initStickyColumns ($table_results) {
941 return $('<table class="sticky_columns"></table>')
942 .insertBefore($table_results)
943 .css('position', 'fixed')
944 .css('z-index', '99')
945 .css('width', $table_results.width())
946 .css('margin-left', $('#page_content').css('margin-left'))
947 .css('top', $('#floating_menubar').height())
948 .css('display', 'none');
952 * Arrange/Rearrange columns in sticky header
954 function rearrangeStickyColumns ($sticky_columns, $table_results) {
955 var $originalHeader = $table_results.find('thead');
956 var $originalColumns = $originalHeader.find('tr:first').children();
957 var $clonedHeader = $originalHeader.clone();
958 // clone width per cell
959 $clonedHeader.find('tr:first').children().width(function (i,val) {
960 var width = $originalColumns.eq(i).width();
961 var is_firefox = navigator.userAgent.indexOf('Firefox') > -1;
967 $sticky_columns.empty().append($clonedHeader);
971 * Adjust sticky columns on horizontal/vertical scroll for all tables
973 function handleAllStickyColumns () {
974 $('.sticky_columns').each(function () {
975 handleStickyColumns($(this), $(this).next('.table_results'));
980 * Adjust sticky columns on horizontal/vertical scroll
982 function handleStickyColumns ($sticky_columns, $table_results) {
983 var currentScrollX = $(window).scrollLeft();
984 var windowOffset = $(window).scrollTop();
985 var tableStartOffset = $table_results.offset().top;
986 var tableEndOffset = tableStartOffset + $table_results.height();
987 if (windowOffset >= tableStartOffset && windowOffset <= tableEndOffset) {
988 // for horizontal scrolling
989 if (prevScrollX !== currentScrollX) {
990 prevScrollX = currentScrollX;
991 setStickyColumnsPosition($sticky_columns, $table_results, 'absolute', $('#floating_menubar').height() + windowOffset - tableStartOffset);
992 // for vertical scrolling
994 setStickyColumnsPosition($sticky_columns, $table_results, 'fixed', $('#floating_menubar').height(), $('#pma_navigation').width() - currentScrollX, $('#page_content').css('margin-left'));
996 $sticky_columns.show();
998 $sticky_columns.hide();
1002 AJAX.registerOnload('sql.js', function () {
1003 makeProfilingChart();
1004 initProfilingTables();