diff --git a/web/pgadmin/browser/static/js/frame.js b/web/pgadmin/browser/static/js/frame.js
index 8fc535873..135db6b9a 100644
--- a/web/pgadmin/browser/static/js/frame.js
+++ b/web/pgadmin/browser/static/js/frame.js
@@ -7,7 +7,7 @@ function(_, pgAdmin) {
pgAdmin.Browser.Frame = function(options) {
var defaults = [
'name', 'title', 'width', 'height', 'showTitle', 'isCloseable',
- 'isPrivate', 'url', 'icon'];
+ 'isPrivate', 'url', 'icon', 'onCreate'];
_.extend(this, _.pick(options, defaults));
}
@@ -23,6 +23,7 @@ function(_, pgAdmin) {
icon: '',
panel: null,
frame: null,
+ onCreate: null,
load: function(docker) {
var that = this;
if (!that.panel) {
@@ -85,6 +86,10 @@ function(_, pgAdmin) {
wcDocker.EVENT.SCROLLED], function(ev) {
myPanel.on(ev, that.eventFunc.bind(myPanel, ev));
});
+
+ if (that.onCreate && _.isFunction(that.onCreate)) {
+ that.onCreate.apply(that, [myPanel, frame, $container]);
+ }
}
});
}
diff --git a/web/pgadmin/browser/static/js/panel.js b/web/pgadmin/browser/static/js/panel.js
index 73302331f..8d6ffcb6a 100644
--- a/web/pgadmin/browser/static/js/panel.js
+++ b/web/pgadmin/browser/static/js/panel.js
@@ -7,7 +7,7 @@ function(_, pgAdmin) {
pgAdmin.Browser.Panel = function(options) {
var defaults = [
'name', 'title', 'width', 'height', 'showTitle', 'isCloseable',
- 'isPrivate', 'content', 'icon', 'events'];
+ 'isPrivate', 'content', 'icon', 'events', 'onCreate'];
_.extend(this, _.pick(options, defaults));
}
@@ -22,6 +22,7 @@ function(_, pgAdmin) {
content: '',
icon: '',
panel: null,
+ onCreate: null,
load: function(docker, title) {
var that = this;
if (!that.panel) {
@@ -40,13 +41,12 @@ function(_, pgAdmin) {
myPanel.icon(that.icon)
}
+ var $container = $('
', {
+ 'class': 'pg-panel-content'
+ }).append($(that.content));
+
myPanel.closeable(!!that.isCloseable);
- myPanel.layout().addItem(
- $('
', {
- 'class': 'pg-panel-content'
- })
- .append($(that.content))
- );
+ myPanel.layout().addItem($container);
that.panel = myPanel;
if (that.events && _.isObject(that.events)) {
_.each(that.events, function(v, k) {
@@ -67,6 +67,10 @@ function(_, pgAdmin) {
wcDocker.EVENT.SCROLLED], function(ev) {
myPanel.on(ev, that.eventFunc.bind(myPanel, ev));
});
+
+ if (that.onCreate && _.isFunction(that.onCreate)) {
+ that.onCreate.apply(that, [myPanel, $container]);
+ }
}
});
}
diff --git a/web/pgadmin/browser/templates/browser/js/browser.js b/web/pgadmin/browser/templates/browser/js/browser.js
index 9f3d248cc..885eaf57a 100644
--- a/web/pgadmin/browser/templates/browser/js/browser.js
+++ b/web/pgadmin/browser/templates/browser/js/browser.js
@@ -69,7 +69,10 @@ function(require, $, _, S, Bootstrap, pgAdmin, alertify, CodeMirror) {
isCloseable: false,
isPrivate: true,
content: '
{{ _('Please select an object in the tree view.') }}
',
- events: panelEvents
+ events: panelEvents,
+ onCreate: function(myPanel, $container) {
+ $container.addClass('pg-no-overflow');
+ }
}),
// Statistics of the object
'statistics': new pgAdmin.Browser.Panel({
diff --git a/web/pgadmin/browser/templates/browser/js/node.js b/web/pgadmin/browser/templates/browser/js/node.js
index 890c3dc1e..23d559c1a 100644
--- a/web/pgadmin/browser/templates/browser/js/node.js
+++ b/web/pgadmin/browser/templates/browser/js/node.js
@@ -241,7 +241,10 @@ function($, _, S, pgAdmin, Menu, Backbone, Alertify, pgBrowser, Backform) {
showTitle: true,
isCloseable: true,
isPrivate: true,
- content: '
{{ _('Please select an object in the tree view.') }}
'
+ content: '
{{ _('Please wait while we fetch information about the node from the server!') }}
',
+ onCreate: function(myPanel, $container) {
+ $container.addClass('pg-no-overflow');
+ }
});
p.load(pgBrowser.docker);
},
diff --git a/web/pgadmin/static/css/overrides.css b/web/pgadmin/static/css/overrides.css
index e90603d19..662805d7b 100755
--- a/web/pgadmin/static/css/overrides.css
+++ b/web/pgadmin/static/css/overrides.css
@@ -375,14 +375,23 @@ iframe {
padding-top: 0;
padding-right: 0;
padding-left: 0;
+ height: 100%;
}
+/* A generic class to make the overflow hidden of a DOM element */
+.pg-no-overflow {
+ overflow: hidden;
+}
+
+
.pg-prop-has-btn-group-below {
margin-bottom: 33px;
}
.has-pg-prop-btn-group {
- top: 48px;
+ top: 39px;
+ padding-top: 8px;
+ height: calc(100% - 39px);
}
.pg-prop-content > div {