better web streaming wip

This commit is contained in:
Sean Yesmunt 2019-03-13 01:59:07 -04:00
parent 0b9f9e2659
commit 17f922cb6d
13 changed files with 56 additions and 34 deletions

View file

@ -58,8 +58,8 @@
"hast-util-sanitize": "^1.1.2",
"keytar": "^4.3.0",
"lbry-format": "https://github.com/lbryio/lbry-format.git",
"lbry-redux": "lbryio/lbry-redux#71dda665759ead555fef0bccef3a0ae653cb4509",
"lbryinc": "lbryio/lbryinc#b54e90f3d497f0d91b3bb94dab063f0696775169",
"lbry-redux": "lbryio/lbry-redux#f140db38dd73cead9e87549340fa9434da62ba8a",
"lbryinc": "lbryio/lbryinc#636f014f421827ab6b74caf334c364a362a1a099",
"localforage": "^1.7.1",
"mammoth": "^1.4.6",
"mime": "^2.3.1",
@ -117,6 +117,7 @@
"decompress": "^4.2.0",
"del": "^3.0.0",
"devtron": "^1.4.0",
"duplicate-package-checker-webpack-plugin": "^3.0.0",
"electron": "^4.0.4",
"electron-builder": "^20.38.4",
"electron-devtools-installer": "^2.2.3",

View file

@ -61,6 +61,7 @@ if (isDev) {
app.on('ready', async () => {
let isDaemonRunning = false;
console.log('???');
await Lbry.status()
.then(() => {
isDaemonRunning = true;

View file

@ -93,7 +93,7 @@ class FileRender extends React.PureComponent<Props> {
}
renderViewer() {
const { source, mediaType, currentTheme, poster } = this.props;
const { source, mediaType, currentTheme, poster, claim } = this.props;
// Extract relevant data to render file
const { stream, fileType, contentType, downloadPath, fileName } = source;
@ -122,12 +122,19 @@ class FileRender extends React.PureComponent<Props> {
),
video: (
<AudioVideoViewer
claim={claim}
source={{ downloadPath, fileName }}
contentType={contentType}
poster={poster}
/>
),
audio: <AudioVideoViewer source={{ downloadPath, fileName }} contentType={contentType} />,
audio: (
<AudioVideoViewer
claim={claim}
source={{ downloadPath, fileName }}
contentType={contentType}
/>
),
// Add routes to viewer...
};

View file

@ -320,7 +320,7 @@ class MediaPlayer extends React.PureComponent<Props, State> {
}
render() {
const { mediaType } = this.props;
const { mediaType, claim } = this.props;
const { fileSource } = this.state;
const isFileType = this.isSupportedFile();
@ -331,7 +331,7 @@ class MediaPlayer extends React.PureComponent<Props, State> {
return (
<React.Fragment>
{loadingStatus && <LoadingScreen status={loadingStatus} spinner={isLoading} />}
{isFileReady && <FileRender source={fileSource} mediaType={mediaType} />}
{isFileReady && <FileRender claim={claim} source={fileSource} mediaType={mediaType} />}
<div
className="content__view--container"
style={{ opacity: isLoading ? 0 : 1 }}

View file

@ -152,6 +152,7 @@ class FileViewer extends React.PureComponent<Props> {
playContent() {
const { play, uri, fileInfo, isDownloading, isLoading } = this.props;
// @if TARGET='app'
if (fileInfo || isDownloading || isLoading) {
// User may have pressed download before clicking play
this.onFileStartCb = null;
@ -160,6 +161,7 @@ class FileViewer extends React.PureComponent<Props> {
if (this.onFileStartCb) {
this.startTime = Date.now();
}
// @endif
play(uri);
}

View file

@ -92,6 +92,7 @@ export default class SplashScreen extends React.PureComponent<Props, State> {
}
updateStatus() {
console.log('updateStatus??');
Lbry.status().then(status => {
this.updateStatusCallback(status);
});

View file

@ -18,7 +18,7 @@ class AudioVideoViewer extends React.PureComponent<Props> {
player: ?{ dispose: () => void };
componentDidMount() {
const { source, contentType, poster } = this.props;
const { source, contentType, poster, claim } = this.props;
const { downloadPath, fileName } = source;
const indexOfFileName = downloadPath.indexOf(fileName);
@ -27,8 +27,9 @@ class AudioVideoViewer extends React.PureComponent<Props> {
// We only want to encode the fileName so forward slashes "/" are handled properly by the file system
// TODO: Determine changes needed for windows
const path = `${basePath}${encodedFileName}`;
// const path = `${basePath}${encodedFileName}`;
const path = `https://api.lbry.tv/content/claims/${claim.name}/${claim.claim_id}/stream.mp4`;
console.log('path', path);
const sources = [
{
src: path,

View file

@ -1,7 +1,6 @@
import ErrorBoundary from 'component/errorBoundary';
import App from 'component/app';
import SnackBar from 'component/snackBar';
import SplashScreen from 'component/splash';
// @if TARGET='app'
import moment from 'moment';
import { ipcRenderer, remote, shell } from 'electron';
@ -22,6 +21,7 @@ import { Lbry, doToast, isURIValid, setSearchApi } from 'lbry-redux';
import { doNavigate, doHistoryBack, doHistoryForward } from 'redux/actions/navigation';
import { doDownloadLanguages, doUpdateIsNightAsync } from 'redux/actions/settings';
import { doAuthenticate, Lbryio, rewards, doBlackListedOutpointsSubscribe } from 'lbryinc';
import SplashScreen from 'component/splash';
import 'scss/all.scss';
import store from 'store';
import pjson from 'package.json';
@ -56,6 +56,7 @@ ipcRenderer.on('navigate-forward', () => {
// @if TARGET='web'
const SDK_API_URL = process.env.SDK_API_URL || 'https://api.lbry.tv/api/proxy';
console.log('set it??', SDK_API_URL);
Lbry.setDaemonConnectionString(SDK_API_URL);
// @endif
@ -63,6 +64,7 @@ Lbry.setDaemonConnectionString(SDK_API_URL);
// We interect with ipcRenderer to get the auth key from a users keyring
// We keep a local variable for authToken beacuse `ipcRenderer.send` does not
// contain a response, so there is no way to know when it's been set
// @if TARGET='app'
let authToken;
Lbryio.setOverride(
'setAuthToken',
@ -110,6 +112,7 @@ Lbryio.setOverride(
}
})
);
// @endif
rewards.setCallback('claimFirstRewardSuccess', () => {
app.store.dispatch(doOpenModal(MODALS.FIRST_REWARD));
@ -247,10 +250,11 @@ const init = () => {
document.getElementById('app')
);
// @if TARGET='web'
// window.sessionStorage.removeItem('loaded');
window.sessionStorage.removeItem('loaded');
// @endif
}
console.log('???', window.sessionStorage.getItem('loaded'));
if (window.sessionStorage.getItem('loaded') === 'y') {
onDaemonReady();
} else {

View file

@ -42,7 +42,7 @@ class ShowPage extends React.PureComponent<Props> {
let innerContent = '';
if (isResolvingUri || !claim || !claim.name) {
if (!claim || (claim && !claim.name)) {
if (claim && !claim.name) {
// While testing the normalization changes, Brannon found that `name` was missing sometimes
// This shouldn't happen, so hopefully this helps track it down

View file

@ -9,7 +9,6 @@ import { doOpenModal } from 'redux/actions/app';
import { doNavigate } from 'redux/actions/navigation';
import { setSubscriptionLatest, doUpdateUnreadSubscriptions } from 'redux/actions/subscriptions';
import { makeSelectUnreadByChannel } from 'redux/selectors/subscriptions';
import { selectBadgeNumber } from 'redux/selectors/app';
import {
ACTIONS,
SETTINGS,
@ -28,12 +27,15 @@ import {
import { makeSelectCostInfoForUri } from 'lbryinc';
import { makeSelectClientSetting, selectosNotificationsEnabled } from 'redux/selectors/settings';
import setBadge from 'util/set-badge';
import analytics from 'analytics';
const DOWNLOAD_POLL_INTERVAL = 250;
export function doUpdateLoadStatus(uri: string, outpoint: string) {
// Updates the loading status for a uri as it's downloading
// Calls file_list and checks the written_bytes value to see if the number has increased
// Not needed on web as users aren't actually downloading the file
// @if TARGET='app'
return (dispatch, getState) => {
const setNextStatusUpdate = () =>
setTimeout(() => {
@ -44,6 +46,7 @@ export function doUpdateLoadStatus(uri: string, outpoint: string) {
dispatch(doUpdateLoadStatus(uri, outpoint));
}
}, DOWNLOAD_POLL_INTERVAL);
Lbry.file_list({
outpoint,
full_status: true,
@ -64,14 +67,6 @@ export function doUpdateLoadStatus(uri: string, outpoint: string) {
},
});
const badgeNumber = selectBadgeNumber(state);
setBadge(badgeNumber === 0 ? '' : `${badgeNumber}`);
// Disabling this for now because it's confusing for new users that don't realize files are actually being downloaded
// This should move inside of the app
// const totalProgress = selectTotalDownloadProgress(state);
// setProgressBar(totalProgress);
const channelUri = makeSelectChannelForClaimUri(uri, true)(state);
const { claimName: channelName } = parseURI(channelUri);
@ -126,12 +121,11 @@ export function doUpdateLoadStatus(uri: string, outpoint: string) {
},
});
// const totalProgress = selectTotalDownloadProgress(getState());
// setProgressBar(totalProgress);
setNextStatusUpdate();
}
});
};
// @endif
}
export function doStartDownload(uri, outpoint) {

View file

@ -2,6 +2,7 @@
<html>
<head>
<meta charset="utf-8" />
<title>lbry.tv</title>
</head>
<body>

View file

@ -2,6 +2,7 @@ const path = require('path');
const merge = require('webpack-merge');
const { DefinePlugin, ProvidePlugin } = require('webpack');
const { getIfUtils, removeEmpty } = require('webpack-config-utils');
var DuplicatePackageCheckerPlugin = require('duplicate-package-checker-webpack-plugin');
const NODE_ENV = process.env.NODE_ENV || 'development';
@ -25,7 +26,7 @@ const baseConfig = {
loader: 'babel-loader',
},
{
test: /\.scss$/,
test: /\.s?css$/,
use: [
'style-loader', // creates style nodes from JS strings
'css-loader', // translates CSS into CommonJS
@ -43,9 +44,7 @@ const baseConfig = {
},
},
{
// font/inter includes a basic css file applying the fonts
// Everywhere else we use .scss
test: /\.(css|woff|woff2)$/,
test: /\.(woff|woff2)$/,
use: {
loader: 'file-loader',
options: {
@ -82,6 +81,7 @@ const baseConfig = {
'process.env.SDK_API_URL': JSON.stringify(process.env.SDK_API_URL),
'process.env.LBRY_API_URL': JSON.stringify(process.env.LBRY_API_URL),
}),
// new DuplicatePackageCheckerPlugin(),
],
};

View file

@ -2096,7 +2096,7 @@ chalk@^1.0.0, chalk@^1.1.1, chalk@^1.1.3:
strip-ansi "^3.0.0"
supports-color "^2.0.0"
chalk@^2.0.0, chalk@^2.0.1, chalk@^2.1.0, chalk@^2.3.1, chalk@^2.4.1, chalk@^2.4.2:
chalk@^2.0.0, chalk@^2.0.1, chalk@^2.1.0, chalk@^2.3.0, chalk@^2.3.1, chalk@^2.4.1, chalk@^2.4.2:
version "2.4.2"
resolved "https://registry.yarnpkg.com/chalk/-/chalk-2.4.2.tgz#cd42541677a54333cf541a49108c1432b44c9424"
integrity sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==
@ -3308,6 +3308,16 @@ duplexify@^3.4.2, duplexify@^3.6.0:
readable-stream "^2.0.0"
stream-shift "^1.0.0"
duplicate-package-checker-webpack-plugin@^3.0.0:
version "3.0.0"
resolved "https://registry.yarnpkg.com/duplicate-package-checker-webpack-plugin/-/duplicate-package-checker-webpack-plugin-3.0.0.tgz#78bb89e625fa7cf8c2a59c53f62b495fda9ba287"
integrity sha512-aO50/qPC7X2ChjRFniRiscxBLT/K01bALqfcDaf8Ih5OqQ1N4iT/Abx9Ofu3/ms446vHTm46FACIuJUmgUQcDQ==
dependencies:
chalk "^2.3.0"
find-root "^1.0.0"
lodash "^4.17.4"
semver "^5.4.1"
easymde@^2.5.1:
version "2.5.1"
resolved "https://registry.yarnpkg.com/easymde/-/easymde-2.5.1.tgz#00144baf96d52debb2043cb0da8c1b7a3d1ad86f"
@ -4287,7 +4297,7 @@ find-parent-dir@^0.3.0:
resolved "https://registry.yarnpkg.com/find-parent-dir/-/find-parent-dir-0.3.0.tgz#33c44b429ab2b2f0646299c5f9f718f376ff8d54"
integrity sha1-M8RLQpqysvBkYpnF+fcY83b/jVQ=
find-root@^1.1.0:
find-root@^1.0.0, find-root@^1.1.0:
version "1.1.0"
resolved "https://registry.yarnpkg.com/find-root/-/find-root-1.1.0.tgz#abcfc8ba76f708c42a97b3d685b7e9450bfb9ce4"
integrity sha512-NKfW6bec6GfKc0SGx1e07QZY9PE99u0Bft/0rzSD5k3sO/vwkVUpDUKVm5Gpp5Ue3YfShPFTX2070tDs5kB9Ng==
@ -5962,17 +5972,17 @@ lazy-val@^1.0.3, lazy-val@^1.0.4:
tar-stream "^1.6.2"
zstd-codec "^0.1.1"
lbry-redux@lbryio/lbry-redux#71dda665759ead555fef0bccef3a0ae653cb4509:
lbry-redux@lbryio/lbry-redux#f140db38dd73cead9e87549340fa9434da62ba8a:
version "0.0.1"
resolved "https://codeload.github.com/lbryio/lbry-redux/tar.gz/71dda665759ead555fef0bccef3a0ae653cb4509"
resolved "https://codeload.github.com/lbryio/lbry-redux/tar.gz/f140db38dd73cead9e87549340fa9434da62ba8a"
dependencies:
proxy-polyfill "0.1.6"
reselect "^3.0.0"
uuid "^3.3.2"
lbryinc@lbryio/lbryinc#b54e90f3d497f0d91b3bb94dab063f0696775169:
lbryinc@lbryio/lbryinc#636f014f421827ab6b74caf334c364a362a1a099:
version "0.0.1"
resolved "https://codeload.github.com/lbryio/lbryinc/tar.gz/b54e90f3d497f0d91b3bb94dab063f0696775169"
resolved "https://codeload.github.com/lbryio/lbryinc/tar.gz/636f014f421827ab6b74caf334c364a362a1a099"
dependencies:
bluebird "^3.5.1"
reselect "^3.0.0"