fix time to start analytics for desktop and fix rewards link
This commit is contained in:
parent
5d0e7af049
commit
96d9e24a4b
6 changed files with 48 additions and 6 deletions
|
@ -1199,5 +1199,6 @@
|
||||||
"For video content, use MP4s in H264/AAC format and a friendly bitrate (under 5 mbps) and resolution (720p) for more reliable streaming.": "For video content, use MP4s in H264/AAC format and a friendly bitrate (under 5 mbps) and resolution (720p) for more reliable streaming.",
|
"For video content, use MP4s in H264/AAC format and a friendly bitrate (under 5 mbps) and resolution (720p) for more reliable streaming.": "For video content, use MP4s in H264/AAC format and a friendly bitrate (under 5 mbps) and resolution (720p) for more reliable streaming.",
|
||||||
"this channel": "this channel",
|
"this channel": "this channel",
|
||||||
"Share this channel": "Share this channel",
|
"Share this channel": "Share this channel",
|
||||||
"File preview": "File preview"
|
"File preview": "File preview",
|
||||||
|
"Go Home": "Go Home"
|
||||||
}
|
}
|
|
@ -32,6 +32,7 @@ type Props = {
|
||||||
autoplay: boolean,
|
autoplay: boolean,
|
||||||
renderMode: string,
|
renderMode: string,
|
||||||
thumbnail: string,
|
thumbnail: string,
|
||||||
|
desktopPlayStartTime?: number,
|
||||||
};
|
};
|
||||||
|
|
||||||
class FileRender extends React.PureComponent<Props> {
|
class FileRender extends React.PureComponent<Props> {
|
||||||
|
@ -64,13 +65,29 @@ class FileRender extends React.PureComponent<Props> {
|
||||||
}
|
}
|
||||||
|
|
||||||
renderViewer() {
|
renderViewer() {
|
||||||
const { currentTheme, contentType, downloadPath, fileExtension, streamingUrl, uri, renderMode } = this.props;
|
const {
|
||||||
|
currentTheme,
|
||||||
|
contentType,
|
||||||
|
downloadPath,
|
||||||
|
fileExtension,
|
||||||
|
streamingUrl,
|
||||||
|
uri,
|
||||||
|
renderMode,
|
||||||
|
desktopPlayStartTime,
|
||||||
|
} = this.props;
|
||||||
const source = streamingUrl;
|
const source = streamingUrl;
|
||||||
|
|
||||||
switch (renderMode) {
|
switch (renderMode) {
|
||||||
case RENDER_MODES.AUDIO:
|
case RENDER_MODES.AUDIO:
|
||||||
case RENDER_MODES.VIDEO:
|
case RENDER_MODES.VIDEO:
|
||||||
return <VideoViewer uri={uri} source={source} contentType={contentType} />;
|
return (
|
||||||
|
<VideoViewer
|
||||||
|
uri={uri}
|
||||||
|
source={source}
|
||||||
|
contentType={contentType}
|
||||||
|
desktopPlayStartTime={desktopPlayStartTime}
|
||||||
|
/>
|
||||||
|
);
|
||||||
case RENDER_MODES.IMAGE:
|
case RENDER_MODES.IMAGE:
|
||||||
return <ImageViewer uri={uri} source={source} />;
|
return <ImageViewer uri={uri} source={source} />;
|
||||||
case RENDER_MODES.HTML:
|
case RENDER_MODES.HTML:
|
||||||
|
|
|
@ -40,6 +40,7 @@ export default function FileRenderFloating(props: Props) {
|
||||||
} = props;
|
} = props;
|
||||||
const isMobile = useIsMobile();
|
const isMobile = useIsMobile();
|
||||||
const [fileViewerRect, setFileViewerRect] = useState();
|
const [fileViewerRect, setFileViewerRect] = useState();
|
||||||
|
const [desktopPlayStartTime, setDesktopPlayStartTime] = useState();
|
||||||
const [position, setPosition] = usePersistedState('floating-file-viewer:position', {
|
const [position, setPosition] = usePersistedState('floating-file-viewer:position', {
|
||||||
x: -25,
|
x: -25,
|
||||||
y: window.innerHeight - 400,
|
y: window.innerHeight - 400,
|
||||||
|
@ -73,6 +74,12 @@ export default function FileRenderFloating(props: Props) {
|
||||||
};
|
};
|
||||||
}, [setFileViewerRect, isFloating]);
|
}, [setFileViewerRect, isFloating]);
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
// @if TARGET='app'
|
||||||
|
setDesktopPlayStartTime(Date.now());
|
||||||
|
// @endif
|
||||||
|
}, [uri]);
|
||||||
|
|
||||||
if (!isPlayable || !uri || (isFloating && (isMobile || !floatingPlayerEnabled))) {
|
if (!isPlayable || !uri || (isFloating && (isMobile || !floatingPlayerEnabled))) {
|
||||||
return null;
|
return null;
|
||||||
}
|
}
|
||||||
|
@ -134,7 +141,16 @@ export default function FileRenderFloating(props: Props) {
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
{isReadyToPlay ? <FileRender uri={uri} /> : <LoadingScreen status={loadingMessage} />}
|
{isReadyToPlay ? (
|
||||||
|
<FileRender
|
||||||
|
uri={uri}
|
||||||
|
// @if TARGET='app'
|
||||||
|
desktopPlayStartTime={desktopPlayStartTime}
|
||||||
|
// @endif
|
||||||
|
/>
|
||||||
|
) : (
|
||||||
|
<LoadingScreen status={loadingMessage} />
|
||||||
|
)}
|
||||||
{isFloating && (
|
{isFloating && (
|
||||||
<div className="draggable content__info">
|
<div className="draggable content__info">
|
||||||
<div className="claim-preview__title" title={title || uri}>
|
<div className="claim-preview__title" title={title || uri}>
|
||||||
|
|
|
@ -73,7 +73,7 @@ function InviteNew(props: Props) {
|
||||||
<div className={'columns'}>
|
<div className={'columns'}>
|
||||||
<Card
|
<Card
|
||||||
title={__('Invite Link')}
|
title={__('Invite Link')}
|
||||||
subtitle={__('Share this link with friends (or enemies) and get LBC when they join lbry.tv')}
|
subtitle={__('Share this link with friends (or enemies) and earn LBC when they join lbry.tv')}
|
||||||
actions={
|
actions={
|
||||||
<React.Fragment>
|
<React.Fragment>
|
||||||
<CopyableText label={__('Your invite link')} copyable={referral} />
|
<CopyableText label={__('Your invite link')} copyable={referral} />
|
||||||
|
|
|
@ -31,6 +31,7 @@ function RewardAuthIntro(props: Props) {
|
||||||
}
|
}
|
||||||
actions={
|
actions={
|
||||||
<Button
|
<Button
|
||||||
|
requiresAuth
|
||||||
button="primary"
|
button="primary"
|
||||||
navigate={`/$/${PAGES.REWARDS_VERIFY}?redirect=/$/${PAGES.REWARDS}`}
|
navigate={`/$/${PAGES.REWARDS_VERIFY}?redirect=/$/${PAGES.REWARDS}`}
|
||||||
label={__('Unlock Rewards')}
|
label={__('Unlock Rewards')}
|
||||||
|
|
|
@ -29,6 +29,7 @@ type Props = {
|
||||||
uri: string,
|
uri: string,
|
||||||
autoplaySetting: boolean,
|
autoplaySetting: boolean,
|
||||||
autoplayIfEmbedded: boolean,
|
autoplayIfEmbedded: boolean,
|
||||||
|
desktopPlayStartTime?: number,
|
||||||
doAnalyticsView: (string, number) => Promise<any>,
|
doAnalyticsView: (string, number) => Promise<any>,
|
||||||
claimRewards: () => void,
|
claimRewards: () => void,
|
||||||
savePosition: (string, number) => void,
|
savePosition: (string, number) => void,
|
||||||
|
@ -56,6 +57,7 @@ function VideoViewer(props: Props) {
|
||||||
doAnalyticsView,
|
doAnalyticsView,
|
||||||
claimRewards,
|
claimRewards,
|
||||||
savePosition,
|
savePosition,
|
||||||
|
desktopPlayStartTime,
|
||||||
} = props;
|
} = props;
|
||||||
const claimId = claim && claim.claim_id;
|
const claimId = claim && claim.claim_id;
|
||||||
const isAudio = contentType.includes('audio');
|
const isAudio = contentType.includes('audio');
|
||||||
|
@ -85,7 +87,12 @@ function VideoViewer(props: Props) {
|
||||||
}
|
}
|
||||||
|
|
||||||
function doTrackingFirstPlay(e: Event, data: any) {
|
function doTrackingFirstPlay(e: Event, data: any) {
|
||||||
const timeToStartInMs = data.secondsToLoad * 1000;
|
let timeToStartInMs = data.secondsToLoad * 1000;
|
||||||
|
if (desktopPlayStartTime !== undefined) {
|
||||||
|
const differenceToAdd = Date.now() - desktopPlayStartTime;
|
||||||
|
timeToStartInMs += differenceToAdd;
|
||||||
|
}
|
||||||
|
|
||||||
analytics.videoStartEvent(claimId, timeToStartInMs);
|
analytics.videoStartEvent(claimId, timeToStartInMs);
|
||||||
doAnalyticsView(uri, timeToStartInMs).then(() => {
|
doAnalyticsView(uri, timeToStartInMs).then(() => {
|
||||||
claimRewards();
|
claimRewards();
|
||||||
|
|
Loading…
Reference in a new issue