Add live detection to livestream page

- reduce interval from 15 seconds to 10 seconds
This commit is contained in:
DispatchCommit 2021-03-22 02:42:02 -07:00
parent 816bd07570
commit 1e0afd1b86
3 changed files with 29 additions and 12 deletions

View file

@ -43,11 +43,13 @@ export default function LivestreamLink(props: Props) {
})
.catch((e) => {});
}
let interval;
if (livestreamChannelId) {
if (!interval) fetchIsStreaming();
interval = setInterval(fetchIsStreaming, 15 * 1000);
interval = setInterval(fetchIsStreaming, 10 * 1000);
}
return () => {
if (interval) {
clearInterval(interval);

View file

@ -1,14 +1,15 @@
import { connect } from 'react-redux';
import { doResolveUri } from 'lbry-redux';
import { doResolveUri, makeSelectClaimForUri } from 'lbry-redux';
import { doSetPlayingUri } from 'redux/actions/content';
import { doUserSetReferrer } from 'redux/actions/user';
import { selectUserVerifiedEmail } from 'redux/selectors/user';
import { selectHasUnclaimedRefereeReward } from 'redux/selectors/rewards';
import LivestreamPage from './view';
const select = (state) => ({
const select = (state, props) => ({
hasUnclaimedRefereeReward: selectHasUnclaimedRefereeReward(state),
isAuthenticated: selectUserVerifiedEmail(state),
channelClaim: makeSelectClaimForUri(props.uri)(state),
});
export default connect(select, {

View file

@ -11,16 +11,25 @@ type Props = {
doSetPlayingUri: ({ uri: ?string }) => void,
isAuthenticated: boolean,
doUserSetReferrer: (string) => void,
channelClaim: ChannelClaim,
};
export default function LivestreamPage(props: Props) {
const { uri, claim, doSetPlayingUri, isAuthenticated, doUserSetReferrer } = props;
const {
uri,
claim,
doSetPlayingUri,
isAuthenticated,
doUserSetReferrer,
channelClaim,
} = props;
const [activeViewers, setActiveViewers] = React.useState(0);
const [isLive, setIsLive] = React.useState(false);
const livestreamChannelId = channelClaim && channelClaim.signing_channel && channelClaim.signing_channel.claim_id;
React.useEffect(() => {
function checkIsLive() {
fetch(`${BITWAVE_API}/MarkPugner`)
fetch(`${BITWAVE_API}/${livestreamChannelId}`)
.then((res) => res.json())
.then((res) => {
if (!res || !res.data) {
@ -30,23 +39,24 @@ export default function LivestreamPage(props: Props) {
setActiveViewers(res.data.viewCount);
if (res.data.live) {
setIsLive(true);
if (res.data.hasOwnProperty('live')) {
setIsLive(res.data.live);
}
});
}
let interval;
checkIsLive();
if (uri) {
interval = setInterval(checkIsLive, 10000);
if (livestreamChannelId) {
if (!interval) checkIsLive();
interval = setInterval(checkIsLive, 10 * 1000);
}
return () => {
if (interval) {
clearInterval(interval);
}
};
}, [uri]);
}, [livestreamChannelId]);
const stringifiedClaim = JSON.stringify(claim);
React.useEffect(() => {
@ -77,7 +87,11 @@ export default function LivestreamPage(props: Props) {
return (
<Page className="file-page" filePage livestream>
<LivestreamLayout uri={uri} activeViewers={activeViewers} isLive={isLive} />
<LivestreamLayout
uri={uri}
activeViewers={activeViewers}
isLive={isLive}
/>
</Page>
);
}