Hi,
PFA updated patch,
1) Added Keyboard shortcuts to comment line, uncomment line and
comment/uncomment block of code also added drop-down for the same.
2) Also added options for indent & unindent code in the same drop-down.
3) Updated shortcut documents accordingly.
Please review.
On Mon, Jul 17, 2017 at 3:05 PM, Dave Page <[email protected]> wrote:
> Hi
>
> On Mon, Jul 17, 2017 at 10:31 AM, Murtuza Zabuawala <
> [email protected]> wrote:
>
>> Hi Dave,
>>
>> On Mon, Jul 17, 2017 at 2:33 PM, Dave Page <[email protected]> wrote:
>>
>>> Hi
>>>
>>> On Wed, Jul 12, 2017 at 1:16 PM, Murtuza Zabuawala <
>>> [email protected]> wrote:
>>>
>>>> Hi,
>>>>
>>>> PFA patch which will add functionality to allow user to
>>>> comment/uncomment code in query editor.
>>>> RM#2456
>>>>
>>>
>>> This is cool, but I'm not sure it's right as-is:
>>>
>>> * I prefer SQL style commenting, e.g.
>>>
>>> -- This is a comment
>>>
>>> Should we make that a config option if CodeMirror can do it? Or a
>>> different hotkey?
>>>
>>>
>> I'll check the extension code and update you accordingly, and It will be
>> good idea to keep the both the options because with large code block
>> current style works the best.
>>
>
> Right.
>
>
>> * You've added it as an option to the Clear XXX dropdown, which really
>>> isn't the right place in my opinion. Should we add a new drop down for
>>> this, and include some/all of the other Editing options on there? E.g.
>>> tab/shift-tab.
>>>
>>> I thought that is misc options dropdown for our editor, but I don't see
>> any point adding new drop down for one single option, Can we add new button
>> instead?
>>
>
> I think you missed this bit: "and include some/all of the other Editing
> options on there? E.g. tab/shift-tab.". Essentially, we'd be adding an Edit
> menu...
>
>
>> * I think the docs should say Ctrl+Shift+/ rather than Shift+Ctrl+/, and
>>> be ordered in the table to reflect that. It seems more natural to me.
>>>
>>> Initially I wrote ctrl + shift + /only but when I saw all other
>> shortcuts starts with Shift , then I changed it to shift + ctrl + / :)
>>
>
> No they don't - Ctrl+Alt+Left for example. I believe it's normal to put
> Ctrl first, then Shift as it's a modifier.
>
>
>> Thoughts?
>>>
>>> --
>>> Dave Page
>>> Blog: http://pgsnake.blogspot.com
>>> Twitter: @pgsnake
>>>
>>> EnterpriseDB UK: http://www.enterprisedb.com
>>> The Enterprise PostgreSQL Company
>>>
>>
>>
>
>
> --
> Dave Page
> Blog: http://pgsnake.blogspot.com
> Twitter: @pgsnake
>
> EnterpriseDB UK: http://www.enterprisedb.com
> The Enterprise PostgreSQL Company
>
diff --git a/docs/en_US/keyboard_shortcuts.rst
b/docs/en_US/keyboard_shortcuts.rst
index 2194d63..194a2c5 100644
--- a/docs/en_US/keyboard_shortcuts.rst
+++ b/docs/en_US/keyboard_shortcuts.rst
@@ -59,6 +59,12 @@ When using the syntax-highlighting SQL editors, the
following shortcuts are avai
+--------------------------+------------------+-------------------------------------+
| Shift+Tab | Shift+Tab | Un-indent selected text
|
+--------------------------+------------------+-------------------------------------+
+| Ctrl+Shift+, | Ctrl+Shift+, | Comment selected code (Inline)
|
++--------------------------+------------------+-------------------------------------+
+| Ctrl+Shift+. | Ctrl+Shift+. | Uncomment selected code
(Inline) |
++--------------------------+------------------+-------------------------------------+
+| Ctrl+Shift+/ | Ctrl+Shift+/ | Comment/Uncomment code (Block)
|
++--------------------------+------------------+-------------------------------------+
**Query Tool**
diff --git a/web/pgadmin/static/bundle/codemirror.js
b/web/pgadmin/static/bundle/codemirror.js
index 6c3525b..c8766ff 100644
--- a/web/pgadmin/static/bundle/codemirror.js
+++ b/web/pgadmin/static/bundle/codemirror.js
@@ -13,6 +13,7 @@ import 'codemirror/addon/search/searchcursor';
import 'codemirror/addon/search/jump-to-line';
import 'codemirror/addon/edit/matchbrackets';
import 'codemirror/addon/edit/closebrackets';
+import 'codemirror/addon/comment/comment'
import 'pgadmin.sqlfoldcode';
export default CodeMirror;
\ No newline at end of file
diff --git a/web/pgadmin/tools/datagrid/templates/datagrid/index.html
b/web/pgadmin/tools/datagrid/templates/datagrid/index.html
index 24ea742..a9038c9 100644
--- a/web/pgadmin/tools/datagrid/templates/datagrid/index.html
+++ b/web/pgadmin/tools/datagrid/templates/datagrid/index.html
@@ -208,6 +208,39 @@
</button>
</div>
<div class="btn-group" role="group" aria-label="">
+ <button id="btn-comment-code" type="button" class="btn
btn-default" title="{{ _('Comment/Uncomment Selection (Block)') }}">
+ <i class="fa fa-file-code-o" aria-hidden="true"></i>
+ </button>
+ <button id="btn-edit-dropdown" type="button" class="btn
btn-default dropdown-toggle"
+ data-toggle="dropdown" aria-haspopup="true"
aria-expanded="false">
+ <span class="caret"></span> <span class="sr-only">Toggle
Dropdown</span>
+ </button>
+ <ul class="dropdown-menu dropdown-menu">
+ <li>
+ <a id="btn-indent-code" href="#">
+ <i class="fa fa-indent" aria-hidden="true"></i>
+ <span> {{ _('Indent Selection') }} </span>
+ </a>
+ <a id="btn-unindent-code" href="#">
+ <i class="fa fa-outdent" aria-hidden="true"></i>
+ <span> {{ _('Unindent Selection') }} </span>
+ </a>
+ <a id="btn-comment-line" href="#">
+ <i class="fa fa-code" aria-hidden="true"></i>
+ <span> {{ _('Comment Selection (Inline)') }}
</span>
+ </a>
+ <a id="btn-uncomment-line" href="#">
+ <i class="fa fa-code" aria-hidden="true"></i>
+ <span> {{ _('Uncomment Selection (Inline)') }}
</span>
+ </a>
+ <a id="btn-toggle-comment-block" href="#">
+ <i class="fa fa-code" aria-hidden="true"></i>
+ <span> {{ _('Comment/Uncomment Selection (Block)')
}} </span>
+ </a>
+ </li>
+ </ul>
+ </div>
+ <div class="btn-group" role="group" aria-label="">
<button id="btn-edit" type="button" class="btn btn-default"
title="{{ _('Clear query window') }}">
<i class="fa fa-pencil-square-o" aria-hidden="true"></i>
</button>
diff --git a/web/pgadmin/tools/sqleditor/templates/sqleditor/js/sqleditor.js
b/web/pgadmin/tools/sqleditor/templates/sqleditor/js/sqleditor.js
index acbe6ff..ff98563 100644
--- a/web/pgadmin/tools/sqleditor/templates/sqleditor/js/sqleditor.js
+++ b/web/pgadmin/tools/sqleditor/templates/sqleditor/js/sqleditor.js
@@ -39,7 +39,10 @@ define('tools.querytool', [
// Define key codes for shortcut keys
var F5_KEY = 116,
F7_KEY = 118,
- F8_KEY = 119;
+ F8_KEY = 119,
+ COMMA_KEY = 188,
+ PERIOD_KEY = 190,
+ FWD_SLASH_KEY = 191;
var is_query_running = false;
@@ -92,7 +95,15 @@ define('tools.querytool', [
"click #btn-explain-buffers": "on_explain_buffers",
"click #btn-explain-timing": "on_explain_timing",
"change .limit": "on_limit_change",
- "keydown": "keyAction"
+ "keydown": "keyAction",
+ // Comment options
+ "click #btn-comment-code": "on_toggle_comment_block_code",
+ "click #btn-toggle-comment-block": "on_toggle_comment_block_code",
+ "click #btn-comment-line": "on_comment_line_code",
+ "click #btn-uncomment-line": "on_uncomment_line_code",
+ // Indentation options
+ "click #btn-indent-code": "on_indent_code",
+ "click #btn-unindent-code": "on_unindent_code"
},
// This function is used to render the template.
@@ -1277,6 +1288,59 @@ define('tools.querytool', [
);
},
+ // Callback function for the line comment code
+ on_comment_line_code: function() {
+ var self = this;
+ // Trigger the comment signal to the SqlEditorController class
+ self.handler.trigger(
+ 'pgadmin-sqleditor:comment_line_code',
+ self,
+ self.handler
+ );
+ },
+
+ // Callback function for the line uncomment code
+ on_uncomment_line_code: function() {
+ var self = this;
+ // Trigger the comment signal to the SqlEditorController class
+ self.handler.trigger(
+ 'pgadmin-sqleditor:uncomment_line_code',
+ self,
+ self.handler
+ );
+ },
+
+ // Callback function for the block comment/uncomment code
+ on_toggle_comment_block_code: function() {
+ var self = this;
+ // Trigger the comment signal to the SqlEditorController class
+ self.handler.trigger(
+ 'pgadmin-sqleditor:toggle_comment_block_code',
+ self,
+ self.handler
+ );
+ },
+
+ on_indent_code: function() {
+ var self = this;
+ // Trigger the comment signal to the SqlEditorController class
+ self.handler.trigger(
+ 'pgadmin-sqleditor:indent_selected_code',
+ self,
+ self.handler
+ );
+ },
+
+ on_unindent_code: function() {
+ var self = this;
+ // Trigger the comment signal to the SqlEditorController class
+ self.handler.trigger(
+ 'pgadmin-sqleditor:unindent_selected_code',
+ self,
+ self.handler
+ );
+ },
+
// Callback function for the clear button click.
on_clear: function(ev) {
var self = this, sql;
@@ -1487,6 +1551,18 @@ define('tools.querytool', [
// Download query result as CSV.
this.on_download(ev);
ev.preventDefault();
+ } else if (ev.shiftKey && ev.ctrlKey && keyCode == COMMA_KEY ) {
+ // Toggle comments
+ this.on_comment_line_code(ev);
+ ev.preventDefault();
+ } else if (ev.shiftKey && ev.ctrlKey && keyCode == PERIOD_KEY ) {
+ // Toggle comments
+ this.on_uncomment_line_code(ev);
+ ev.preventDefault();
+ } else if (ev.shiftKey && ev.ctrlKey && keyCode == FWD_SLASH_KEY ) {
+ // Toggle comments
+ this.on_toggle_comment_block_code(ev);
+ ev.preventDefault();
}
}
});
@@ -1576,6 +1652,13 @@ define('tools.querytool', [
self.on('pgadmin-sqleditor:button:explain-costs',
self._explain_costs, self);
self.on('pgadmin-sqleditor:button:explain-buffers',
self._explain_buffers, self);
self.on('pgadmin-sqleditor:button:explain-timing',
self._explain_timing, self);
+ // Commenting related
+ self.on('pgadmin-sqleditor:comment_line_code',
self._comment_line_code, self);
+ self.on('pgadmin-sqleditor:uncomment_line_code',
self._uncomment_line_code, self);
+ self.on('pgadmin-sqleditor:toggle_comment_block_code',
self._comment_block_code, self);
+ // Indentation related
+ self.on('pgadmin-sqleditor:indent_selected_code',
self._indent_selected_code, self);
+ self.on('pgadmin-sqleditor:unindent_selected_code',
self._unindent_selected_code, self);
if (self.is_query_tool) {
self.gridView.query_tool_obj.refresh();
@@ -3624,6 +3707,71 @@ define('tools.querytool', [
},
/*
+ * This function will comment code (Wrapper function)
+ */
+ _comment_line_code: function() {
+ this._toggle_comment_code('comment_line');
+ },
+
+ /*
+ * This function will uncomment code (Wrapper function)
+ */
+ _uncomment_line_code: function() {
+ this._toggle_comment_code('uncomment_line');
+ },
+
+ /*
+ * This function will comment/uncomment code (Wrapper function)
+ */
+ _comment_block_code: function() {
+ this._toggle_comment_code('block');
+ },
+
+ /*
+ * This function will comment/uncomment code (Main function)
+ */
+ _toggle_comment_code: function(of_type) {
+ var self = this, editor = self.gridView.query_tool_obj,
+ selected_code = editor.getSelection(),
+ sql = selected_code.length > 0 ? selected_code : editor.getValue();
+ // If it is an empty query, do nothing.
+ if (sql.length <= 0) return;
+
+ // Find the code selection range
+ var range = {
+ from: editor.getCursor(true),
+ to: editor.getCursor(false)
+ },
+ option = { lineComment: '--' };
+
+ if(of_type == 'comment_line') {
+ // Comment line
+ editor.lineComment(range.from, range.to, option);
+ } else if(of_type == 'uncomment_line') {
+ // Uncomment line
+ editor.uncomment(range.from, range.to, option);
+ } else if(of_type == 'block') {
+ editor.toggleComment(range.from, range.to);
+ }
+ },
+
+ /*
+ * This function will indent selected code
+ */
+ _indent_selected_code: function() {
+ var self = this, editor = self.gridView.query_tool_obj;
+ editor.execCommand("indentMore");
+ },
+
+ /*
+ * This function will unindent selected code
+ */
+ _unindent_selected_code: function() {
+ var self = this, editor = self.gridView.query_tool_obj;
+ editor.execCommand("indentLess");
+ },
+
+ /*
* This function get explain options and auto rollback/auto commit
* values from preferences
*/
