From d199806969be99f968cc9b3a74cc233e86e0cc12 Mon Sep 17 00:00:00 2001 From: ThibG Date: Thu, 26 Jul 2018 04:50:50 +0200 Subject: Prevent scrolling main frame when navigating in image gallery with arrow keys (#8073) --- app/javascript/mastodon/features/ui/components/media_modal.js | 10 +++++++--- 1 file changed, 7 insertions(+), 3 deletions(-) diff --git a/app/javascript/mastodon/features/ui/components/media_modal.js b/app/javascript/mastodon/features/ui/components/media_modal.js index 6af0a101c..12db95326 100644 --- a/app/javascript/mastodon/features/ui/components/media_modal.js +++ b/app/javascript/mastodon/features/ui/components/media_modal.js @@ -54,19 +54,23 @@ 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); if (this.context.router) { const history = this.context.router.history; history.push(history.location.pathname, previewState); @@ -77,7 +81,7 @@ export default class MediaModal extends ImmutablePureComponent { } componentWillUnmount () { - window.removeEventListener('keyup', this.handleKeyUp); + window.removeEventListener('keydown', this.handleKeyDown); if (this.context.router) { this.unlistenHistory(); -- cgit