Allow the user to configure tabs in the SQL editor. Fixes #1406

web/pgadmin/browser/__init__.py

@@ -189,22 +189,10 @@ class BrowserModule(PgAdminModule):
     def register_preferences(self):
         self.show_system_objects = self.preference.register(
             'display', 'show_system_objects',
-            gettext("Show system objects"), 'boolean', False,
+            gettext("Show system objects?"), 'boolean', False,
             category_label=gettext('Display')
         )
 
-        self.sql_font_size = self.preference.register(
-            'display', 'sql_font_size',
-            gettext("Font size"), 'numeric', '1',
-            min_val=0.1,
-            max_val=10,
-            category_label=gettext('Display'),
-            help_str=gettext('The font size to use for the SQL text boxes and editors. '
-                             'The value specified is in "em" units, in which 1 is the default relative font size. '
-                             'For example, to increase the font size by 20% use a value of 1.2, or to reduce by 20%, '
-                             'use a value of 0.8. Minimum 0.1, maximum 10.')
-        )
-
 blueprint = BrowserModule(MODULE_NAME, __name__)
 
 
@@ -506,6 +494,15 @@ def browser_js():
     edbas_help_path_pref = prefs.preference('edbas_help_path')
     edbas_help_path = edbas_help_path_pref.get()
 
+    # Get sqleditor options
+    prefs = Preferences.module('sqleditor')
+
+    editor_tab_size_pref = prefs.preference('tab_size')
+    editor_tab_size = editor_tab_size_pref.get()
+
+    editor_use_spaces_pref = prefs.preference('use_spaces')
+    editor_use_spaces = editor_use_spaces_pref.get()
+
     for submodule in current_blueprint.submodules:
         snippets.extend(submodule.jssnippets)
     return make_response(
@@ -515,6 +512,8 @@ def browser_js():
             jssnippets=snippets,
             pg_help_path=pg_help_path,
             edbas_help_path=edbas_help_path,
+            editor_tab_size=editor_tab_size,
+            editor_use_spaces=editor_use_spaces,
             _=gettext
         ),
         200, {'Content-Type': 'application/x-javascript'})
@@ -570,7 +569,7 @@ def browser_css():
     snippets = []
 
     # Get configurable options
-    prefs = Preferences.module('browser')
+    prefs = Preferences.module('sqleditor')
 
     sql_font_size_pref = prefs.preference('sql_font_size')
     sql_font_size = round(float(sql_font_size_pref.get()), 2)

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

@@ -321,7 +321,8 @@ function(require, $, _, S, Bootstrap, pgAdmin, alertify, CodeMirror) {
             lineWrapping: true,
             mode: "text/x-pgsql",
             readOnly: true,
-            extraKeys: pgAdmin.Browser.editor_shortcut_keys
+            extraKeys: pgAdmin.Browser.editor_shortcut_keys,
+            tabSize: pgAdmin.Browser.editor_options.tabSize
           });
 
       setTimeout(function() {
@@ -711,7 +712,7 @@ function(require, $, _, S, Bootstrap, pgAdmin, alertify, CodeMirror) {
       return preference;
     },
 
-    editor_shortcut_keys:  {
+    editor_shortcut_keys: {
       // Autocomplete sql command
       "Ctrl-Space": "autocomplete",
       "Cmd-Space": "autocomplete",
@@ -741,10 +742,18 @@ function(require, $, _, S, Bootstrap, pgAdmin, alertify, CodeMirror) {
       "Cmd-Alt-Left": "goGroupLeft",
       "Ctrl-Alt-Right": "goGroupRight",
       "Cmd-Alt-Right": "goGroupRight"
+    },
+    editor_options: {
+      tabSize: '{{ editor_tab_size }}'
     }
 
   });
 
+  // Use spaces instead of tab
+  if ('{{ editor_use_spaces }}' == 'True') {
+    pgAdmin.Browser.editor_shortcut_keys.Tab = "insertSoftTab";
+  }
+
   window.onbeforeunload = function(ev) {
     var e = ev || window.event,
         msg = '{{ _('Do you really want to leave the page?') }}';

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

@@ -438,11 +438,11 @@
       '    <label>',
       '      <input type="checkbox" class="<%=extraClasses.join(\' \')%>" name="<%=name%>" <%=value ? "checked=\'checked\'" : ""%> <%=disabled ? "disabled" : ""%> <%=required ? "required" : ""%> />',
       '    </label>',
+      '   <% if (helpMessage && helpMessage.length) { %>',
+      '     <span class="<%=Backform.helpMessageClassName%>"><%=helpMessage%></span>',
+      '   <% } %>',
       '  </div>',
       '</div>',
-      '<% if (helpMessage && helpMessage.length) { %>',
-      '  <span class="<%=Backform.helpMessageClassName%>"><%=helpMessage%></span>',
-      '<% } %>'
     ].join("\n")),
     getValueFromDOM: function() {
       return this.formatter.toRaw(
@@ -1393,7 +1393,8 @@
         lineWrapping: true,
         mode: "text/x-pgsql",
         readOnly: true,
-        extraKeys: pgAdmin.Browser.editor_shortcut_keys
+        extraKeys: pgAdmin.Browser.editor_shortcut_keys,
+        tabSize: pgAdmin.Browser.editor_options.tabSize
       });
 
       return this;
@@ -2120,7 +2121,8 @@
             lineNumbers: true,
             mode: "text/x-sql",
             readOnly: isDisabled,
-            extraKeys: pgAdmin.Browser.editor_shortcut_keys
+            extraKeys: pgAdmin.Browser.editor_shortcut_keys,
+            tabSize: pgAdmin.Browser.editor_options.tabSize
           });
 
       if (!isVisible)

web/pgadmin/tools/datagrid/templates/datagrid/js/datagrid.js

@@ -244,7 +244,8 @@ define(
                   matchBrackets: true,
                   indentUnit: 4,
                   mode: "text/x-pgsql",
-                  extraKeys: pgBrowser.editor_shortcut_keys
+                  extraKeys: pgBrowser.editor_shortcut_keys,
+                  tabSize: pgBrowser.editor_options.tabSize
                 });
               },
 

web/pgadmin/tools/debugger/templates/debugger/js/direct.js

@@ -1423,7 +1423,8 @@ define(
           gutters: ["CodeMirror-linenumbers", "CodeMirror-foldgutter", "breakpoints"],
           mode: "text/x-pgsql",
           readOnly: true,
-          extraKeys: pgAdmin.Browser.editor_shortcut_keys
+          extraKeys: pgAdmin.Browser.editor_shortcut_keys,
+          tabSize: pgAdmin.Browser.editor_options.tabSize
         });
 
         // On loading the docker, register the callbacks

web/pgadmin/tools/sqleditor/__init__.py

@@ -128,6 +128,34 @@ class SqlEditorModule(PgAdminModule):
             category_label=gettext('Options')
         )
 
+        self.sql_font_size = self.preference.register(
+            'Options', 'sql_font_size',
+            gettext("Font size"), 'numeric', '1',
+            min_val=0.1,
+            max_val=10,
+            category_label=gettext('Display'),
+            help_str=gettext('The font size to use for the SQL text boxes and editors. '
+                             'The value specified is in "em" units, in which 1 is the default relative font size. '
+                             'For example, to increase the font size by 20% use a value of 1.2, or to reduce by 20%, '
+                             'use a value of 0.8. Minimum 0.1, maximum 10.')
+        )
+
+        self.tab_size = self.preference.register(
+            'Options', 'tab_size',
+            gettext("Tab size"), 'integer', 4,
+            min_val=2,
+            max_val=8,
+            category_label=gettext('Options'),
+            help_str=gettext('The number of spaces per tab. Minimum 2, maximum 8.')
+        )
+
+        self.use_spaces = self.preference.register(
+            'Options', 'use_spaces',
+            gettext("Use spaces?"), 'boolean', False,
+            category_label=gettext('Options'),
+            help_str=gettext('Specifies whether or not to insert spaces instead of tabs when the tab key is used.')
+        )
+
 
 blueprint = SqlEditorModule(MODULE_NAME, __name__, static_url_path='/static')
 
@@ -979,9 +1007,13 @@ def auto_complete(trans_id):
 @login_required
 def script():
     """render the required javascript"""
-    return Response(response=render_template("sqleditor/js/sqleditor.js", _=gettext),
+    return Response(response=render_template("sqleditor/js/sqleditor.js",
+                    tab_size=blueprint.tab_size.get(),
+                    use_spaces=blueprint.use_spaces.get(),
+                    _=gettext),
                     status=200,
-                    mimetype="application/javascript")
+                    mimetype="application/javascript"
+           )
 
 
 def is_begin_required(query):

web/pgadmin/tools/sqleditor/templates/sqleditor/js/sqleditor.js

@@ -212,7 +212,8 @@ define(
                                 CodeMirror.pgadminLoopRangeFinder, CodeMirror.pgadminCaseRangeFinder)
             },
             gutters: ["CodeMirror-linenumbers", "CodeMirror-foldgutter"],
-            extraKeys: pgBrowser.editor_shortcut_keys
+            extraKeys: pgBrowser.editor_shortcut_keys,
+            tabSize: pgAdmin.Browser.editor_options.tabSize
         });
 
         // Create main wcDocker instance
@@ -254,7 +255,8 @@ define(
                                 CodeMirror.pgadminLoopRangeFinder, CodeMirror.pgadminCaseRangeFinder)
             },
             gutters: ["CodeMirror-linenumbers", "CodeMirror-foldgutter"],
-            extraKeys: pgBrowser.editor_shortcut_keys
+            extraKeys: pgBrowser.editor_shortcut_keys,
+            tabSize: pgAdmin.Browser.editor_options.tabSize
         });
 
         // Create panels for 'Data Output', 'Explain', 'Messages' and 'History'