Show notice in first slot if available

This commit is contained in:
Ajay Ramachandran 2021-07-18 15:42:54 -04:00
parent 6fa5aea680
commit 8c9424b6c5
2 changed files with 8 additions and 3 deletions

View file

@ -12,6 +12,7 @@ export interface NoticeProps {
maxCountdownTime?: () => number,
amountOfPreviousNotices?: number,
showInSecondSlot?: boolean,
timed?: boolean,
idSuffix?: string,
@ -97,7 +98,7 @@ class NoticeComponent extends React.Component<NoticeProps, NoticeState> {
return (
<div id={"sponsorSkipNotice" + this.idSuffix}
className={"sponsorSkipObject sponsorSkipNoticeParent"
+ (this.amountOfPreviousNotices > 0 ? " secondSkipNotice" : "")}
+ (this.props.showInSecondSlot ? " secondSkipNotice" : "")}
onMouseEnter={(e) => this.onMouseEnter(e) }
onMouseLeave={() => this.timerMouseLeave()}
style={noticeStyle} >

View file

@ -59,6 +59,7 @@ class SkipNoticeComponent extends React.Component<SkipNoticeProps, SkipNoticeSta
contentContainer: ContentContainer;
amountOfPreviousNotices: number;
showInSecondSlot: boolean;
audio: HTMLAudioElement;
idSuffix: string;
@ -88,8 +89,10 @@ class SkipNoticeComponent extends React.Component<SkipNoticeProps, SkipNoticeSta
noticeTitle = chrome.i18n.getMessage(messageId).replace("{0}", categoryName);
}
//add notice
this.amountOfPreviousNotices = document.getElementsByClassName("sponsorSkipNotice").length;
const previousSkipNotices = document.getElementsByClassName("sponsorSkipNoticeParent");
this.amountOfPreviousNotices = previousSkipNotices.length;
// If there is at least one already in the first slot
this.showInSecondSlot = previousSkipNotices.length > 0 && [...previousSkipNotices].some(notice => !notice.classList.contains("secondSkipNotice"));
// Sort segments
if (this.segments.length > 1) {
@ -156,6 +159,7 @@ class SkipNoticeComponent extends React.Component<SkipNoticeProps, SkipNoticeSta
return (
<NoticeComponent noticeTitle={this.state.noticeTitle}
amountOfPreviousNotices={this.amountOfPreviousNotices}
showInSecondSlot={this.showInSecondSlot}
idSuffix={this.idSuffix}
fadeIn={true}
startFaded={true}