Fixed few bugs and changed the node create/edit view to use the dialog

(tabbed) UI.

Also, fixed few bugs pointed by Dave:
* Open the URL in separate browser tab/window.
* Fixed few CSS changes for look and feel for the dialog view
* Some of the panels were not listed in the context menu for the
  wcDocker.

web/pgadmin/browser/static/js/frame.js

@@ -5,7 +5,7 @@ function(_, pgAdmin) {
   pgAdmin.Browser = pgAdmin.Browser || {};
   pgAdmin.Browser.Frame = function(options) {
     var defaults = [
-      'name', 'title', 'width', 'height', 'showTitle', 'isClosable',
+      'name', 'title', 'width', 'height', 'showTitle', 'isCloseable',
       'isPrivate', 'url'];
     _.extend(this, _.pick(options, defaults));
   }
@@ -31,7 +31,7 @@ function(_, pgAdmin) {
           myPanel.initSize(that.width, that.height);
           if (myPanel.showTitle == false)
             myPanle.title(false);
-          myPanel.closeable(that.isCloseable == true);
+          myPanel.closeable(!!that.isCloseable);
 
           var $frameArea = $('<div style="width:100%;height:100%;position:relative;display:table">');
           myPanel.layout().addItem($frameArea);

web/pgadmin/browser/static/js/panel.js

@@ -31,7 +31,7 @@ function(_, pgAdmin) {
               myPanel.title(false);
             else
               myPanel.title(title || that.title);
-            myPanel.closeable(that.isCloseable == true);
+            myPanel.closeable(!!that.isCloseable);
             myPanel.layout().addItem(
               $('<div>', {
                 'class': 'pg-panel-content'

web/pgadmin/browser/templates/browser/js/browser.js

@@ -147,9 +147,9 @@ OWNER TO helpdesk;\n';
         title: '{{ panel_item.title }}',
         width: {{ panel_item.width }},
         height: {{ panel_item.height }},
-        showTitle: (Boolean('{{ panel_item.showTitle|lower }}') == true),
+        showTitle: {% if panel_item.showTitle %}true{% else %}false{% endif %},
-        isCloseable: (Boolean('{{ panel_item.isCloseable|lower }}') == true),
+        isCloseable: {% if panel_item.isCloseable %}true{% else %}false{% endif %},
-        isPrivate: (Boolean('{{ panel_item.isPrivate|lower }}') == true),
+        isPrivate: {% if panel_item.isPrivate %}true{% else %}false{% endif %},
         content: '{{ panel_item.content }}'{% if panel_item.events is not none %},
         events: {{ panel_item.events }} {% endif %}
       }){% endif %}{% endfor %}
@@ -170,9 +170,9 @@ OWNER TO helpdesk;\n';
         title: '{{ panel_item.title }}',
         width: {{ panel_item.width }},
         height: {{ panel_item.height }},
-        showTitle: (Boolean('{{ panel_item.showTitle|lower }}') == true),
+        showTitle: {% if panel_item.showTitle %}true{% else %}false{% endif %},
-        isCloseable: (Boolean('{{ panel_item.isCloseable|lower }}') == true),
+        isCloseable: {% if panel_item.isCloseable %}true{% else %}false{% endif %},
-        isPrivate: (Boolean('{{ panel_item.isPrivate|lower }}') == true),
+        isPrivate: {% if panel_item.isPrivate %}true{% else %}false{% endif %},
         url: '{{ panel_item.content }}'
      }){% endif %}{% endfor %}
     },
@@ -298,7 +298,7 @@ OWNER TO helpdesk;\n';
       // Initialize the Docker
       obj.docker = new wcDocker(
         '#dockerContainer', {
-        allowContextMenu: false,
+        allowContextMenu: true,
         allowCollapse: false,
         themePath: '../static/css/wcDocker/Themes',
         theme: 'pgadmin'
@@ -566,10 +566,10 @@ OWNER TO helpdesk;\n';
                 name: m.name, label: m.label, module: m.module,
                 category: m.category, callback: m.callback,
                 priority: m.priority, data: m.data, url: m.url,
-                icon: m.icon, enable: (m.enable == '' ? true :
+                target: m.target, icon: m.icon,
-                  (_.isString(m.enable) &&
+                enable: (m.enable == '' ? true : (_.isString(m.enable) &&
                    m.enable.toLowerCase() == 'false') ?
-                  false : m.enable)
+                  false : !!m.enable)
               });
             }
           } else  {

web/pgadmin/browser/templates/browser/js/node.js

@@ -244,8 +244,8 @@ function($, _, S, pgAdmin, Menu, Backbone, Alertify, Backform) {
       p = new pgBrowser.Panel({
           name: 'node_props',
           showTitle: true,
-          isCloseable: false,
+          isCloseable: true,
-          isPrivate: false,
+          isPrivate: true,
           content: '<div class="obj_properties">No object selected!</div>'
         });
       p.load(pgBrowser.docker);
@@ -623,7 +623,7 @@ function($, _, S, pgAdmin, Menu, Backbone, Alertify, Backform) {
           // Make sure the HTML element is empty.
           j.empty();
           // Create a view to edit/create the properties in fieldsets
-          view = that.getView(action, content, data, 'fieldset');
+          view = that.getView(action, content, data, 'dialog');
 
           if (view) {
             // Save it to release it later

web/pgadmin/help/__init__.py

@@ -26,19 +26,19 @@ class HelpModule(PgAdminModule):
             MenuItem(name='mnu_online_help',
                      label=gettext('Online Help'),
                      priority=100,
-                     target='blank',
+                     target='_blank',
                      url=url_for('help.static', filename='index.html')),
 
             MenuItem(name='mnu_pgadmin_website',
                      label= gettext('pgAdmin Website'),
                      priority= 200,
-                     target= 'blank',
+                     target= '_blank',
                      url= 'http://www.pgadmin.org/' ),
 
             MenuItem(name= 'mnu_postgresql_website',
                      label= gettext('PostgreSQL Website'),
                      priority= 300,
-                     target= 'blank',
+                     target= '_blank',
                      url= 'http://www.postgresql.org/' )]}
 
     def get_panels(self):

web/pgadmin/static/css/overrides.css

@@ -188,11 +188,27 @@ iframe {
 }
 
 .obj_properties .backform-tab {
-    width: 100%;
+    position: absolute;
+    margin: 0px 0px 80px;
+    padding: 0px;
+    top: 0px;
+    bottom: 0px;
+    left: 0px;
+    right: 0px;
+}
+
+.obj_properties .backform-tab > .nav-tabs {
+    background-color: #DADADA;
+}
+
+.obj_properties .backform-tab > .tab-content {
+    padding: 0px;
+    overflow-y: auto;
+    max-height: 100%;
 }
 
 .backform-tab .tab-pane {
-    padding: 1em;
+    padding: 7px;
 }
 
 .form-group fieldset .caret {

web/pgadmin/static/css/wcDocker/Themes/pgadmin.css

@@ -37,8 +37,8 @@
 .wcFrameButton {
   width: 20px;
   height: 20px;
-  border: 2px solid #eeeeee;
+  border: 2px solid #8A0D0D;
-  background-color: #eeeeee;
+  background-color: #A56D6D;
   font-size: 12px;
 }
 
@@ -47,13 +47,11 @@
 }
 
 .wcFrameButton:hover {
-  border: 2px solid #cccccc;
+  border: 2px solid #CCCCCC;
-  background-color: #cccccc;
 }
 
 .wcFrameButton:active {
-  border: 2px solid #dddddd;
+  border: 2px solid #DDDDDD;
-  background-color: #dddddd;
 }
 
 .wcFrameButtonToggled, .wcFrameButtonToggled:hover {
@@ -133,7 +131,7 @@
 }
 
 .wcFloating .wcPanelTabActive {
-  background-color: #8A8A8A;
+  background-color: rgb(33, 81, 128);
   margin-top: -2px;
   font-weight: bold;
   color: white;
@@ -248,9 +246,15 @@
 
 .wcFloating .wcFrameTitleBar {
   border-bottom: 2px solid darkgray;
-  background-color: #8A8A8A;
+  background-color: rgb(33, 81, 128);
 }
 
 .wcFloating .wcFrameTitleBar:hover {
   background-color: #AAAAAA;
 }
+
+.wcFrameButtonBar {
+  top: 7px;
+  right: 5px;
+  color: white;
+}