From d2b3eebe00ea60df56704045a8459acb03867555 Mon Sep 17 00:00:00 2001 From: Thibaut Girka Date: Tue, 31 Jul 2018 23:03:16 +0200 Subject: [PATCH] [Glitch] Show media modal on public timeline Port e0b1e17bd04d7f9b533ab462aee4544a5f5fb926 to glitch-soc --- app/javascript/flavours/glitch/components/status.js | 2 +- .../flavours/glitch/containers/timeline_container.js | 12 ++++++++++-- .../glitch/features/ui/components/modal_root.js | 11 +++++++++++ 3 files changed, 22 insertions(+), 3 deletions(-) diff --git a/app/javascript/flavours/glitch/components/status.js b/app/javascript/flavours/glitch/components/status.js index c03c3017e..169cd3963 100644 --- a/app/javascript/flavours/glitch/components/status.js +++ b/app/javascript/flavours/glitch/components/status.js @@ -423,7 +423,7 @@ export default class Status extends ImmutablePureComponent { mediaIcon = 'video-camera'; } else { // Media type is 'image' or 'gifv' media = ( - + {Component => ( - {timeline} + + {timeline} + {ReactDOM.createPortal( + , + document.getElementById('modal-container'), + )} + ); diff --git a/app/javascript/flavours/glitch/features/ui/components/modal_root.js b/app/javascript/flavours/glitch/features/ui/components/modal_root.js index 7e9980ef7..86e1f8695 100644 --- a/app/javascript/flavours/glitch/features/ui/components/modal_root.js +++ b/app/javascript/flavours/glitch/features/ui/components/modal_root.js @@ -44,6 +44,17 @@ export default class ModalRoot extends React.PureComponent { onClose: PropTypes.func.isRequired, }; + getSnapshotBeforeUpdate () { + const visible = !!this.props.type; + return { + overflowY: visible ? 'hidden' : null, + }; + } + + componentDidUpdate (prevProps, prevState, { overflowY }) { + document.body.style.overflowY = overflowY; + } + renderLoading = modalId => () => { return ['MEDIA', 'VIDEO', 'BOOST', 'FAVOURITE', 'DOODLE', 'CONFIRM', 'ACTIONS'].indexOf(modalId) === -1 ? : null; }