Embed: add replay button
Also, changed "Rewatch or Discuss" to "Discuss + external arrow" since there is a dedicated re-watch button.
This commit is contained in:
parent
fcea4005eb
commit
9ec5a7c298
3 changed files with 18 additions and 2 deletions
|
@ -2169,5 +2169,6 @@
|
||||||
"Content Page": "Content Page",
|
"Content Page": "Content Page",
|
||||||
"Card Last 4": "Card Last 4",
|
"Card Last 4": "Card Last 4",
|
||||||
"Search blocked channel name": "Search blocked channel name",
|
"Search blocked channel name": "Search blocked channel name",
|
||||||
|
"Discuss": "Discuss",
|
||||||
"--end--": "--end--"
|
"--end--": "--end--"
|
||||||
}
|
}
|
||||||
|
|
|
@ -231,6 +231,10 @@
|
||||||
.button + .button {
|
.button + .button {
|
||||||
margin-left: var(--spacing-m);
|
margin-left: var(--spacing-m);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.button--link {
|
||||||
|
vertical-align: middle;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.file-viewer__overlay-logo {
|
.file-viewer__overlay-logo {
|
||||||
|
|
|
@ -1,6 +1,7 @@
|
||||||
// @flow
|
// @flow
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import Button from 'component/button';
|
import Button from 'component/button';
|
||||||
|
import * as ICONS from 'constants/icons';
|
||||||
import { formatLbryUrlForWeb } from 'util/url';
|
import { formatLbryUrlForWeb } from 'util/url';
|
||||||
import { withRouter } from 'react-router';
|
import { withRouter } from 'react-router';
|
||||||
import { URL, SITE_NAME } from 'config';
|
import { URL, SITE_NAME } from 'config';
|
||||||
|
@ -34,6 +35,7 @@ function FileViewerEmbeddedEnded(props: Props) {
|
||||||
// $FlowFixMe
|
// $FlowFixMe
|
||||||
const prompt = prompts[promptKey];
|
const prompt = prompts[promptKey];
|
||||||
const lbrytvLink = `${URL}${formatLbryUrlForWeb(uri)}?src=${promptKey}`;
|
const lbrytvLink = `${URL}${formatLbryUrlForWeb(uri)}?src=${promptKey}`;
|
||||||
|
const showReplay = Boolean(window.player);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="file-viewer__overlay">
|
<div className="file-viewer__overlay">
|
||||||
|
@ -46,9 +48,18 @@ function FileViewerEmbeddedEnded(props: Props) {
|
||||||
<>
|
<>
|
||||||
<div className="file-viewer__overlay-title file-viewer_embed-ended-title">{prompt}</div>
|
<div className="file-viewer__overlay-title file-viewer_embed-ended-title">{prompt}</div>
|
||||||
<div className="file-viewer__overlay-actions">
|
<div className="file-viewer__overlay-actions">
|
||||||
{ /* add button to replay? */ }
|
|
||||||
<>
|
<>
|
||||||
<Button label={__('Rewatch or Discuss')} button="primary" href={lbrytvLink} />
|
{showReplay && (
|
||||||
|
<Button
|
||||||
|
title={__('Replay')}
|
||||||
|
button="link"
|
||||||
|
iconRight={ICONS.REPLAY}
|
||||||
|
onClick={() => {
|
||||||
|
if (window.player) window.player.play();
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
)}
|
||||||
|
<Button label={__('Discuss')} iconRight={ICONS.EXTERNAL} button="primary" href={lbrytvLink} />
|
||||||
{!isAuthenticated && (
|
{!isAuthenticated && (
|
||||||
<Button
|
<Button
|
||||||
label={__('Join %SITE_NAME%', { SITE_NAME })}
|
label={__('Join %SITE_NAME%', { SITE_NAME })}
|
||||||
|
|
Loading…
Reference in a new issue