diff --git a/ChangeLog b/ChangeLog index 9120706be0..8956b4f1ed 100644 --- a/ChangeLog +++ b/ChangeLog @@ -9,6 +9,7 @@ phpMyAdmin - ChangeLog - bug Respect ['ShowCreateDb'] in the navi panel - bug #4392 Cannot see databases in nav panel on databases grouping when disabled database expansion - bug #4419 No more calendar into search tab +- bug #4398 Monitor should fit into screen width 4.2.1.0 (2014-05-13) - bug #4380 Cannot display table structure with enums containing special characters diff --git a/js/server_status_monitor.js b/js/server_status_monitor.js index 25b8375797..b601e95964 100644 --- a/js/server_status_monitor.js +++ b/js/server_status_monitor.js @@ -3,7 +3,8 @@ var runtime = {}, server_time_diff, server_os, is_superuser, - server_db_isLocal; + server_db_isLocal, + chartSize; AJAX.registerOnload('server_status_monitor.js', function () { var $js_data_form = $('#js_data'); server_time_diff = new Date().getTime() - $js_data_form.find("input[name=server_time]").val(); @@ -383,7 +384,7 @@ AJAX.registerOnload('server_status_monitor.js', function () { $("#chartGrid").sortableTable({ ignoreRect: { top: 8, - left: chartSize().width - 63, + left: chartSize.width - 63, width: 54, height: 24 } @@ -400,10 +401,13 @@ AJAX.registerOnload('server_status_monitor.js', function () { $('div.popupContent select[name="chartColumns"]').change(function () { monitorSettings.columns = parseInt(this.value, 10); - var newSize = chartSize(); - + calculateChartSize(); // Empty cells should keep their size so you can drop onto them - $('#chartGrid tr td').css('width', newSize.width + 'px'); + $('#chartGrid tr td').css('width', chartSize.width + 'px'); + $('#chartGrid .monitorChart').css({ + width: chartSize.width + 'px', + height: chartSize.height + 'px' + }); /* Reorder all charts that it fills all column cells */ var numColumns; @@ -441,7 +445,7 @@ AJAX.registerOnload('server_status_monitor.js', function () { } if (monitorSettings.gridMaxPoints == 'auto') { - runtime.gridMaxPoints = Math.round((newSize.width - 40) / 12); + runtime.gridMaxPoints = Math.round((chartSize.width - 40) / 12); } runtime.xmin = new Date().getTime() - server_time_diff - runtime.gridMaxPoints * monitorSettings.gridRefresh; @@ -451,6 +455,7 @@ AJAX.registerOnload('server_status_monitor.js', function () { $("#chartGrid").sortableTable('refresh'); } + refreshChartGrid(); saveMonitor(); // Save settings }); @@ -999,7 +1004,8 @@ AJAX.registerOnload('server_status_monitor.js', function () { } // Empty cells should keep their size so you can drop onto them - $('#chartGrid tr td').css('width', chartSize().width + 'px'); + calculateChartSize(); + $('#chartGrid tr td').css('width', chartSize.width + 'px'); buildRequiredDataList(); refreshChartGrid(); @@ -1026,11 +1032,18 @@ AJAX.registerOnload('server_status_monitor.js', function () { } /* Calculactes the dynamic chart size that depends on the column width */ - function chartSize() { - var wdt = $('#logTable').innerWidth() / monitorSettings.columns - (monitorSettings.columns - 1) * chartSpacing.width; - return { - width: wdt, - height: 0.75 * wdt + function calculateChartSize() { + var panelWidth; + if ($("body").height() > $(window).height()) { // has vertical scroll bar + panelWidth = $('#logTable').innerWidth(); + } else { + panelWidth = $('#logTable').innerWidth() - 10; // leave some space for vertical scroll bar + } + + var wdt = (panelWidth - monitorSettings.columns * chartSpacing.width) / monitorSettings.columns; + chartSize = { + width: Math.floor(wdt), + height: Math.floor(0.75 * wdt) }; } @@ -1115,10 +1128,15 @@ AJAX.registerOnload('server_status_monitor.js', function () { $('#chartGrid').append(''); } + if (!chartSize) { + calculateChartSize(); + } $('#chartGrid tr:last').append( '
' + - '
' + '
' + + '' ); } diff --git a/libraries/server_status_monitor.lib.php b/libraries/server_status_monitor.lib.php index b84f726252..8b8e40289c 100644 --- a/libraries/server_status_monitor.lib.php +++ b/libraries/server_status_monitor.lib.php @@ -345,10 +345,6 @@ function PMA_getHtmlForSettingsDialog() $retval .= ''; $retval .= ''; $retval .= ''; - $retval .= ''; - $retval .= ''; - $retval .= ''; - $retval .= ''; $retval .= ''; $retval .= ''; $retval .= '
'; diff --git a/themes/original/css/common.css.php b/themes/original/css/common.css.php index b9f71973f2..0603f76f5c 100644 --- a/themes/original/css/common.css.php +++ b/themes/original/css/common.css.php @@ -1023,10 +1023,15 @@ div#chartVariableSettings { margin-left:10px; } +table#chartGrid td { + padding: 3px; + margin: 0; +} + table#chartGrid div.monitorChart { background: #EBEBEB; - width: 400px; - height: 300px; + overflow: hidden; + border: none; } div#serverstatus div.tabLinks { diff --git a/themes/pmahomme/css/common.css.php b/themes/pmahomme/css/common.css.php index 438c8839ec..c056b4ab31 100644 --- a/themes/pmahomme/css/common.css.php +++ b/themes/pmahomme/css/common.css.php @@ -1336,10 +1336,15 @@ div#chartVariableSettings { margin-left: 10px; } +table#chartGrid td { + padding: 3px; + margin: 0; +} + table#chartGrid div.monitorChart { background: #EBEBEB; - width: 400px; - height: 300px; + overflow: hidden; + border: none; } div#serverstatus div.tabLinks {