Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Tabbing is inconsistent and awkward #42

Open
krchristie opened this issue Sep 10, 2024 · 5 comments
Open

Tabbing is inconsistent and awkward #42

krchristie opened this issue Sep 10, 2024 · 5 comments
Assignees
Labels
enhancement New feature or request

Comments

@krchristie
Copy link

krchristie commented Sep 10, 2024

As I mentioned in previous discussions of curation flow and the desired behavior of the new Standard Annotations form, I prefer to be able to tab through the entire interface with little or no need to use the mouse to move between fields. However, I find that the form is not set up well to be able to tab smoothly through the form without needing to use the mouse to reset the cursor position or tab backwards.

A. Tabbing behavior of the Gene Product field is odd and inconsistent with normal tabbing behavior.

    1. Type "Ift88 mm" in the field. This is enough for an autocomplete option for "Ift88 Mmus" to appear in a yellow row below the entry field.
    1. Click the down arrow to select the yellow row for "Ift88 Mmus". This will change the shade of the row to indicate that it is selected.
    1. Hit the return key to confirm selection. This brings you back the entry box with a cursor flashing at the end of the text in the box ("Ift88 Mmus" in this case).
    1. Hitting the tab key does NOT move one to the next box ("GP to Term Relation"), but instead the cursor disappears and the Gene Product box is still the active box. It requires hitting the tab key a 2nd time in order to move to the next box ("GP to Term Relation"). In contrast, when I do a similar thing in the "GO Term" box, once I have hit "Return" to select the highlighted row to end back up in the box with the cursor flashing at the end of the text, hitting tab immediately moves the active site to the three dots to the right of the first row. Hitting the tab key ONE time is the expected and desired behavior in all boxes that require one to select an option from the autocomplete suggestions.

B. The set up of the Extensions and Comments sections produce undesirable tabbing behavior.

  • If one is tabbing through the Standard Annotations form, one must press the "Return" key while the "Add Extension" button is selected to generate the data entry boxes. However, these data entry boxes get generated above the "Add Extension" button, while the selected field that is active remains on the "Add Extension" button. Thus, in order to tab to the correct place to start entering data again, one must tab backwards three times. While functional, this is tedious. This is a significant problem for MGI as we add extensions very frequently.
  • The Comments section behaves similarly except for a different number of backward tabs being required to get to the first data entry field for the Comment.
  • I think it would be a vast improvement for people who prefer to be able to move through the form with the keyboard if the Extensions and Comments fields were present all the time with three dots at the end of each row so that one could tab to the three dots and press return to get an option to add an additional row for another extension or comment.
  • If the reason the fields are not shown at the beginning is because the are optional, rather than required, perhaps we could put "(optional) after the words "Extensions" and "Comments" to make it clear that those fields are not required.
  • Alternatively, please make sure to reset the position of the cursor to be in the first box of an Extension or Comment row when a new row is generated.

C. location of cursor after pressing "return" key to "Save"

  • It would be highly desirable for the cursor position to reset to the "Gene Product" field after either the "Save" or the "Clear" button is used so that the form is ready to be filled again without needing to use the mouse to reset the cursor.

tagging @LiNiMGI

@vanaukenk
Copy link

@krchristie - Tremayne has implemented some tabbing functionality on the standard annotations editor on noctua-dev, if you'd like to try it and give some feedback.

Thank you!

@vanaukenk
Copy link

@tmushayahama will double-check the tabbing behavior of the gene product box to see why two tabs are required here to get to the gp2term relation box.

@krchristie
Copy link
Author

krchristie commented Jan 31, 2025

@krchristie - Tremayne has implemented some tabbing functionality on the standard annotations editor on noctua-dev, if you'd like to try it and give some feedback.

Thank you!

Comparing the dev version with the production version of the Standard Annotations (SA) interface, it looks to me like tabbing options have been removed, which is actually the opposite of what I would like. I would like to be able to get to everything I use regularly while taking my hands off the keyboard to use the mouse as few times as possible.

  1. With respect to the three dots to the right of the "GO Term" field, I PREFER the tab behavior in the production version of the Standard Annotations (SA) interface over the behavior in the new SA version in dev. In the production SA, it IS POSSIBLE to tab from the "GO Term" field to the three dots at the right of that row. That behavior in production version is exactly what I want, where once the three dots are made the active field by tabbing to them, I can press the RETURN key to open up the menu, use the down (or up) arrow keys to move betwen the options in the menu, and then press the RETURN key to select the option I want.

  2. I also see that the "Add Extension" text is no longer accessible by tabbing in either the production or dev version of the SA, though it must have been previously as I remember making comments about finding the fact that the added boxed for entering the Extension info ended up above the cursor position, requiring multiple back tabs, or resetting the cursor with the mouse.

  • Since I add extensions, often 2 or 3 extensions per annotation, to nearly all of my annotations, this is very undesirable behavior for me.

I think it might be helpful if I am explicit about what I would really like to be able to do with respect to navigating the interface, entering data, and selecting options from menus entirely using the keyboard without being required to use the mouse, so I'll go through the interface from the top to bottom.

  1. above 1st Row - NOT button
    Not accessible via keyboard:
    0A. I don't love that the NOT button is not accessible by keyboard. This is tolerable as it is rarely used. However, in light of the fact that this interface has gone backwards in the keyboard accessibility of adding Extensions, I have a suggestion below to make adding a NOT qualifier accessible via the keyboard, see 8A-a..

  2. 1st Row - "Gene Product" box
    Working as expected:
    1A. It is great that clicking in this box when annotations have already been made in a model is producing an alphabetized list of gene products that have already been used in the model without a blank box. It works as expected to use the up/down arrows to navigate through the selections and to use the "Return" key to select the desired option.
    1B. If one wants to use a gene product not already used in the model, it works great to type enough to get the desired option to show up in the autocomplete list, then to use keyboard commands as described in 1A.
    NOT working as expected:
    1C. As previously discussed, it is odd that one must tab twice after selecting a gene product. However, while this is odd and mildly annoying, I would put investigating and fixing this as LOWER priority than making it possible to effectively use the entire interface using only the keyboard without being forced to take a hand off to use the mouse.

  3. 1st Row - "GP to Term Relation" box
    Working as expected:
    2A. One can tab into this field, press "Return" to open up the list, use the up/down arrows, to move through the list, press "Return" to select the desired option, and press "Tab" to move to the next field.

  4. 1st Row - "GO Term" box
    Working as expected:
    3A. One can tab into this field and the list of GO terms that have already been used in the model pops open in the autocomplete list. Alternatively, one can type to display the desired GO term in the autocomplete list.
    3B. Within the autocomplete list, one can use the up/down arrows to move through the list and press "Return" to select the desired option.

  5. 1st Row - 3 dots to the right of the "GO Term" box
    NOT working as expected:
    4A. Tabbing from the "GO Term" box skips the 3 dots to the right of the "GO Term" box and goes the the "Evidence" box in the 2nd row. I would like to be able to access the options in the 3 dot menu via tabbing.
    4B. Unlike in the production SA, in dev selection any of the three options available from this 3 dot icon ("Add MF Root", "Add BP Root", or "Add CC Root") ONLY fills in the "GO Term" box, but does NOT also fill in the "GP to Term Relation", "Evidence", and "Reference" boxes with the appropriate values for a root annotation. Filling in all the info required for a root annotation is the desired behavior. [Note that in production, this behaves identically regardless of whether one has used the keyboard or the mouse to select one of the three "Add xx Root" options].

  6. 2nd Row - "Evidence" box
    Working as expected:
    5A. One can tab into this field and the list of Evidence terms that have already been used (if any) in the model pops open in the autocomplete list. Alternatively, one can type until the desired Evidence code term is displayed in the autocomplete list.
    5B. Within the autocomplete list, one can use the up/down arrows to move through the list and press "Return" to select the desired option.

  7. 2nd Row - "Reference" box
    Working as expected:
    6A. One can tab into this field and the list of Evidence terms that have already been used (if any) in the model pops open in the autocomplete list. Alternatively, one can type to display the desired Evidence code term in the autocomplete list.
    6B. Within the autocomplete list, one can use the up/down arrows to move through the list and press "Return" to select the desired option.
    Not working as desired:
    6C. For my preference of having an interface where all curation options can be accessed via tabbing from the previous field, it is not optimal that one cannot tab to the "plus icon" within the "Reference" box. However, it is only useful to be able to tab to the "plus icon", if after you press the "Return" button to open it, then you could tab through the options within the yellow pop-up that is opened. However, this is NOT the behavior that currently exists in the production SA. While you CAN tab to the "plus" icon", and you CAN press the "Return" key to open the yellow pop-up for Reference info, you CANNOT tab into the options in the yellow pop-up. If this interface remains in this configuration, where there is a "Reference" box that contains a "plus" icon, I would prefer to be able to tab into AND through the yellow pop-up window. Additionally, I think it would be better to change the name of the box from "Reference" to "Prefix:Reference_ID" to remind people about the required format.

  • 6C-alternate_idea It might be simpler and also prevent people from forgetting to enter the reference prefix, if the current single box for "Reference" with a "plus" icon within was converted to simply the two boxes that currently exist in the yellow pop-up window, i.e. a pull-down menu for allowed reference prefixes, and a second box to enter the ID or select one that has been entered previously AND with the behavior that currently exists in the yellow pop-up where typing an ID in the ID box shows you info about the paper that corresponds to that ID, thus confirming that you have entered/selected the correct ID.
  • While, I do like the current speed of tabbing into a single box and selecting the ID I want, it wouldn't be bad to tab through two boxes if "PMID:" was the default option as it is currently in production, so that you wouldn't need to press "Return" to open the options unless you wanted to select something other than the default. The more I think about it, I think it would be a better interface that helps curators avoid errors if the current single "Reference" box containing a "plus" icon, was replaced with the pull-down menu for prefixes and the box for Reference ID that are currently hidden in the yellow pop-up.
  1. 2nd Row - "With/From" box
    Working as expected:
    7A. One can tab into this field and the list of IDs that have already been used (if any) in the model pops open in the autocomplete list. Alternatively, one can type or paste in the desired Prefix and ID
    7B. Within the autocomplete list, one can use the up/down arrows to move through the list and press "Return" to select the desired option.

  2. Extensions
    NOT working as expected:

  • 8A. Not accessible via keyboard: I find the current versions of either the production or dev SA rather cumbersome to use as it is NOT possible to access the Extensions with keyboard commands, but are required to use the mouse.

  • 8A-a. One idea that would work for me is something similar to what currently exists in the production Form editor in the 3-dot menu that is present at the right side of the row for entering the GO term, Evidence, Reference, & With info, where opening the 3-dot menu provides tab-accessible access to "Add an Extension" (screen shot below).

  • If we went with this method of tab access to adding extensions, I would suggest adding a 3-dot menu to the 2nd row with the header "Evidence" and also having a smaller number of options in the menu:

  • I would love to have access to an "Add an Extension" option with with submenu to select type of extension such as is shown in the screenshot below of the current BP version of the Form Editor.

  • I think this would be a great place to make the "NOT Qualifier" accessible via keyboard navigation and selection (as alluded to above in item 0). As in the Form Editor, this would need to turn into a "Remove NOT Qualifier" option if the NOT Qualifier has already been added to an annotation.

  • I would NOT suggest adding the "Add Root Term" to this 3-dot menu as I like the presence of this" option in its current location at the end of the 1st row so that you can choose it BEFORE you get to the Evidence row (provided that it regains current functionality of production SA and fills in the "Evidence" and "Reference" boxes as well as the "GO Term" box when you select an option).

  • It occurs to me that the "Clone evidence" option that is currently a sub-option of the "Evidence" option within the 3-dot menu might also be useful, perhaps especially to those who prefer to use the mouse over keyboard navigation through the interface. Since the SA is only going to allow one piece of evidence, it seems "Clone evidence" could be an option at the top level 3-dot menu as neither "Add Evidence" or "Remove Evidence" make sense in the context of the SA.

  • I personally don't find either the "Search Annotations" or the "Clear Values" options useful in this location, so it might be that we don't need them here.

  • The summary is that the 3-dot menu from the 2nd row of boxes might contain only these three choices: "Add an Extension" (with submenu), "NOT Qualifier" (or "Remove NOT Qualifier"), & "Clone Evidence".

Image

  • 8A-b. Another option might be to make the phrase "Add Extension" reachable by tabbing again. It might be useful to add a "down arrow" icon (such as is present within the "GP to Term Relation" box) to signify that pressing the "Return" key will activate it. Then, when the "Return" key is pressed, a row to enter an extension would appear below such that it is possible to tab into the first box of the row OR the cursor moves when one presses "Return".
  • Rather than generate an row extension row that has a trash can at the end if you decide to delete it, I think it would work better if the row had a 3-dot menu with two options: "Add an Extension" and "Delete row" so that you could keep working forwards if you wanted to add multiple extensions.
  1. Comments
    NOT working as expected:
    9A. Not accessible via keyboard: I would like to see the "Add Comments" option accessible via the keyboard as well my some means comparable to the "Add Extensions" option.

  2. ** Clear and Save buttons**
    Working as expected:
    10A. It is possible to tab to these and to press the "Return" key to produce the selected action.
    NOT working as expected:
    10B. I find the shift in color of the "Save" button to be so subtle that I am having a hard time being sure that it is selected if I have looked away from the interface. Could we do something more obvious.

@vanaukenk
Copy link

@krchristie - Thank you very much for the testing and the detailed feedback.

We won't make any changes right now to tabbing in production, but I'll review your feedback and we'll see what else we might be able to do.

@krchristie
Copy link
Author

@krchristie - Thank you very much for the testing and the detailed feedback.

We won't make any changes right now to tabbing in production, but I'll review your feedback and we'll see what else we might be able to do.

Thanks @vanaukenk - I appreciate your efforts. I'll note though that at present, I still find the Form Editor significantly more pleasant to use than the Standard Annotations interface.

This question might be a non-starter, but is it worth considering keeping Protein2GO as the interface for standard annotations, especially now that UniProt is involved again in the GO pipeline?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

No branches or pull requests

3 participants