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.

Sign up for GitHub

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

Jump to bottom

Add keyboard shortcut for last annotation #950

Open
wants to merge 7 commits into
base: master
Choose a base branch
from
Open

Add keyboard shortcut for last annotation #950

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
d87b45e
Add controller method to get last created annotation
lehecht Oct 11, 2024
dfb8c50
Add new routes for getting last annotation
lehecht Oct 11, 2024
c4f786c
Select last created annotation by using shortcut
lehecht Oct 11, 2024
e218c31
Revert "Select last created annotation by using shortcut"
lehecht Oct 14, 2024
177509b
Revert "Add new routes for getting last annotation"
lehecht Oct 14, 2024
ef89f9d
Revert "Add controller method to get last created annotation"
lehecht Oct 14, 2024
6c195b9
Add shortcut to select last annotation
lehecht Oct 14, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 6 additions & 0 deletions resources/assets/js/annotations/annotatorContainer.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -592,6 +592,12 @@ export default {
}
Messages.danger(`Invalid shape. ${shape} needs ${count} different points.`);
},
selectLastAnnotation() {
let lastAnnotation = this.annotations.reduce((lastAnnotated, a) => a.id > lastAnnotated.id ? a : lastAnnotated, { id: 0 });
let remainingAnnotations = this.annotations.filter(a => a.id != lastAnnotation.id);
lastAnnotation.selected = true;
remainingAnnotations.map(a => a.selected = false);
Comment on lines +598 to +599
Copy link
Member

Choose a reason for hiding this comment

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

Please use handleSelectAnnotation() so there are not too many different places that handle selecting of annotations.

Suggested change
lastAnnotation.selected = true;
remainingAnnotations.map(a => a.selected = false);
this.handleSelectAnnotation(lastAnnotation);

}
},
watch: {
async imageId(id) {
Expand Down
4 changes: 4 additions & 0 deletions resources/assets/js/annotations/components/annotationCanvas.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -679,6 +679,9 @@ export default {
Keyboard.on('Backspace', this.deleteLastCreatedAnnotation, 0, this.listenerSet);
}
},
emitSelectLastAnnotation() {
this.$emit('select-last-annotation');
}
},
watch: {
image(image, oldImage) {
Expand Down Expand Up @@ -826,6 +829,7 @@ export default {
Keyboard.on('ArrowRight', this.handleNext, 0, this.listenerSet);
Keyboard.on('ArrowLeft', this.handlePrevious, 0, this.listenerSet);
Keyboard.on('Escape', this.resetInteractionMode, 0, this.listenerSet);
Keyboard.on('Control+l', this.emitSelectLastAnnotation, 0, this.listenerSet);

this.modifyInteraction.on('modifystart', this.handleFeatureModifyStart);
this.modifyInteraction.on('modifyend', this.handleFeatureModifyEnd);
Expand Down
4 changes: 4 additions & 0 deletions resources/assets/js/videos/components/videoScreen.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -571,6 +571,9 @@ export default {
Keyboard.on('ArrowRight', this.emitNext, 0, this.listenerSet);
Keyboard.on('ArrowLeft', this.emitPrevious, 0, this.listenerSet);
}
},
emitSelectLastAnnotation() {
this.$emit('select-last-annotation');
}
},
watch: {
Expand Down Expand Up @@ -637,6 +640,7 @@ export default {
Keyboard.on('Escape', this.resetInteractionMode, 0, this.listenerSet);
Keyboard.on('Control+ArrowRight', this.jumpForward, 0, this.listenerSet);
Keyboard.on('Control+ArrowLeft', this.jumpBackward, 0, this.listenerSet);
Keyboard.on('Control+l', this.emitSelectLastAnnotation, 0, this.listenerSet);
},
mounted() {
this.map.setTarget(this.$el);
Expand Down
6 changes: 6 additions & 0 deletions resources/assets/js/videos/videoContainer.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -673,6 +673,12 @@ export default {
}
Messages.danger(`Invalid shape. ${shape} needs ${count} different points.`);
},
selectLastAnnotation() {
let lastAnnotation = this.annotations.reduce((lastAnnotated, a) => a.id > lastAnnotated.id ? a : lastAnnotated, { id: 0 });
let remainingAnnotations = this.annotations.filter(a => a.id != lastAnnotation.id);
lastAnnotation.selected = true;
remainingAnnotations.map(a => a.selected = false);
Comment on lines +679 to +680
Copy link
Member

Choose a reason for hiding this comment

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

Have you tried this and it works? When an annotation is selected (e.g. in the sidebar) the tool should seek the video to the start of the annotation. In the videoContainer annotation.selected is then set to this time. Same as above, it should work fine if you reuse selectAnnotations():

Suggested change
lastAnnotation.selected = true;
remainingAnnotations.map(a => a.selected = false);
this.selectAnnotations([lastAnnotation], [], lastAnnotation.startFrame);

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Thanks! When I tested it, I created multiple annotations in the same frame, which is why I didn't notice that.

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Did you leave the second parameter empty on purpose? Because this causes the last annotation only to be selected but not to seek the video, if another annotation was already selected on the timeline.

Copy link
Member

Choose a reason for hiding this comment

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

No. I just wanted to avoid selectAnnotation() because this can have unexpected side effects with attaching or swapping labels. You should use:

this.selectAnnotations([lastAnnotation], this.selectedAnnotations, lastAnnotation.startFrame);

}
},
watch: {
'settings.playbackRate'(rate) {
Expand Down
1 change: 1 addition & 0 deletions resources/views/annotations/show.blade.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -96,6 +96,7 @@
v-on:measuring="fetchImagesArea"
v-on:requires-selected-label="handleRequiresSelectedLabel"
v-on:is-invalid-shape="handleInvalidShape"
v-on:select-last-annotation="selectLastAnnotation"
ref="canvas"
inline-template>
@include('annotations.show.annotationCanvas')
Expand Down
1 change: 1 addition & 0 deletions resources/views/videos/show/content.blade.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -65,6 +65,7 @@
v-on:seek="seek"
v-on:start-seeking="startSeeking"
v-on:is-invalid-shape="handleInvalidShape"
v-on:select-last-annotation="selectLastAnnotation"
></video-screen>
<video-timeline
ref="videoTimeline"
Expand Down