LBRYCommunity/lbry-desktop
1
0
Fork 0
Code Issues 596 Pull requests 6 Projects Releases 238 Packages Wiki Activity

seeing if this fixes offcenter play button

Browse source
This commit is contained in:
Anthony 2021-08-30 21:48:47 +02:00
parent 391e2e25a2
commit 38740d7e43
No known key found for this signature in database
GPG key ID: C386D3C93D50E356
2 changed files with 22 additions and 20 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

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

@ -341,7 +341,6 @@ export default React.memo<Props>(function VideoJs(props: Props) {
} }
} }
function onInitialPlay() { function onInitialPlay() {
const player = playerRef.current; const player = playerRef.current;
// show the unmute button if the video is muted // show the unmute button if the video is muted
@ -551,6 +550,9 @@ export default React.memo<Props>(function VideoJs(props: Props) {
const vjs = videojs(el, videoJsOptions, () => { const vjs = videojs(el, videoJsOptions, () => {
const player = playerRef.current; const player = playerRef.current;
const playBT = document.getElementsByClassName('vjs-big-play-button')[0];
playBT.style.display = 'none';
// this seems like a weird thing to have to check for here // this seems like a weird thing to have to check for here
if (!player) return; if (!player) return;
@ -564,27 +566,27 @@ export default React.memo<Props>(function VideoJs(props: Props) {
player.on('volumechange', onVolumeChange); player.on('volumechange', onVolumeChange);
player.on('error', onError); player.on('error', onError);
player.on('ended', onEnded); player.on('ended', onEnded);
player.on('loadstart', function(){ // player.on('loadstart', function(){
console.log('LOADED HERE'); // console.log('LOADED HERE');
//
const playBT = document.getElementsByClassName('vjs-big-play-button')[0]; // const playBT = document.getElementsByClassName('vjs-big-play-button')[0];
const videoDiv = player.children_[0]; // const videoDiv = player.children_[0];
const controlBar = document.getElementsByClassName('vjs-control-bar')[0]; // const controlBar = document.getElementsByClassName('vjs-control-bar')[0];
const leftWidth = ((videoDiv.offsetWidth - playBT.offsetWidth) / 2) + 'px'; // const leftWidth = ((videoDiv.offsetWidth - playBT.offsetWidth) / 2) + 'px';
const availableHeight = videoDiv.offsetHeight - controlBar.offsetHeight; // const availableHeight = videoDiv.offsetHeight - controlBar.offsetHeight;
const topHeight = (((availableHeight - playBT.offsetHeight) / 2) + 11) + 'px'; // const topHeight = (((availableHeight - playBT.offsetHeight) / 2) + 11) + 'px';
//
playBT.style.top = topHeight; // playBT.style.top = topHeight;
playBT.style.left = leftWidth; // playBT.style.left = leftWidth;
playBT.style.margin = 0; // playBT.style.margin = 0;
// })
})
// on ios, show a play button when paused // on ios, show a play button when paused
if (IS_IOS) { if (IS_IOS) {
const playBT = document.getElementsByClassName('vjs-big-play-button')[0]; const playBT = document.getElementsByClassName('vjs-big-play-button')[0];
player.on('pause', function() { player.on('pause', function() {
playBT.style.removeProperty('display');
const videoDiv = player.children_[0]; const videoDiv = player.children_[0];
const controlBar = document.getElementsByClassName('vjs-control-bar')[0]; const controlBar = document.getElementsByClassName('vjs-control-bar')[0];

8
ui/component/viewers/videoViewer/view.jsx
View file

@ -245,17 +245,17 @@ function VideoViewer(props: Props) {
console.log(error); console.log(error);
console.log('promise error'); console.log('promise error');
if (typeof error === 'object' && error.name && error.name === 'NotAllowedError') { if (typeof error === 'object' && error.name && error.name === 'NotAllowedError') {
console.log('running here!') console.log('running here!');
if (player.autoplay() && !player.muted()) { if (player.autoplay() && !player.muted()) {
document.getElementsByClassName('video-js--tap-to-unmute')[0].style.visibility = 'visible'; document.getElementsByClassName('video-js--tap-to-unmute')[0].style.visibility = 'visible';
player.muted(true); player.muted(true);
// another version had player.play() // another version had player.play()
player.play() player.play();
} }
} else { } else {
console.log('other block conditional'); console.log('other block conditional');
player.muted(true); player.muted(true);
player.play() player.play();
document.getElementsByClassName('video-js--tap-to-unmute')[0].style.visibility = 'visible'; document.getElementsByClassName('video-js--tap-to-unmute')[0].style.visibility = 'visible';
} }
setIsLoading(false); setIsLoading(false);
@ -321,7 +321,7 @@ function VideoViewer(props: Props) {
{isEndededEmbed && <FileViewerEmbeddedEnded uri={uri} />} {isEndededEmbed && <FileViewerEmbeddedEnded uri={uri} />}
{embedded && !isEndededEmbed && <FileViewerEmbeddedTitle uri={uri} />} {embedded && !isEndededEmbed && <FileViewerEmbeddedTitle uri={uri} />}
{/* disable this loading behavior because it breaks when player.play() promise hangs */} {/* disable this loading behavior because it breaks when player.play() promise hangs */}
{/*{isLoading && <LoadingScreen status={__('Loading')} />}*/} {/* {isLoading && <LoadingScreen status={__('Loading')} />} */}
{!isFetchingAd && adUrl && ( {!isFetchingAd && adUrl && (
<> <>