Ticket #7643 (closed enhancement: fixed)

Opened 3 months ago

Last modified 2 months ago

Gmail-like comment manipulation keyboard shorcuts

Reported by: nbachiyski Assigned to: anonymous
Priority: normal Milestone: 2.7
Component: General Version:
Severity: normal Keywords: js shortcuts has-patch
Cc:

Description

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.

Attachments

table-hotkeys.diff (6.6 kB) - added by nbachiyski on 08/29/08 16:47:34.
jquery.hotkeys.js (5.3 kB) - added by nbachiyski on 08/29/08 16:48:13.
jquery.table-hotkeys.js (2.7 kB) - added by nbachiyski on 08/29/08 20:48:11.
Rev 2: Do not show current before pressing j
table-hotkeys.2.diff (6.6 kB) - added by nbachiyski on 08/29/08 20:48:47.
Rev 2: Better hightlight colour
table-hotkeys-move-along-pages.diff (6.9 kB) - added by nbachiyski on 08/31/08 19:17:04.
Refactor much of the code and move to next or previous page on pressing next/prev at end of the current page.
table-hotkeys-no-debug.diff (494 bytes) - added by nbachiyski on 09/01/08 13:06:46.
A console.log sneaked into the commit
table-hotkeys-edit-bulk-and-strip.diff (4.4 kB) - added by nbachiyski on 09/04/08 16:54:39.
Bulk edit with Shift+<action key>, edit key, code reduce
hotkeys-shift-u.diff (1.9 kB) - added by nbachiyski on 10/16/08 20:48:27.
Fix unapprove bulk action (Shift+U)
hotkeys-opt-in.diff (4.7 kB) - added by nbachiyski on 10/16/08 22:19:25.
Disable shortcuts by default, add a personal option for turning them on

Change History

08/29/08 16:47:34 changed by nbachiyski

  • attachment table-hotkeys.diff added.

08/29/08 16:48:13 changed by nbachiyski

  • attachment jquery.hotkeys.js added.

08/29/08 17:34:10 changed by 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.

08/29/08 17:48:20 changed by 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.

08/29/08 20:48:11 changed by nbachiyski

  • attachment jquery.table-hotkeys.js added.

Rev 2: Do not show current before pressing j

08/29/08 20:48:47 changed by nbachiyski

  • attachment table-hotkeys.2.diff added.

Rev 2: Better hightlight colour

08/29/08 21:43:35 changed by ryan

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

08/29/08 21:44:24 changed by ryan

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

08/29/08 21:49:42 changed by 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.

08/29/08 21:52:29 changed by ryan

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

08/30/08 00:28:14 changed by ryan

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

08/30/08 00:48:38 changed by ryan

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

(follow-up: ↓ 12 ) 08/30/08 00:49:53 changed by ryan

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

08/30/08 07:16:18 changed by azaozz

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

08/31/08 19:17:04 changed by nbachiyski

  • attachment table-hotkeys-move-along-pages.diff added.

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

08/31/08 19:21:02 changed by 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.

(in reply to: ↑ 9 ) 08/31/08 19:23:34 changed by 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.

09/01/08 05:28:41 changed by 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

09/01/08 13:06:46 changed by nbachiyski

  • attachment table-hotkeys-no-debug.diff added.

A console.log sneaked into the commit

09/01/08 13:14:21 changed by azaozz

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

09/04/08 16:54:39 changed by nbachiyski

  • attachment table-hotkeys-edit-bulk-and-strip.diff added.

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

09/04/08 16:57:30 changed by 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.

09/04/08 17:53:14 changed by ryan

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

09/04/08 18:01:01 changed by ryan

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

10/16/08 19:08:30 changed by ryan

  • status changed from new to closed.
  • resolution set to fixed.

10/16/08 20:48:27 changed by nbachiyski

  • attachment hotkeys-shift-u.diff added.

Fix unapprove bulk action (Shift+U)

10/16/08 22:19:25 changed by nbachiyski

  • attachment hotkeys-opt-in.diff added.

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

10/16/08 22:20:15 changed by nbachiyski

  • status changed from closed to reopened.
  • resolution deleted.

10/16/08 22:23:33 changed by ryan

  • status changed from reopened to closed.
  • resolution set to fixed.

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