Sever Variables Table UI Improvements
Signed-off-by: Madhura Jayaratne <madhura.cj@gmail.com>
This commit is contained in:
parent
629e08cbc4
commit
fc5bd53eba
@ -4,8 +4,6 @@
|
||||
* Unbind all event handlers before tearing down a page
|
||||
*/
|
||||
AJAX.registerTeardown('server_variables.js', function () {
|
||||
$('#serverVariables .var-row').unbind('mouseenter');
|
||||
$('#serverVariables .var-row').unbind('mouseleave');
|
||||
$('#filterText').unbind('keyup');
|
||||
$(document).off('click', 'a.editLink');
|
||||
$('#serverVariables').find('.var-name').find('a img').remove();
|
||||
@ -17,19 +15,8 @@ AJAX.registerOnload('server_variables.js', function () {
|
||||
var $cancelLink = $('a.cancelLink');
|
||||
var $filterField = $('#filterText');
|
||||
|
||||
/* Show edit link on hover */
|
||||
$('#serverVariables').delegate('.var-row', 'mouseenter', function (event) {
|
||||
var $elm = $(this).find('.var-value');
|
||||
// Only add edit element if the element is not being edited
|
||||
if ($elm.hasClass('editable') && ! $elm.hasClass('edit')) {
|
||||
$elm.prepend($editLink.clone().show());
|
||||
}
|
||||
});
|
||||
|
||||
$('#serverVariables').delegate('.var-row', 'mouseleave', function (event) {
|
||||
$(this).find('a.editLink').remove();
|
||||
})
|
||||
.find('.var-name').find('a').append(
|
||||
$('#serverVariables').find('.var-name').find('a').append(
|
||||
$('#docImage').clone().show()
|
||||
);
|
||||
|
||||
@ -81,15 +68,15 @@ AJAX.registerOnload('server_variables.js', function () {
|
||||
/* Allows the user to edit a server variable */
|
||||
function editVariable(link) {
|
||||
var $cell = $(link).parent();
|
||||
var $valueCell = $(link).parents('.var-row').find('.var-value');
|
||||
var varName = $cell.parent().find('.var-name').text().replace(/ /g, '_');
|
||||
var $mySaveLink = $saveLink.clone().show();
|
||||
var $myCancelLink = $cancelLink.clone().show();
|
||||
var $msgbox = PMA_ajaxShowMessage();
|
||||
var $myEditLink = $cell.find('a.editLink');
|
||||
|
||||
$cell
|
||||
.addClass('edit') // variable is being edited
|
||||
.find('a.editLink')
|
||||
.remove(); // remove edit link
|
||||
$cell.addClass('edit'); // variable is being edited
|
||||
$myEditLink.remove(); // remove edit link
|
||||
|
||||
$mySaveLink.click(function () {
|
||||
var $msgbox = PMA_ajaxShowMessage(PMA_messages.strProcessingRequest);
|
||||
@ -97,26 +84,25 @@ AJAX.registerOnload('server_variables.js', function () {
|
||||
ajax_request: true,
|
||||
type: 'setval',
|
||||
varName: varName,
|
||||
varValue: $cell.find('input').val()
|
||||
varValue: $valueCell.find('input').val()
|
||||
}, function (data) {
|
||||
if (data.success) {
|
||||
$cell
|
||||
$valueCell
|
||||
.html(data.variable)
|
||||
.data('content', data.variable);
|
||||
PMA_ajaxRemoveMessage($msgbox);
|
||||
} else {
|
||||
PMA_ajaxShowMessage(data.error, false);
|
||||
$cell.html($cell.data('content'));
|
||||
$valueCell.html($valueCell.data('content'));
|
||||
}
|
||||
$cell.removeClass('edit');
|
||||
$cell.removeClass('edit').html($myEditLink);
|
||||
});
|
||||
return false;
|
||||
});
|
||||
|
||||
$myCancelLink.click(function () {
|
||||
$cell
|
||||
.html($cell.data('content'))
|
||||
.removeClass('edit');
|
||||
$valueCell.html($valueCell.data('content'));
|
||||
$cell.removeClass('edit').html($myEditLink);
|
||||
return false;
|
||||
});
|
||||
|
||||
@ -126,11 +112,11 @@ AJAX.registerOnload('server_variables.js', function () {
|
||||
varName: varName
|
||||
}, function (data) {
|
||||
if (typeof data !== 'undefined' && data.success === true) {
|
||||
var $editor = $('<div />', {'class': 'serverVariableEditor'})
|
||||
var $links = $('<div />')
|
||||
.append($myCancelLink)
|
||||
.append(' ')
|
||||
.append($mySaveLink)
|
||||
.append(' ')
|
||||
.append(' ')
|
||||
.append($mySaveLink);
|
||||
var $editor = $('<div />', {'class': 'serverVariableEditor'})
|
||||
.append(
|
||||
$('<div/>').append(
|
||||
$('<input />', {type: 'text'}).val(data.message)
|
||||
@ -138,7 +124,9 @@ AJAX.registerOnload('server_variables.js', function () {
|
||||
);
|
||||
// Save and replace content
|
||||
$cell
|
||||
.data('content', $cell.html())
|
||||
.html($links);
|
||||
$valueCell
|
||||
.data('content', $valueCell.html())
|
||||
.html($editor)
|
||||
.find('input')
|
||||
.focus()
|
||||
@ -151,7 +139,7 @@ AJAX.registerOnload('server_variables.js', function () {
|
||||
});
|
||||
PMA_ajaxRemoveMessage($msgbox);
|
||||
} else {
|
||||
$cell.removeClass('edit');
|
||||
$cell.removeClass('edit').html($myEditLink);
|
||||
PMA_ajaxShowMessage(data.error);
|
||||
}
|
||||
});
|
||||
|
||||
@ -150,9 +150,7 @@ function PMA_formatVariable($name, $value, $variable_doc_links)
|
||||
function PMA_getHtmlForLinkTemplates()
|
||||
{
|
||||
$url = 'server_variables.php' . PMA_URL_getCommon();
|
||||
$output = '<a style="display: none;" href="#" class="editLink">';
|
||||
$output .= PMA_Util::getIcon('b_edit.png', __('Edit')) . '</a>';
|
||||
$output .= '<a style="display: none;" href="'
|
||||
$output = '<a style="display: none;" href="'
|
||||
. $url . '" class="ajax saveLink">';
|
||||
$output .= PMA_Util::getIcon('b_save.png', __('Save')) . '</a> ';
|
||||
$output .= '<a style="display: none;" href="#" class="cancelLink">';
|
||||
@ -160,12 +158,8 @@ function PMA_getHtmlForLinkTemplates()
|
||||
$output .= PMA_Util::getImage(
|
||||
'b_help.png',
|
||||
__('Documentation'),
|
||||
array(
|
||||
'style' => 'display:none',
|
||||
'id' => 'docImage'
|
||||
)
|
||||
array('style' => 'display:none', 'id' => 'docImage')
|
||||
);
|
||||
|
||||
return $output;
|
||||
}
|
||||
|
||||
@ -190,18 +184,19 @@ function PMA_getHtmlForServerVariables($variable_doc_links)
|
||||
. '</div>'
|
||||
. '</fieldset>';
|
||||
|
||||
$output .= '<div id="serverVariables" class="data filteredData noclick">'
|
||||
. '<div class="var-header var-row">'
|
||||
. '<div class="var-name">' . __('Variable') . '</div>'
|
||||
. '<div class="var-value valueHeader">'
|
||||
$output .= '<table id="serverVariables" class="data filteredData noclick">'
|
||||
. '<thead><tr class="var-header var-row">'
|
||||
. '<td class="var-action">' . __('Action') . '</td>'
|
||||
. '<td class="var-name">' . __('Variable') . '</td>'
|
||||
. '<td class="var-value">'
|
||||
. __('Session value') . ' / ' . __('Global value')
|
||||
. '</div>'
|
||||
. '<div style="clear:both"></div>'
|
||||
. '</div>';
|
||||
. '</td>'
|
||||
. '</tr>'
|
||||
. '</thead>';
|
||||
|
||||
$output .= PMA_getHtmlForServerVariablesItems($variable_doc_links);
|
||||
|
||||
$output .= '</div>';
|
||||
$output .= '</table>';
|
||||
|
||||
return $output;
|
||||
}
|
||||
@ -223,7 +218,7 @@ function PMA_getHtmlForServerVariablesItems($variable_doc_links)
|
||||
= $GLOBALS['dbi']->fetchResult('SHOW SESSION VARIABLES;', 0, 1);
|
||||
$serverVars = $GLOBALS['dbi']->fetchResult('SHOW GLOBAL VARIABLES;', 0, 1);
|
||||
|
||||
$output = '';
|
||||
$output = '<tbody>';
|
||||
$odd_row = true;
|
||||
foreach ($serverVars as $name => $value) {
|
||||
$has_session_value = isset($serverVarsSession[$name])
|
||||
@ -231,9 +226,14 @@ function PMA_getHtmlForServerVariablesItems($variable_doc_links)
|
||||
$row_class = ($odd_row ? ' odd' : ' even')
|
||||
. ($has_session_value ? ' diffSession' : '');
|
||||
|
||||
$output .= '<div class="var-row' . $row_class . '">'
|
||||
. '<div class="var-name">';
|
||||
$output .= '<tr class="var-row' . $row_class . '">';
|
||||
|
||||
$output .= '<td class="var-action">';
|
||||
$output .= '<a href="#" class="editLink">'
|
||||
. PMA_Util::getIcon('b_edit.png', __('Edit')) . '</a>';
|
||||
$output .= '</td>';
|
||||
|
||||
$output .= '<td class="var-name">';
|
||||
// To display variable documentation link
|
||||
if (isset($variable_doc_links[$name])) {
|
||||
$output .= '<span title="'
|
||||
@ -250,29 +250,30 @@ function PMA_getHtmlForServerVariablesItems($variable_doc_links)
|
||||
} else {
|
||||
$output .= htmlspecialchars(str_replace('_', ' ', $name));
|
||||
}
|
||||
$output .= '</div>'
|
||||
. '<div class="var-value value'
|
||||
$output .= '</td>';
|
||||
|
||||
$output .= '<td class="var-value value'
|
||||
. ($GLOBALS['dbi']->isSuperuser() ? ' editable' : '') . '"> '
|
||||
. PMA_formatVariable($name, $value, $variable_doc_links)
|
||||
. '</div>'
|
||||
. '<div style="clear:both"></div>'
|
||||
. '</div>';
|
||||
. '</td>'
|
||||
. '</tr>';
|
||||
|
||||
if ($has_session_value) {
|
||||
$output .= '<div class="var-row' . ($odd_row ? ' odd' : ' even') . '">'
|
||||
. '<div class="var-name session">(' . __('Session value') . ')</div>'
|
||||
. '<div class="var-value value"> '
|
||||
$output .= '<tr class="var-row' . ($odd_row ? ' odd' : ' even') . '">'
|
||||
. '<td class="var-action"></td>'
|
||||
. '<td class="var-name session">(' . __('Session value') . ')</td>'
|
||||
. '<td class="var-value value"> '
|
||||
. PMA_formatVariable(
|
||||
$name,
|
||||
$serverVarsSession[$name],
|
||||
$variable_doc_links
|
||||
) . '</div>'
|
||||
. '<div style="clear:both"></div>'
|
||||
. '</div>';
|
||||
) . '</td>'
|
||||
. '</tr>';
|
||||
}
|
||||
|
||||
$odd_row = ! $odd_row;
|
||||
}
|
||||
$output .= '</tbody>';
|
||||
|
||||
return $output;
|
||||
}
|
||||
|
||||
@ -1106,9 +1106,10 @@ div#logTable table {
|
||||
|
||||
/* server variables */
|
||||
#serverVariables {
|
||||
min-width: 30em;
|
||||
table-layout: fixed;
|
||||
width: 100%;
|
||||
}
|
||||
#serverVariables .var-row > div {
|
||||
#serverVariables .var-row > tr {
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
@ -1120,15 +1121,17 @@ div#logTable table {
|
||||
color: <?php echo $GLOBALS['cfg']['ThColor']; ?>;
|
||||
background: <?php echo $GLOBALS['cfg']['ThBackground']; ?>;
|
||||
}
|
||||
#serverVariables .var-header .var-value {
|
||||
#serverVariables .var-header {
|
||||
text-align: <?php echo $left; ?>;
|
||||
}
|
||||
#serverVariables .var-row {
|
||||
padding: 0.5em;
|
||||
min-height: 18px;
|
||||
}
|
||||
#serverVariables .var-action {
|
||||
width: 120px;
|
||||
}
|
||||
#serverVariables .var-name {
|
||||
width: 45%;
|
||||
float: <?php echo $left; ?>;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
@ -1459,9 +1459,10 @@ div#queryAnalyzerDialog table.queryNums {
|
||||
|
||||
/* server variables */
|
||||
#serverVariables {
|
||||
min-width: 30em;
|
||||
table-layout: fixed;
|
||||
width: 100%;
|
||||
}
|
||||
#serverVariables .var-row > div {
|
||||
#serverVariables .var-row > td {
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
@ -1473,15 +1474,17 @@ div#queryAnalyzerDialog table.queryNums {
|
||||
<?php echo $_SESSION['PMA_Theme']->getCssGradient('ffffff', 'cccccc'); ?>
|
||||
font-weight: bold;
|
||||
}
|
||||
#serverVariables .var-header .var-value {
|
||||
#serverVariables .var-header {
|
||||
text-align: <?php echo $left; ?>;
|
||||
}
|
||||
#serverVariables .var-row {
|
||||
padding: 0.5em;
|
||||
min-height: 18px;
|
||||
}
|
||||
#serverVariables .var-action {
|
||||
width: 120px;
|
||||
}
|
||||
#serverVariables .var-name {
|
||||
width: 45%;
|
||||
float: <?php echo $left; ?>;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user