diff --git a/cvat/apps/engine/static/engine/js/annotationUI.js b/cvat/apps/engine/static/engine/js/annotationUI.js index eefd6ca0ab2b..df31d9e5a6f5 100644 --- a/cvat/apps/engine/static/engine/js/annotationUI.js +++ b/cvat/apps/engine/static/engine/js/annotationUI.js @@ -183,7 +183,13 @@ function buildAnnotationUI(job, shapeData, loadJobEvent) { setupSettingsWindow(); setupMenu(job, shapeCollectionModel, annotationParser, aamModel, playerModel, historyModel); setupFrameFilters(); - setupShortkeys(shortkeys); + setupShortkeys(shortkeys, { + aam: aamModel, + shapeCreator: shapeCreatorModel, + shapeMerger: shapeMergerModel, + shapeGrouper: shapeGrouperModel, + shapeBuffer: shapeBufferModel + }); $(window).on('click', function(event) { Logger.updateUserActivityTimer(); @@ -304,7 +310,7 @@ function setupFrameFilters() { } -function setupShortkeys(shortkeys) { +function setupShortkeys(shortkeys, models) { let annotationMenu = $('#annotationMenu'); let settingsWindow = $('#settingsWindow'); let helpWindow = $('#helpWindow'); @@ -347,9 +353,30 @@ function setupShortkeys(shortkeys) { return false; }); + let cancelModeHandler = Logger.shortkeyLogDecorator(function() { + switch (window.cvat.mode) { + case 'aam': + models.aam.switchAAMMode(); + break; + case 'creation': + models.shapeCreator.switchCreateMode(true); + break; + case 'merge': + models.shapeMerger.cancel(); + break; + case 'groupping': + models.shapeGrouper.cancel(); + break + case 'paste': + models.shapeBuffer.switchPaste(); + } + return false; + }); + Mousetrap.bind(shortkeys["open_help"].value, openHelpHandler, 'keydown'); Mousetrap.bind(shortkeys["open_settings"].value, openSettingsHandler, 'keydown'); Mousetrap.bind(shortkeys["save_work"].value, saveHandler, 'keydown'); + Mousetrap.bind(shortkeys["cancel_mode"].value, cancelModeHandler, 'keydown'); } diff --git a/cvat/apps/engine/static/engine/js/shapeCollection.js b/cvat/apps/engine/static/engine/js/shapeCollection.js index 4b9c0886794e..019fff33f9f3 100644 --- a/cvat/apps/engine/static/engine/js/shapeCollection.js +++ b/cvat/apps/engine/static/engine/js/shapeCollection.js @@ -146,6 +146,22 @@ class ShapeCollectionModel extends Listener { } } + // Common code for switchActiveOccluded(), switchActiveKeyframe(), switchActiveLock() and switchActiveOutside() + _selectActive() { + let shape = null; + if (this._activeAAMShape) { + shape = this._activeAAMShape; + } + else { + this.selectShape(this._lastPos, false); + if (this._activeShape) { + shape = this._activeShape; + } + } + + return shape; + } + colorsByGroup(groupId) { // If group id of shape is 0 (default value), then shape not contained in a group if (!groupId) { @@ -594,16 +610,7 @@ class ShapeCollectionModel extends Listener { } switchActiveLock() { - let shape = null; - if (this._activeAAMShape) { - shape = this._activeAAMShape; - } - else { - this.selectShape(this._lastPos, false); - if (this._activeShape) { - shape = this._activeShape; - } - } + let shape = this._selectActive(); if (shape) { shape.switchLock(); @@ -637,30 +644,30 @@ class ShapeCollectionModel extends Listener { } switchActiveOccluded() { - let shape = null; - if (this._activeAAMShape) { - shape = this._activeAAMShape; - } - else { - this.selectShape(this._lastPos, false); - if (this._activeShape && !this._activeShape.lock) { - shape = this._activeShape; - } + let shape = this._selectActive(); + if (shape && !shape.lock) { + shape.switchOccluded(window.cvat.player.frames.current); } + } - if (shape) { - shape.switchOccluded(window.cvat.player.frames.current); + switchActiveKeyframe() { + let shape = this._selectActive(); + if (shape && shape.type === 'interpolation_box' && !shape.lock) { + shape.switchKeyFrame(window.cvat.player.frames.current); } } - switchActiveHide() { - if (this._activeAAMShape) { - return; + switchActiveOutside() { + let shape = this._selectActive(); + if (shape && shape.type === 'interpolation_box' && !shape.lock) { + shape.switchOutside(window.cvat.player.frames.current); } + } - this.selectShape(this._lastPos, false); - if (this._activeShape) { - this._activeShape.switchHide(); + switchActiveHide() { + let shape = this._selectActive(); + if (shape) { + shape.switchHide(); } } @@ -822,6 +829,14 @@ class ShapeCollectionController { this.switchActiveOccluded(); }.bind(this)); + let switchActiveKeyframeHandler = Logger.shortkeyLogDecorator(function() { + this.switchActiveKeyframe(); + }.bind(this)); + + let switchActiveOutsideHandler = Logger.shortkeyLogDecorator(function() { + this.switchActiveOutside(); + }.bind(this)); + let switchHideHandler = Logger.shortkeyLogDecorator(function() { if (!window.cvat.mode || window.cvat.mode === 'aam') { this._model.switchActiveHide(); @@ -882,6 +897,8 @@ class ShapeCollectionController { Mousetrap.bind(shortkeys["switch_lock_property"].value, switchLockHandler.bind(this), 'keydown'); Mousetrap.bind(shortkeys["switch_all_lock_property"].value, switchAllLockHandler.bind(this), 'keydown'); Mousetrap.bind(shortkeys["switch_occluded_property"].value, switchOccludedHandler.bind(this), 'keydown'); + Mousetrap.bind(shortkeys["switch_active_keyframe"].value, switchActiveKeyframeHandler.bind(this), 'keydown'); + Mousetrap.bind(shortkeys["switch_active_outside"].value, switchActiveOutsideHandler.bind(this), 'keydown'); Mousetrap.bind(shortkeys["switch_hide_mode"].value, switchHideHandler.bind(this), 'keydown'); Mousetrap.bind(shortkeys["switch_all_hide_mode"].value, switchAllHideHandler.bind(this), 'keydown'); Mousetrap.bind(shortkeys["change_default_label"].value, switchDefaultLabelHandler.bind(this), 'keydown'); @@ -902,6 +919,18 @@ class ShapeCollectionController { } } + switchActiveKeyframe() { + if (!window.cvat.mode) { + this._model.switchActiveKeyframe(); + } + } + + switchActiveOutside() { + if (!window.cvat.mode) { + this._model.switchActiveOutside(); + } + } + switchAllLock() { if (!window.cvat.mode || window.cvat.mode === 'aam') { this._model.switchAllLock(); diff --git a/cvat/apps/engine/static/engine/js/shapeCreator.js b/cvat/apps/engine/static/engine/js/shapeCreator.js index 6a04c4066497..7cd91213877b 100644 --- a/cvat/apps/engine/static/engine/js/shapeCreator.js +++ b/cvat/apps/engine/static/engine/js/shapeCreator.js @@ -136,15 +136,7 @@ class ShapeCreatorController { this.switchCreateMode(false); }.bind(this)); - let closeDrawHandler = Logger.shortkeyLogDecorator(function(e) { - e.preventDefault(); - if (this._model.createMode) { - this.switchCreateMode(true); - } - }.bind(this)); - Mousetrap.bind(shortkeys["switch_draw_mode"].value, switchDrawHandler.bind(this), 'keydown'); - Mousetrap.bind(shortkeys["cancel_draw_mode"].value, closeDrawHandler.bind(this), 'keydown'); } } @@ -195,8 +187,7 @@ class ShapeCreatorView { let shortkeys = window.cvat.config.shortkeys; this._createButton.attr('title', ` - ${shortkeys['switch_draw_mode'].view_value} - ${shortkeys['switch_draw_mode'].description}` + `\n` + - `${shortkeys['cancel_draw_mode'].view_value} - ${shortkeys['cancel_draw_mode'].description}`); + ${shortkeys['switch_draw_mode'].view_value} - ${shortkeys['switch_draw_mode'].description}`); this._labelSelector.attr('title', ` ${shortkeys['change_default_label'].view_value} - ${shortkeys['change_default_label'].description}`); diff --git a/cvat/apps/engine/static/engine/js/shapeGrouper.js b/cvat/apps/engine/static/engine/js/shapeGrouper.js index deb264df88bd..5ad97b17268d 100644 --- a/cvat/apps/engine/static/engine/js/shapeGrouper.js +++ b/cvat/apps/engine/static/engine/js/shapeGrouper.js @@ -109,12 +109,6 @@ class ShapeGrouperController { this.switch(); }.bind(this)); - let cancelGrouperHandler = Logger.shortkeyLogDecorator(function() { - if (this._model.active) { - this._model.cancel(); - } - }.bind(this)); - let resetGroupHandler = Logger.shortkeyLogDecorator(function() { if (this._model.active) { this._model.reset(); @@ -124,7 +118,6 @@ class ShapeGrouperController { }.bind(this)); Mousetrap.bind(shortkeys["switch_group_mode"].value, switchGrouperHandler.bind(this), 'keydown'); - Mousetrap.bind(shortkeys["cancel_group_mode"].value, cancelGrouperHandler.bind(this), 'keydown'); Mousetrap.bind(shortkeys["reset_group"].value, resetGroupHandler.bind(this), 'keydown'); } } @@ -160,7 +153,6 @@ class ShapeGrouperView { this._groupShapesButton.attr('title', ` ${shortkeys['switch_group_mode'].view_value} - ${shortkeys['switch_group_mode'].description}` + `\n` + - `${shortkeys['cancel_group_mode'].view_value} - ${shortkeys['cancel_group_mode'].description}` + `\n` + `${shortkeys['reset_group'].view_value} - ${shortkeys['reset_group'].description}`); grouperModel.subscribe(this); diff --git a/cvat/apps/engine/static/engine/js/shapeMerger.js b/cvat/apps/engine/static/engine/js/shapeMerger.js index 6386e4770b18..f3012cb5c748 100644 --- a/cvat/apps/engine/static/engine/js/shapeMerger.js +++ b/cvat/apps/engine/static/engine/js/shapeMerger.js @@ -35,7 +35,6 @@ class ShapeMergerModel extends Listener { } } - start() { if (!window.cvat.mode) { window.cvat.mode = 'merge'; @@ -225,14 +224,7 @@ class ShapeMergerController { this.switch(); }.bind(this)); - let cancelMergeHandler = Logger.shortkeyLogDecorator(function() { - if (this._model.mergeMode) { - this._model.cancel(); - } - }.bind(this)); - Mousetrap.bind(shortkeys["switch_merge_mode"].value, switchMergeHandler.bind(this), 'keydown'); - Mousetrap.bind(shortkeys["cancel_merge_mode"].value, cancelMergeHandler.bind(this), 'keydown'); } } @@ -259,8 +251,7 @@ class ShapeMergerView { let shortkeys = window.cvat.config.shortkeys; this._mergeButton.attr('title', ` - ${shortkeys['switch_merge_mode'].view_value} - ${shortkeys['switch_merge_mode'].description}` + `\n` + - `${shortkeys['cancel_merge_mode'].view_value} - ${shortkeys['cancel_merge_mode'].description}`); + ${shortkeys['switch_merge_mode'].view_value} - ${shortkeys['switch_merge_mode'].description}`); model.subscribe(this); } diff --git a/cvat/apps/engine/static/engine/js/userConfig.js b/cvat/apps/engine/static/engine/js/userConfig.js index 9f1fd0b1e345..0bd5e4c567b1 100644 --- a/cvat/apps/engine/static/engine/js/userConfig.js +++ b/cvat/apps/engine/static/engine/js/userConfig.js @@ -36,36 +36,18 @@ class Config { description: "start draw / stop draw" }, - cancel_draw_mode: { - value: "alt+n", - view_value: "Alt + N", - description: "close draw mode without create" - }, - switch_merge_mode: { value: "m", view_value: "M", description: "start merge / apply changes" }, - cancel_merge_mode: { - value: "alt+m", - view_value: "Alt + M", - description: "close merge mode without apply the merge" - }, - switch_group_mode: { value: "g", view_value: "G", description: "start group / apply changes" }, - cancel_group_mode: { - value: "alt+g", - view_value: "Alt + G", - description: "close group mode without changes" - }, - reset_group: { value: "shift+g", view_value: "Shift + G", @@ -114,6 +96,18 @@ class Config { description: "switch hide mode for active shape" }, + switch_active_keyframe: { + value: "k", + view_value: "K", + description: "switch keyframe property for active shape" + }, + + switch_active_outside: { + value: "o", + view_value: "O", + description: "switch outside property for active shape" + }, + switch_all_hide_mode: { value: "t h", view_value: "T + H", @@ -281,6 +275,12 @@ class Config { view_value: "Ctrl + Shift + Z / Ctrl + Y", description: "redo" }, + + cancel_mode: { + value: 'esc', + view_value: "Esc", + description: "cancel active mode" + } }; if (window.cvat && window.cvat.job && window.cvat.job.z_order) {