LogalDeveloper/owncast
0
Fork 0
Code Activity

refactor(stories): co-locate stories with components (#2078)

Browse Source 
* refactor: move ActionButton component

* refactor: move BanUserButton component

* refactor: move ChatActionMessage component

* refactor: move ChatContainer component

* refactor: move AuthModal component

* refactor: move BrowserNotifyModal component

* refactor: move ChatUserMessage component

* refactor: move ChatJoinMessage component

* refactor: move ChatTextField component

* refactor: move ChatUserBadge component

* refactor: move FollowerCollection and SingleFollower components

* fix: bad import path

* refactor: move FollowModal component

* refactor: move Modal component

* refactor: move ContentHeader component

* refactor: move ChatSystemMessage component

* refactor: move Header component

* refactor: move Footer component

* refactor: move StatusBar component

* refactor: move OfflineBanner component

* refactor: move OwncastPlayer component

* refactor: move IndieAuthModal component

* refactor: move SocialLinks component

* refactor: move VideoPoster component

* refactor: move FollowModal component

* refactor: move FediAuthModal.tsx component

* refactor: move UserDropdown component

* refactor: move ChatSocialMessage component

* refactor: move Logo component

* refactor: move NotifyReminderPopup component

* refactor: move NameChangeModal component

* refactor: move FatalErrorStateModal component

* refactor: move ChatModeratorNotification component

* refactor: move ChatModerationActionMenu and ChatModerationDetailsModal components

* refactor: move CustomPageContent component

* refactor: move storybook Introduction file

* refactor: update storybook story import path

* refactor: move storybook preview styles

* refactor: move storybook doc pages

* refactor: move Color and ImageAsset components

* fix: bad import path

* fix: bad import path in story file
This commit is contained in:
James Young
2022-09-03 20:38:52 +02:00
committed by GitHub
parent 9f550a87d2
commit 5ebbbb8bf2
82 changed files with 120 additions and 121 deletions
Download Patch File Download Diff File Expand all files Collapse all files

45
web/components/video/VideoPoster/VideoPoster.tsx Normal file
View File

@@ -0,0 +1,45 @@
import { useEffect, useState } from 'react';
import CrossfadeImage from '../../ui/CrossfadeImage/CrossfadeImage';
import s from './VideoPoster.module.scss';
const REFRESH_INTERVAL = 20_000;
interface Props {
initialSrc: string;
src: string;
online: boolean;
}
export default function VideoPoster(props: Props) {
const { online, initialSrc, src: base } = props;
let timer: ReturnType<typeof setInterval>;
const [src, setSrc] = useState(initialSrc);
const [duration, setDuration] = useState('0s');
useEffect(() => {
clearInterval(timer);
timer = setInterval(() => {
if (duration === '0s') {
setDuration('3s');
}
setSrc(`${base}?${Date.now()}`);
}, REFRESH_INTERVAL);
}, []);
return (
<div className={s.poster}>
{!online && <img src={initialSrc} alt="logo" />}
{online && (
<CrossfadeImage
src={src}
duration={duration}
objectFit="cover"
width="100%"
height="100%"
/>
)}
</div>
);
}