Gmail-like comment manipulation keyboard shorcuts

[nbachiyski]

j - down
k - up
x - mark (check the checkbox)
a - approve current comment (not checked)
u - unapprove
d - delete
s - spam
r - reply

Implemented as a generic jquery plugin and can be easily used on any table or list. Uses ​jquery-hotkeys. The main idea is:

jQuery.table_hotkeys(jQuery('table.widefat'), ['a', 'u', 's', 'd', 'r']);
...
<tr class="some-css-class-prefix-current">
    <a class="some-css-class-prefix-u" href="...">Unapprove</a>
</tr>

The plugin cycles through rows of the given table and when one of the keys in the list is pressed, it looks for an element in that row with the proper class and clicks on it. In the example above, if I press u the Unapprove link of the current row will be clicked.

Known limitations and bugs:

• Bulk actions can't be triggered via the keyboard. If we want the interface to be consistent we have two options:
  1. Sacrifice either bulk shortcuts or single-comment shortcuts. I have chosen to drop bulk actions, because they need more attention (ergo, should be harder). Moreover, comments can be marked via the keyboard and if one wants to delete all comments the only action with the mouse will be to select Delete from the menu and click Apply.
  2. Choose different shortcuts for single-comment and bulk actions. For example Shift+u (aka U) can be bulk Unapprove and so on.
• Can't edit the comment because it is a normal link and they can't be clicked via JS. There is a workaround and we will work around it if needed.
• Clicking on an action button, which removes the comment from view, loses the currently selected comment and the user has to press j or k to bring the cursor back.
• The style for current comment is completely arbitrary (yellow background). Better ideas will be appreciated.

[ryan]

Is it possible to show the highlight on the first row only after 'j' has been pressed? That way those who don't care or know about keyboard shortcuts don't have to see the highlight, especially since they can't move the highlight by clicking on another row. Google Reader doesn't highlight until the first time 'j' is pressed or an item is clicked.

[ryan]

The #E4F2FD color we use everywhere might make a good active row color. It would be more distinct from the light yellow of unapproved comments.

[nbachiyski]

Rev 2: Do not show current before pressing j

[nbachiyski]

Rev 2: Better hightlight colour

[ryan]

(In [8777]) Comment manipulation keyboard shorcuts from nbachiyski. see #7643

[ryan]

I moved vim-current to the color stylesheets. Tested on FF and Safari.

[ryan]

Oops, found a bug right after commit. Pressing 'a', 'u', or other actions with no rows highlighted applies the action to all rows. After you press 'j' to make the first row active it behaves properly.

[ryan]

On Mac, Cmd+u to view source in Firefox gets overridden and interpreted as Unapprove.

[ryan]

(In [8778]) Support Mac meta key. see #7643

[ryan]

(In [8779]) Don't process keypress if the current row is null. see #7643

[ryan]

Please review those commits. Both issues are now fixed for me.

[azaozz]

(In [8780]) Add hotkeys.js to all pages that list comments and prevent error if not loaded, see #7643

[nbachiyski]

Refactor much of the code and move to next or previous page on pressing next/prev at end of the current page.

[nbachiyski]

Here is a patch, which redirects to the next page if we have reached the page of the current one.

Also, some code duplication was refactored and the visibility checks were unified in a jquery method, which traverses 3 levels up.

[nbachiyski]

Replying to ryan:

Please review those commits. Both issues are now fixed for me.

They seem fine. I will send the second one upstream.

[ryan]

(In [8789]) Comment hotkey: move to next or previous page on pressing next/prev at end of the current page. Prop nbachiyski. see #7643

[nbachiyski]

A console.log sneaked into the commit

[azaozz]

(In [8794]) Comment manipulation keyboard shorcuts: get debug out, props nbachiyski see #7643

[nbachiyski]

Bulk edit with Shift+<action key>, edit key, code reduce

[nbachiyski]

A little patch, which implements maps bulk actions (over all checked comments), which are triggered by Shift+<action key> and Shift+x toggles all checkboxes.

The edit key, e, now works.

Also, I removed some unused code.

[ryan]

(In [8804]) Bulk action hot keys for comments. Props nbachiyski. see #7643

[ryan]

I can't get Shift+u to work. FF3

[nbachiyski]

Fix unapprove bulk action (Shift+U)

[nbachiyski]

Disable shortcuts by default, add a personal option for turning them on

[ryan]

(In [9217]) Add opt-in optioon for comment hotkeys. Props nbachiyski. fixes #7643