aboutsummaryrefslogtreecommitdiffhomepage
diff options
context:
space:
mode:
authorAjay Ramachandran <[email protected]>2020-04-14 00:47:09 -0400
committerAjay Ramachandran <[email protected]>2020-04-14 00:47:09 -0400
commit1b2bc6def43e60e84cd46ded93bfbd8539ae1d4d (patch)
treed612b82c87583ec4789f6e19ff5cb37ab0c3aba8
parent18c7be8161afaac9fc21ffff352993d26e7d66a3 (diff)
downloadSponsorBlock-1b2bc6def43e60e84cd46ded93bfbd8539ae1d4d.tar.gz
SponsorBlock-1b2bc6def43e60e84cd46ded93bfbd8539ae1d4d.zip
Submission notice size now updates when the video size changes.
React listeners are properly cleaned up now.
-rw-r--r--src/components/SubmissionNoticeComponent.tsx20
-rw-r--r--src/render/SkipNotice.tsx2
-rw-r--r--src/render/SubmissionNotice.tsx2
3 files changed, 24 insertions, 0 deletions
diff --git a/src/components/SubmissionNoticeComponent.tsx b/src/components/SubmissionNoticeComponent.tsx
index 153e63dc..a9943479 100644
--- a/src/components/SubmissionNoticeComponent.tsx
+++ b/src/components/SubmissionNoticeComponent.tsx
@@ -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}
diff --git a/src/render/SkipNotice.tsx b/src/render/SkipNotice.tsx
index 281260ed..49265fb8 100644
--- a/src/render/SkipNotice.tsx
+++ b/src/render/SkipNotice.tsx
@@ -52,6 +52,8 @@ class SkipNotice {
}
close() {
+ ReactDOM.unmountComponentAtNode(this.noticeElement);
+
this.noticeElement.remove();
}
}
diff --git a/src/render/SubmissionNotice.tsx b/src/render/SubmissionNotice.tsx
index 3220c50f..71f4c1e7 100644
--- a/src/render/SubmissionNotice.tsx
+++ b/src/render/SubmissionNotice.tsx
@@ -56,6 +56,8 @@ class SubmissionNotice {
}
close() {
+ ReactDOM.unmountComponentAtNode(this.noticeElement);
+
this.noticeElement.remove();
}
}