Fix bug #4069 Navigation tree height not set correctly dynamically

This commit is contained in:
J.M 2013-08-26 22:16:04 +02:00
commit 90c46bccab
4 changed files with 23 additions and 5 deletions

View File

@ -31,7 +31,7 @@ $(function () {
event.stopImmediatePropagation();
PMA_expandNavigationTree($(this));
});
/**
* Register event handler for click on the reload
* navigation icon at the top of the panel
@ -329,7 +329,7 @@ function PMA_autoExpandDatabaseInUse($oldDb, $newDb) {
//scroll to new database
if ($oldDb !== $newDb) {
setTimeout(function() {
scrollToView($expandElem.closest('li'), $('#pma_navigation_tree_content'));
scrollToView($expandElem.closest('li'), $('#pma_navigation_tree_content'));
}, 150);
}
}
@ -630,6 +630,17 @@ var ResizeHandler = function () {
event.data.resize_handler.setWidth(panel_width);
event.data.resize_handler.panel_width = width;
};
/**
* Even thandler for resizing the navigation tree height on window resize
*
* @return void
*/
this.treeResize = function (event) {
var $nav = $("#pma_navigation"),
$nav_tree = $("#pma_navigation_tree"),
$nav_header = $("#pma_navigation_header");
$nav_tree.height($nav.height() - $nav_header.height());
};
/* Initialisation section begins here */
if ($.cookie('pma_navi_width')) {
// If we have a cookie, set the width of the panel to its value
@ -647,6 +658,11 @@ var ResizeHandler = function () {
$collapser.live('click', {'resize_handler': this}, this.collapse);
// Add the correct arrow symbol to the collapser
$collapser.html(this.getSymbol($('#pma_navigation').width()));
// Fix navigation tree height
$(window).on('resize', this.treeResize);
// need to call this now and then, browser might decide
// to show/hide horizontal scrollbars depending on page content width
setInterval(this.treeResize, 2000);
}; // End of ResizeHandler
/**

View File

@ -41,6 +41,7 @@ class PMA_NavigationHeader
$buffer .= '<div id="pma_navigation_resizer"></div>';
$buffer .= '<div id="pma_navigation_collapser"></div>';
$buffer .= '<div id="pma_navigation_content">';
$buffer .= '<div id="pma_navigation_header">';
$buffer .= sprintf(
'<a class="hide navigation_url" href="navigation.php%s"></a>',
$link_url
@ -54,6 +55,7 @@ class PMA_NavigationHeader
__('Loading…'),
array('style' => 'visibility: hidden;', 'class' => 'throbber')
);
$buffer .= '</div>'; // pma_navigation_header
$buffer .= '<div id="pma_navigation_tree"' . $class . '>';
return $buffer;
}

View File

@ -105,7 +105,7 @@ if (! defined('PMA_MINIMUM_COMMON') && ! defined('TESTSUITE')) {
/* Navigation tree*/
#pma_navigation_tree {
margin: 0.5em 0 0;
margin: 0;
margin-<?php echo $left; ?>: 1em;
color: #444;
height: 74%;

View File

@ -73,7 +73,7 @@ if (! defined('PMA_MINIMUM_COMMON') && ! defined('TESTSUITE')) {
#pma_navigation #databaseList,
#pma_navigation div.pageselector.dbselector {
text-align: center;
margin: 5px 10px 0px;
padding: 5px 10px 0px;
border: 0;
}
@ -90,7 +90,7 @@ if (! defined('PMA_MINIMUM_COMMON') && ! defined('TESTSUITE')) {
/* Navigation tree*/
#pma_navigation_tree {
margin: 5px 0 0;
margin: 0;
margin-<?php echo $left; ?>: 10px;
color: #444;
height: 74%; /*it needs to be dynamically set*/