diff options
author | Thibaut Girka <thib@sitedethib.com> | 2018-07-25 14:13:18 +0200 |
---|---|---|
committer | ThibG <thib@sitedethib.com> | 2018-07-26 08:42:25 +0200 |
commit | 82ab5aacb24edf793f391cb4122116bf92ee0e7a (patch) | |
tree | 04ff36ab9d2f2531827215430dd8658f69aaff28 /app/javascript | |
parent | 02326a432239c58a6cb9ae18486826827b35a190 (diff) |
Prevent scrolling main frame when navigating in image gallery with arrow keys
Diffstat (limited to 'app/javascript')
-rw-r--r-- | app/javascript/flavours/glitch/features/ui/components/media_modal.js | 10 |
1 files changed, 7 insertions, 3 deletions
diff --git a/app/javascript/flavours/glitch/features/ui/components/media_modal.js b/app/javascript/flavours/glitch/features/ui/components/media_modal.js index bffe3b1f7..d4fd45d4d 100644 --- a/app/javascript/flavours/glitch/features/ui/components/media_modal.js +++ b/app/javascript/flavours/glitch/features/ui/components/media_modal.js @@ -48,23 +48,27 @@ export default class MediaModal extends ImmutablePureComponent { this.setState({ index: index % this.props.media.size }); } - handleKeyUp = (e) => { + handleKeyDown = (e) => { switch(e.key) { case 'ArrowLeft': this.handlePrevClick(); + e.preventDefault(); + e.stopPropagation(); break; case 'ArrowRight': this.handleNextClick(); + e.preventDefault(); + e.stopPropagation(); break; } } componentDidMount () { - window.addEventListener('keyup', this.handleKeyUp, false); + window.addEventListener('keydown', this.handleKeyDown, false); } componentWillUnmount () { - window.removeEventListener('keyup', this.handleKeyUp); + window.removeEventListener('keydown', this.handleKeyDown); } getIndex () { |