Added a new control for rendering the notes to be used by different

tools/utitilities dialog.

Modified a little bit by Ashesh Vashi.

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

@@ -22,7 +22,8 @@ function(_, S, pgAdmin) {
     'NODE_HAS_NO_SQL': "{{ _("No SQL could be generated for the selected object.") }}",
     'NODE_HAS_NO_STATISTICS': "{{ _("No statistics are available for the selected object!") }}",
     'TRUE': "{{ _("True") }}",
-    'FALSE': "{{ _("False") }}"
+    'FALSE': "{{ _("False") }}",
+    'NOTE_CTRL_LABEL': "{{ _("Note") }}",
   };
 
   return pgBrowser.messages;

web/pgadmin/static/css/overrides.css

@@ -1094,3 +1094,21 @@ button.pg-alertify-button {
   font: normal normal normal 18px/1 FontAwesome;
   margin-right: 5px;
 }
+.backform_control_notes {
+  background-color: #f5f5f5;
+  border: 1px solid #ccc;
+  border-radius: 3px;
+  color: #333;
+  display: block;
+  font-family: Menlo,Monaco,Consolas,"Courier New",monospace;
+  font-size: 12px;
+  line-height: 1.42857;
+  margin: 0 0 10px;
+  overflow: auto;
+  padding: 5px 10px;
+  word-break: break-all;
+  word-wrap: break-word;
+}
+div.backform_control_notes label.control-label {
+  min-width: 0px;
+}

web/pgadmin/static/js/backform.pgadmin.js

@@ -67,7 +67,8 @@
     'collection': ['sub-node-collection', 'sub-node-collection', 'string'],
     'uniqueColCollection': ['unique-col-collection', 'unique-col-collection', 'string'],
     'switch' : 'switch',
-    'select2': 'select2'
+    'select2': 'select2',
+    'note': 'note'
   };
 
   var getMappedControl = Backform.getMappedControl = function(type, mode) {
@@ -2015,5 +2016,20 @@
     }
   });
 
+  // We will use this control just as a annotate in Backform
+  var NoteControl = Backform.NoteControl = Backform.Control.extend({
+    defaults: {
+      label: window.pgAdmin.Browser.messages.NOTE_CTRL_LABEL,
+      text: '',
+      extraClasses: [],
+      noteClass: 'backform_control_notes'
+    },
+    template: _.template([
+      '<div class="<%=noteClass%> col-xs-12 <%=extraClasses.join(\' \')%>">',
+      '<label class="control-label"><%=label%>:</label>',
+      '<span><%=text%></span></div>'
+    ].join("\n"))
+  });
+
   return Backform;
 }));