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

Shortcut to focus the "find label" input field #938

Merged
merged 17 commits into from
Dec 12, 2024
Merged

Conversation

aneust
Copy link
Contributor

@aneust aneust commented Oct 3, 2024

Shortcut Ctrl+k to focus the "find label" input field of the label trees component in the sidebar of the annotation tools

references #476

@mzur mzur linked an issue Oct 17, 2024 that may be closed by this pull request
@aneust aneust requested a review from lehecht November 14, 2024 15:24
@aneust aneust marked this pull request as ready for review November 14, 2024 15:25
resources/assets/js/annotations/components/labelsTab.vue Outdated Show resolved Hide resolved
resources/assets/js/label-trees/components/labelTrees.vue Outdated Show resolved Hide resolved
resources/assets/js/label-trees/components/labelTrees.vue Outdated Show resolved Hide resolved
resources/assets/js/annotations/annotatorContainer.vue Outdated Show resolved Hide resolved
resources/assets/js/annotations/annotatorContainer.vue Outdated Show resolved Hide resolved
resources/assets/js/videos/videoContainer.vue Outdated Show resolved Hide resolved
resources/assets/js/videos/videoContainer.vue Outdated Show resolved Hide resolved
resources/assets/js/annotations/annotatorContainer.vue Outdated Show resolved Hide resolved
@aneust aneust requested a review from lehecht November 18, 2024 13:11
Copy link
Contributor

@lehecht lehecht left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

After reviewing the annotatorContainer, it would be the best to move the methods to focus the input from the annotatorContainer into the labelsTab component.
The annotatorContainer should just be responsible to open the sidebar. Additionally, you can merge the openSidebarLabels() and setFocusInputLabels() methods into a single method for simplicity.

Once the methods are moved, replace this.$refs.sidebar.$emit(...) in LabelsTab with this.$emit('open', 'labels'). Then, update the corresponding labels.blade file as follows:

  1. Replace <labels-tab ... :focus-input="focusInputFindLabel" with <labels-tab ... v-on:open="openSidebar".
  2. Replace <labels-trees ... :focus-input="focusInput" with <labels-trees ... :focus-input="focusInputFindLabel".

The method openSidebar is used in the annotatorContainer.

The goal is to listen for keyboard events in LabelsTab, emit an event to the annotatorContainer, and then let the annotatorContainer emit an event to open the sidebar. This prevents polluting the annotatorContainer.

Sorry for all the back and forth.

resources/assets/js/label-trees/components/labelTrees.vue Outdated Show resolved Hide resolved
resources/views/annotations/show.blade.php Outdated Show resolved Hide resolved
@aneust aneust requested a review from lehecht November 21, 2024 09:36
@mzur
Copy link
Member

mzur commented Dec 6, 2024

Just curious, as it seems to work already... is this ready for review?

@aneust aneust requested review from mzur and lehecht and removed request for lehecht December 8, 2024 21:28
Copy link
Member

@mzur mzur left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks good, thanks!

@mzur mzur merged commit a2b95ab into master Dec 12, 2024
6 checks passed
@mzur mzur deleted the findLabelShortcut branch December 12, 2024 14:51
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Shortcut to find a label in the label trees sidebar
3 participants