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

all code working with some flow fixes needed

Browse source
This commit is contained in:
Anthony 2021-11-09 22:51:59 +01:00
parent c6e6bd55e1
commit 57ca238f2d
No known key found for this signature in database
GPG key ID: C386D3C93D50E356
6 changed files with 72 additions and 76 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
ui/analytics.js
View file

@ -480,7 +480,7 @@ function sendPromMetric(name: string, value?: number) {
let url = new URL(SDK_API_PATH + '/metric/ui');
const params = { name: name, value: value ? value.toString() : '' };
url.search = new URLSearchParams(params).toString();
return fetch(url, { method: 'post' }).catch(function(error){});
return fetch(url, { method: 'post' }).catch(function(error) {});
}
}

39
ui/component/viewers/videoViewer/internal/ads.js
View file

@ -18,24 +18,24 @@ const adTags = {
};
// Modified to work with IMA
const vastMacroUrl =
`https://vast.aniview.com/api/adserver61/vast/` +
`?AV_PUBLISHERID=60afcbc58cfdb065440d2426` +
`&AV_CHANNELID=${adTags.ford}` +
`&AV_URL=[URL]` +
`&cb=[CACHEBUSTING]` +
`&AV_WIDTH=[WIDTH]` +
`&AV_HEIGHT=[HEIGHT]` +
// `&AV_SCHAIN=[SCHAIN_MACRO]` +
// `&AV_CCPA=[CCPA_MACRO]` +
// `&AV_GDPR=[GDPR_MACRO]` +
// `&AV_CONSENT=[CONSENT_MACRO]` +
`&skip=true` +
`&skiptimer=5` +
`&logo=true` +
`&usevslot=true` +
`&vastretry=2` +
`&hidecontrols=false`;
// const vastMacroUrl =
// `https://vast.aniview.com/api/adserver61/vast/` +
// `?AV_PUBLISHERID=60afcbc58cfdb065440d2426` +
// `&AV_CHANNELID=${adTags.ford}` +
// `&AV_URL=[URL]` +
// `&cb=[CACHEBUSTING]` +
// `&AV_WIDTH=[WIDTH]` +
// `&AV_HEIGHT=[HEIGHT]` +
// // `&AV_SCHAIN=[SCHAIN_MACRO]` +
// // `&AV_CCPA=[CCPA_MACRO]` +
// // `&AV_GDPR=[GDPR_MACRO]` +
// // `&AV_CONSENT=[CONSENT_MACRO]` +
// `&skip=true` +
// `&skiptimer=5` +
// `&logo=true` +
// `&usevslot=true` +
// `&vastretry=2` +
// `&hidecontrols=false`;
// only run on chrome (brave included) and don't run on mobile for time being
const browserIsChrome = videojs.browser.IS_CHROME;
@ -52,7 +52,6 @@ const hitsAtFiftyPercentChance = hitsFiftyPercent();
* @param player
*/
function runAds(internalFeatureEnabled, allowPreRoll, player) {
// current timestamp for vpaid
const timestamp = new Date().toISOString();
@ -89,7 +88,7 @@ function runAds(internalFeatureEnabled, allowPreRoll, player) {
if (shouldShowAnAd && browserIsChrome && !IS_MOBILE) {
// fire up ima integration via module
player.ima({
adTagUrl: vastMacroUrl,
adTagUrl: vpaidMacroUrl,
vpaidMode: 2, // 2 maps to insecure
});
}

86
ui/component/viewers/videoViewer/internal/videojs-events.jsx
View file

@ -17,8 +17,7 @@ const setLabel = (controlBar, childName, label) => {
};
export default ({ tapToUnmuteRef, tapToRetryRef, setReload, videoTheaterMode,
playerRef, autoplaySetting, player}) => {
playerRef, autoplaySetting, replay}) => {
// Override the player's control text. We override to:
// 1. Add keyboard shortcut to the tool-tip.
// 2. Override videojs' i18n and use our own (don't want to have 2 systems).
@ -113,15 +112,15 @@ export default ({ tapToUnmuteRef, tapToRetryRef, setReload, videoTheaterMode,
// }
// }, [adUrl]);
// useEffect(() => {
// const player = playerRef.current;
// if (player) {
// const controlBar = player.getChild('controlBar');
// controlBar
// .getChild('TheaterModeButton')
// .controlText(videoTheaterMode ? __('Default Mode (t)') : __('Theater Mode (t)'));
// }
// }, [videoTheaterMode]);
useEffect(() => {
const player = playerRef.current;
if (player) {
const controlBar = player.getChild('controlBar');
controlBar
.getChild('TheaterModeButton')
.controlText(videoTheaterMode ? __('Default Mode (t)') : __('Theater Mode (t)'));
}
}, [videoTheaterMode]);
// when user clicks 'Unmute' button, turn audio on and hide unmute button
function unmuteAndHideHint() {
@ -173,38 +172,47 @@ export default ({ tapToUnmuteRef, tapToRetryRef, setReload, videoTheaterMode,
}
}
// useEffect(() => {
// console.log('RUNNING HERE!')
//
// const player = playerRef.current;
// if (player) {
// const touchOverlay = player.getChild('TouchOverlay');
// const controlBar = player.getChild('controlBar') || touchOverlay.getChild('controlBar');
// const autoplayButton = controlBar.getChild('AutoplayNextButton');
//
// if (autoplayButton) {
// const title = autoplaySetting ? __('Autoplay Next On') : __('Autoplay Next Off');
//
// autoplayButton.controlText(title);
// autoplayButton.setAttribute('aria-label', title);
// autoplayButton.setAttribute('aria-checked', autoplaySetting);
// }
// }
// }, [autoplaySetting]);
useEffect(() => {
const player = playerRef.current;
if (player) {
const touchOverlay = player.getChild('TouchOverlay');
const controlBar = player.getChild('controlBar') || touchOverlay.getChild('controlBar');
const autoplayButton = controlBar.getChild('AutoplayNextButton');
// Add various event listeners to player
player.one('play', onInitialPlay);
player.on('play', resolveCtrlText);
player.on('pause', resolveCtrlText);
player.on('loadstart', resolveCtrlText);
player.on('fullscreenchange', resolveCtrlText);
player.on('volumechange', resolveCtrlText);
player.on('volumechange', onVolumeChange);
player.on('error', onError);
// player.on('ended', onEnded);
if (autoplayButton) {
const title = autoplaySetting ? __('Autoplay Next On') : __('Autoplay Next Off');
autoplayButton.controlText(title);
autoplayButton.setAttribute('aria-label', title);
autoplayButton.setAttribute('aria-checked', autoplaySetting);
}
}
}, [autoplaySetting]);
useEffect(() => {
const player = playerRef.current;
if (replay && player) {
player.play();
}
}, [replay]);
function initializeEvents() {
const player = playerRef.current;
// Add various event listeners to player
player.one('play', onInitialPlay);
player.on('play', resolveCtrlText);
player.on('pause', resolveCtrlText);
player.on('loadstart', resolveCtrlText);
player.on('fullscreenchange', resolveCtrlText);
player.on('volumechange', resolveCtrlText);
player.on('volumechange', onVolumeChange);
player.on('error', onError);
// player.on('ended', onEnded);
}
return {
retryVideoAfterFailure,
unmuteAndHideHint,
initializeEvents,
};
};

1
ui/component/viewers/videoViewer/internal/videojs-functions.jsx
View file

@ -1,6 +1,5 @@
// @flow
export default ({ source, sourceType, videoJsOptions, isAudio }) => {
function detectFileType() {
return new Promise(async (res, rej) => {
try {

2
ui/component/viewers/videoViewer/internal/videojs-keyboard-shortcuts.jsx
View file

@ -1,3 +1,4 @@
// @flow
import * as OVERLAY from './overlays';
import * as KEYCODES from 'constants/keycodes';
import isUserTyping from 'util/detect-typing';
@ -121,7 +122,6 @@ export default ({ playNext, playPrevious, toggleVideoTheaterMode }) => {
// eslint-disable-next-line flowtype/no-types-missing-file-annotation
function handleSingleKeyActions(e: KeyboardEvent, playerRef, containerRef) {
if (e.altKey || e.ctrlKey || e.metaKey || e.shiftKey) return;
if (e.keyCode === KEYCODES.SPACEBAR || e.keyCode === KEYCODES.K) togglePlay(containerRef);
if (e.keyCode === KEYCODES.F) toggleFullscreen(playerRef);

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

@ -123,7 +123,7 @@ export default React.memo<Props>(function VideoJs(props: Props) {
isAudio,
onPlayerReady,
toggleVideoTheaterMode,
adUrl, // TODO: this ad functionality isn't used, can be pulled out
// adUrl, // TODO: this ad functionality isn't used, can be pulled out
claimId,
userId,
allowPreRoll,
@ -171,7 +171,8 @@ export default React.memo<Props>(function VideoJs(props: Props) {
const { detectFileType, createVideoPlayerDOM } = functions({ source, sourceType, videoJsOptions, isAudio });
let unmuteAndHideHint, retryVideoAfterFailure;
const { unmuteAndHideHint, retryVideoAfterFailure, initializeEvents } = events({ tapToUnmuteRef, tapToRetryRef, setReload, videoTheaterMode, playerRef, autoplaySetting, replay });
// Initialize video.js
function initializeVideoPlayer(el) {
if (!el) return;
@ -184,10 +185,7 @@ export default React.memo<Props>(function VideoJs(props: Props) {
runAds(internalFeatureEnabled, allowPreRoll, player);
const videoJsEvents = events({ tapToUnmuteRef, tapToRetryRef, setReload, videoTheaterMode, playerRef, autoplaySetting, player });
unmuteAndHideHint = videoJsEvents.unmuteAndHideHint;
retryVideoAfterFailure = videoJsEvents.retryVideoAfterFailure;
initializeEvents();
// Replace volume bar with custom LBRY volume bar
LbryVolumeBarClass.replaceExisting(player);
@ -228,14 +226,6 @@ export default React.memo<Props>(function VideoJs(props: Props) {
return vjs;
}
// todo: what does this do exactly?
useEffect(() => {
const player = playerRef.current;
if (replay && player) {
player.play();
}
}, [replay]);
/** instantiate videoJS and dispose of it when done with code **/
// This lifecycle hook is only called once (on mount), or when `isAudio` or `source` changes.
useEffect(() => {