LBRYFoundation/lbry-desktop
1
0
Fork 0
mirror of https://github.com/LBRYFoundation/lbry-desktop.git synced 2025-09-02 18:25:12 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Video: Consolidate showTapButton() into a single call since the functionality is mutually exclusive.

Browse source
This commit is contained in:
infiinte-persistence 2020-07-15 23:51:05 +08:00 • committed by Sean Yesmunt
parent 7bef092013
commit 8e7604ec33
1 changed files with 27 additions and 23 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

50
ui/component/viewers/videoViewer/internal/videojs.jsx
View file

@ -102,30 +102,38 @@ export default React.memo<Props>(function VideoJs(props: Props) {
const tapToRetryRef = useRef(); const tapToRetryRef = useRef();
const TAP = { const TAP = {
NONE: 'NONE',
UNMUTE: 'UNMUTE', UNMUTE: 'UNMUTE',
RETRY: 'RETRY', RETRY: 'RETRY',
}; };
function showTapButton(tapButton, newState) { function showTapButton(tapButton) {
let theRef; const setButtonVisibility = (theRef, newState) => {
// Use the DOM to control the state of the button to prevent re-renders.
if (theRef.current) {
const curState = theRef.current.style.visibility === 'visible';
if (newState !== curState) {
theRef.current.style.visibility = newState ? 'visible' : 'hidden';
}
}
};
switch (tapButton) { switch (tapButton) {
case TAP.NONE:
setButtonVisibility(tapToUnmuteRef, false);
setButtonVisibility(tapToRetryRef, false);
break;
case TAP.UNMUTE: case TAP.UNMUTE:
theRef = tapToUnmuteRef; setButtonVisibility(tapToUnmuteRef, true);
setButtonVisibility(tapToRetryRef, false);
break; break;
case TAP.RETRY: case TAP.RETRY:
theRef = tapToRetryRef; setButtonVisibility(tapToUnmuteRef, false);
setButtonVisibility(tapToRetryRef, true);
break; break;
default: default:
if (isDev) throw new Error('showTapButton: unexpected ref'); if (isDev) throw new Error('showTapButton: unexpected ref');
return; break;
}
// Use the DOM to control the state of the button to prevent re-renders.
if (theRef.current) {
const curState = theRef.current.style.visibility === 'visible';
if (newState !== curState) {
theRef.current.style.visibility = newState ? 'visible' : 'hidden';
}
} }
} }
@ -136,13 +144,13 @@ export default React.memo<Props>(function VideoJs(props: Props) {
player.volume(1.0); player.volume(1.0);
} }
} }
showTapButton(TAP.UNMUTE, false); showTapButton(TAP.NONE);
} }
function retryVideoAfterFailure() { function retryVideoAfterFailure() {
if (player) { if (player) {
setReload(Date.now()); setReload(Date.now());
showTapButton(TAP.RETRY, false); showTapButton(TAP.NONE);
} }
} }
@ -150,21 +158,18 @@ export default React.memo<Props>(function VideoJs(props: Props) {
if (player && (player.muted() || player.volume() === 0)) { if (player && (player.muted() || player.volume() === 0)) {
// The css starts as "hidden". We make it visible here without // The css starts as "hidden". We make it visible here without
// re-rendering the whole thing. // re-rendering the whole thing.
showTapButton(TAP.UNMUTE, true); showTapButton(TAP.UNMUTE);
} }
showTapButton(TAP.RETRY, false);
} }
function onVolumeChange() { function onVolumeChange() {
if (player && !player.muted()) { if (player && !player.muted()) {
showTapButton(TAP.UNMUTE, false); showTapButton(TAP.NONE);
} }
} }
function onError() { function onError() {
showTapButton(TAP.UNMUTE, false); showTapButton(TAP.RETRY);
showTapButton(TAP.RETRY, true);
if (player && player.loadingSpinner) { if (player && player.loadingSpinner) {
player.loadingSpinner.hide(); player.loadingSpinner.hide();
@ -172,8 +177,7 @@ export default React.memo<Props>(function VideoJs(props: Props) {
} }
function onEnded() { function onEnded() {
showTapButton(TAP.UNMUTE, false); showTapButton(TAP.NONE);
showTapButton(TAP.RETRY, false);
} }
function handleKeyDown(e: KeyboardEvent) { function handleKeyDown(e: KeyboardEvent) {