Submission notice size now updates when the video size changes.

React listeners are properly cleaned up now.
This commit is contained in:
Ajay Ramachandran 2020-04-14 00:47:09 -04:00
parent 18c7be8161
commit 1b2bc6def4
3 changed files with 24 additions and 0 deletions

View file

@ -30,6 +30,8 @@ class SubmissionNoticeComponent extends React.Component<SubmissionNoticeProps, S
noticeRef: React.MutableRefObject<NoticeComponent>;
timeEditRefs: React.RefObject<SponsorTimeEditComponent>[];
videoObserver: MutationObserver;
constructor(props: SubmissionNoticeProps) {
super(props);
this.noticeRef = React.createRef();
@ -47,6 +49,24 @@ class SubmissionNoticeComponent extends React.Component<SubmissionNoticeProps, S
}
}
componentDidMount() {
// Catch and rerender when the video size changes
//TODO: Use ResizeObserver when it is supported in TypeScript
this.videoObserver = new MutationObserver(() => {
this.forceUpdate();
});
this.videoObserver.observe(this.contentContainer().v, {
attributes: true
});
}
componentWillUnmount() {
if (this.videoObserver) {
this.videoObserver.disconnect();
}
}
render() {
return (
<NoticeComponent noticeTitle={this.state.noticeTitle}

View file

@ -52,6 +52,8 @@ class SkipNotice {
}
close() {
ReactDOM.unmountComponentAtNode(this.noticeElement);
this.noticeElement.remove();
}
}

View file

@ -56,6 +56,8 @@ class SubmissionNotice {
}
close() {
ReactDOM.unmountComponentAtNode(this.noticeElement);
this.noticeElement.remove();
}
}