remove media.paused; catch file open pause from change of content.playingUri
This commit is contained in:
parent
f1a799374a
commit
82252e6985
12 changed files with 17 additions and 88 deletions
|
@ -7,8 +7,7 @@ import {
|
||||||
makeSelectClaimForUri,
|
makeSelectClaimForUri,
|
||||||
} from 'lbry-redux';
|
} from 'lbry-redux';
|
||||||
import { doOpenFileInShell } from 'redux/actions/file';
|
import { doOpenFileInShell } from 'redux/actions/file';
|
||||||
import { doPurchaseUri, doStartDownload } from 'redux/actions/content';
|
import { doPurchaseUri, doStartDownload, doSetPlayingUri } from 'redux/actions/content';
|
||||||
import { doPause } from 'redux/actions/media';
|
|
||||||
import FileDownloadLink from './view';
|
import FileDownloadLink from './view';
|
||||||
|
|
||||||
const select = (state, props) => ({
|
const select = (state, props) => ({
|
||||||
|
@ -24,7 +23,7 @@ const perform = dispatch => ({
|
||||||
openInShell: path => dispatch(doOpenFileInShell(path)),
|
openInShell: path => dispatch(doOpenFileInShell(path)),
|
||||||
purchaseUri: uri => dispatch(doPurchaseUri(uri)),
|
purchaseUri: uri => dispatch(doPurchaseUri(uri)),
|
||||||
restartDownload: (uri, outpoint) => dispatch(doStartDownload(uri, outpoint)),
|
restartDownload: (uri, outpoint) => dispatch(doStartDownload(uri, outpoint)),
|
||||||
doPause: () => dispatch(doPause()),
|
pause: () => dispatch(doSetPlayingUri(null)),
|
||||||
});
|
});
|
||||||
|
|
||||||
export default connect(
|
export default connect(
|
||||||
|
|
|
@ -22,7 +22,7 @@ type Props = {
|
||||||
restartDownload: (string, number) => void,
|
restartDownload: (string, number) => void,
|
||||||
openInShell: string => void,
|
openInShell: string => void,
|
||||||
purchaseUri: string => void,
|
purchaseUri: string => void,
|
||||||
doPause: () => void,
|
pause: () => void,
|
||||||
};
|
};
|
||||||
|
|
||||||
class FileDownloadLink extends React.PureComponent<Props> {
|
class FileDownloadLink extends React.PureComponent<Props> {
|
||||||
|
@ -50,14 +50,13 @@ class FileDownloadLink extends React.PureComponent<Props> {
|
||||||
purchaseUri,
|
purchaseUri,
|
||||||
costInfo,
|
costInfo,
|
||||||
loading,
|
loading,
|
||||||
doPause,
|
pause,
|
||||||
claim,
|
|
||||||
} = this.props;
|
} = this.props;
|
||||||
|
|
||||||
const openFile = () => {
|
const openFile = () => {
|
||||||
if (fileInfo) {
|
if (fileInfo) {
|
||||||
openInShell(fileInfo.download_path);
|
openInShell(fileInfo.download_path);
|
||||||
doPause();
|
pause();
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
|
@ -3,7 +3,6 @@ import * as settings from 'constants/settings';
|
||||||
import { doChangeVolume } from 'redux/actions/app';
|
import { doChangeVolume } from 'redux/actions/app';
|
||||||
import { selectVolume } from 'redux/selectors/app';
|
import { selectVolume } from 'redux/selectors/app';
|
||||||
import { doPlayUri, doSetPlayingUri, savePosition } from 'redux/actions/content';
|
import { doPlayUri, doSetPlayingUri, savePosition } from 'redux/actions/content';
|
||||||
import { doPlay, doPause } from 'redux/actions/media';
|
|
||||||
import {
|
import {
|
||||||
makeSelectMetadataForUri,
|
makeSelectMetadataForUri,
|
||||||
makeSelectContentTypeForUri,
|
makeSelectContentTypeForUri,
|
||||||
|
@ -15,7 +14,6 @@ import {
|
||||||
selectSearchBarFocused,
|
selectSearchBarFocused,
|
||||||
} from 'lbry-redux';
|
} from 'lbry-redux';
|
||||||
import { makeSelectClientSetting, selectShowNsfw } from 'redux/selectors/settings';
|
import { makeSelectClientSetting, selectShowNsfw } from 'redux/selectors/settings';
|
||||||
import { selectMediaPaused } from 'redux/selectors/media';
|
|
||||||
import { selectPlayingUri, makeSelectContentPositionForUri } from 'redux/selectors/content';
|
import { selectPlayingUri, makeSelectContentPositionForUri } from 'redux/selectors/content';
|
||||||
import { selectFileInfoErrors } from 'redux/selectors/file_info';
|
import { selectFileInfoErrors } from 'redux/selectors/file_info';
|
||||||
import FileViewer from './view';
|
import FileViewer from './view';
|
||||||
|
@ -31,7 +29,6 @@ const select = (state, props) => ({
|
||||||
playingUri: selectPlayingUri(state),
|
playingUri: selectPlayingUri(state),
|
||||||
contentType: makeSelectContentTypeForUri(props.uri)(state),
|
contentType: makeSelectContentTypeForUri(props.uri)(state),
|
||||||
volume: selectVolume(state),
|
volume: selectVolume(state),
|
||||||
mediaPaused: selectMediaPaused(state),
|
|
||||||
playbackPosition: makeSelectContentPositionForUri(props.uri)(state),
|
playbackPosition: makeSelectContentPositionForUri(props.uri)(state),
|
||||||
autoplay: makeSelectClientSetting(settings.AUTOPLAY)(state),
|
autoplay: makeSelectClientSetting(settings.AUTOPLAY)(state),
|
||||||
searchBarFocused: selectSearchBarFocused(state),
|
searchBarFocused: selectSearchBarFocused(state),
|
||||||
|
@ -42,8 +39,6 @@ const perform = dispatch => ({
|
||||||
play: uri => dispatch(doPlayUri(uri)),
|
play: uri => dispatch(doPlayUri(uri)),
|
||||||
cancelPlay: () => dispatch(doSetPlayingUri(null)),
|
cancelPlay: () => dispatch(doSetPlayingUri(null)),
|
||||||
changeVolume: volume => dispatch(doChangeVolume(volume)),
|
changeVolume: volume => dispatch(doChangeVolume(volume)),
|
||||||
doPlay: () => dispatch(doPlay()),
|
|
||||||
doPause: () => dispatch(doPause()),
|
|
||||||
savePosition: (claimId, outpoint, position) =>
|
savePosition: (claimId, outpoint, position) =>
|
||||||
dispatch(savePosition(claimId, outpoint, position)),
|
dispatch(savePosition(claimId, outpoint, position)),
|
||||||
});
|
});
|
||||||
|
|
|
@ -27,9 +27,11 @@ class MediaPlayer extends React.PureComponent {
|
||||||
this.toggleFullScreenVideo = this.toggleFullScreen.bind(this);
|
this.toggleFullScreenVideo = this.toggleFullScreen.bind(this);
|
||||||
}
|
}
|
||||||
|
|
||||||
componentWillReceiveProps(nextProps) {
|
componentDidUpdate(nextProps) {
|
||||||
const el = this.refs.media.children[0];
|
const el = this.refs.media.children[0];
|
||||||
if (!this.props.paused && nextProps.paused && !el.paused) el.pause();
|
if (this.props.playingUri && !nextProps.playingUri && !el.paused) {
|
||||||
|
el.pause();
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
componentDidMount() {
|
componentDidMount() {
|
||||||
|
@ -87,8 +89,6 @@ class MediaPlayer extends React.PureComponent {
|
||||||
const mediaElement = this.media.children[0];
|
const mediaElement = this.media.children[0];
|
||||||
if (mediaElement) {
|
if (mediaElement) {
|
||||||
mediaElement.currentTime = position || 0;
|
mediaElement.currentTime = position || 0;
|
||||||
mediaElement.addEventListener('play', () => this.props.doPlay());
|
|
||||||
mediaElement.addEventListener('pause', () => this.props.doPause());
|
|
||||||
mediaElement.addEventListener('timeupdate', () =>
|
mediaElement.addEventListener('timeupdate', () =>
|
||||||
this.props.savePosition(
|
this.props.savePosition(
|
||||||
claim.claim_id,
|
claim.claim_id,
|
||||||
|
@ -140,7 +140,6 @@ class MediaPlayer extends React.PureComponent {
|
||||||
if (mediaElement) {
|
if (mediaElement) {
|
||||||
mediaElement.removeEventListener('click', this.togglePlayListener);
|
mediaElement.removeEventListener('click', this.togglePlayListener);
|
||||||
}
|
}
|
||||||
this.props.doPause();
|
|
||||||
}
|
}
|
||||||
|
|
||||||
toggleFullScreen(event) {
|
toggleFullScreen(event) {
|
||||||
|
|
|
@ -34,10 +34,7 @@ type Props = {
|
||||||
volume: number,
|
volume: number,
|
||||||
claim: Claim,
|
claim: Claim,
|
||||||
uri: string,
|
uri: string,
|
||||||
doPlay: () => void,
|
|
||||||
doPause: () => void,
|
|
||||||
savePosition: (string, string, number) => void,
|
savePosition: (string, string, number) => void,
|
||||||
mediaPaused: boolean,
|
|
||||||
playbackPosition: ?number,
|
playbackPosition: ?number,
|
||||||
className: ?string,
|
className: ?string,
|
||||||
obscureNsfw: boolean,
|
obscureNsfw: boolean,
|
||||||
|
@ -202,10 +199,7 @@ class FileViewer extends React.PureComponent<Props> {
|
||||||
volume,
|
volume,
|
||||||
claim,
|
claim,
|
||||||
uri,
|
uri,
|
||||||
doPlay,
|
|
||||||
doPause,
|
|
||||||
savePosition,
|
savePosition,
|
||||||
mediaPaused,
|
|
||||||
playbackPosition,
|
playbackPosition,
|
||||||
className,
|
className,
|
||||||
obscureNsfw,
|
obscureNsfw,
|
||||||
|
@ -237,6 +231,7 @@ class FileViewer extends React.PureComponent<Props> {
|
||||||
<div className={classnames('video', {}, className)}>
|
<div className={classnames('video', {}, className)}>
|
||||||
{isPlaying && (
|
{isPlaying && (
|
||||||
<div className="content__view">
|
<div className="content__view">
|
||||||
|
<p>hai</p>
|
||||||
{!isReadyToPlay ? (
|
{!isReadyToPlay ? (
|
||||||
<div className={layoverClass} style={layoverStyle}>
|
<div className={layoverClass} style={layoverStyle}>
|
||||||
<LoadingScreen status={loadStatusMessage} />
|
<LoadingScreen status={loadStatusMessage} />
|
||||||
|
@ -251,13 +246,11 @@ class FileViewer extends React.PureComponent<Props> {
|
||||||
downloadCompleted={fileInfo.completed}
|
downloadCompleted={fileInfo.completed}
|
||||||
changeVolume={changeVolume}
|
changeVolume={changeVolume}
|
||||||
volume={volume}
|
volume={volume}
|
||||||
doPlay={doPlay}
|
|
||||||
doPause={doPause}
|
|
||||||
savePosition={savePosition}
|
savePosition={savePosition}
|
||||||
claim={claim}
|
claim={claim}
|
||||||
uri={uri}
|
uri={uri}
|
||||||
paused={mediaPaused}
|
|
||||||
position={playbackPosition}
|
position={playbackPosition}
|
||||||
|
playingUri={playingUri}
|
||||||
/>
|
/>
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -182,13 +182,6 @@ export const FETCH_SUBSCRIPTIONS_START = 'FETCH_SUBSCRIPTIONS_START';
|
||||||
export const FETCH_SUBSCRIPTIONS_FAIL = 'FETCH_SUBSCRIPTIONS_FAIL';
|
export const FETCH_SUBSCRIPTIONS_FAIL = 'FETCH_SUBSCRIPTIONS_FAIL';
|
||||||
export const FETCH_SUBSCRIPTIONS_SUCCESS = 'FETCH_SUBSCRIPTIONS_SUCCESS';
|
export const FETCH_SUBSCRIPTIONS_SUCCESS = 'FETCH_SUBSCRIPTIONS_SUCCESS';
|
||||||
|
|
||||||
// Video controls
|
|
||||||
export const SET_VIDEO_PAUSE = 'SET_VIDEO_PAUSE';
|
|
||||||
|
|
||||||
// Media controls
|
|
||||||
export const MEDIA_PLAY = 'MEDIA_PLAY';
|
|
||||||
export const MEDIA_PAUSE = 'MEDIA_PAUSE';
|
|
||||||
|
|
||||||
// Publishing
|
// Publishing
|
||||||
export const CLEAR_PUBLISH = 'CLEAR_PUBLISH';
|
export const CLEAR_PUBLISH = 'CLEAR_PUBLISH';
|
||||||
export const UPDATE_PUBLISH_FORM = 'UPDATE_PUBLISH_FORM';
|
export const UPDATE_PUBLISH_FORM = 'UPDATE_PUBLISH_FORM';
|
||||||
|
|
|
@ -17,7 +17,6 @@ import {
|
||||||
} from 'lbry-redux';
|
} from 'lbry-redux';
|
||||||
import { selectShowNsfw, makeSelectClientSetting } from 'redux/selectors/settings';
|
import { selectShowNsfw, makeSelectClientSetting } from 'redux/selectors/settings';
|
||||||
import { selectSubscriptions } from 'redux/selectors/subscriptions';
|
import { selectSubscriptions } from 'redux/selectors/subscriptions';
|
||||||
import { selectMediaPaused } from 'redux/selectors/media';
|
|
||||||
import { doPrepareEdit } from 'redux/actions/publish';
|
import { doPrepareEdit } from 'redux/actions/publish';
|
||||||
import FilePage from './view';
|
import FilePage from './view';
|
||||||
|
|
||||||
|
@ -31,7 +30,6 @@ const select = (state, props) => ({
|
||||||
rewardedContentClaimIds: selectRewardContentClaimIds(state, props),
|
rewardedContentClaimIds: selectRewardContentClaimIds(state, props),
|
||||||
subscriptions: selectSubscriptions(state),
|
subscriptions: selectSubscriptions(state),
|
||||||
playingUri: selectPlayingUri(state),
|
playingUri: selectPlayingUri(state),
|
||||||
isPaused: selectMediaPaused(state),
|
|
||||||
claimIsMine: makeSelectClaimIsMine(props.uri)(state),
|
claimIsMine: makeSelectClaimIsMine(props.uri)(state),
|
||||||
autoplay: makeSelectClientSetting(settings.AUTOPLAY)(state),
|
autoplay: makeSelectClientSetting(settings.AUTOPLAY)(state),
|
||||||
});
|
});
|
||||||
|
@ -46,4 +44,7 @@ const perform = dispatch => ({
|
||||||
setClientSetting: (key, value) => dispatch(doSetClientSetting(key, value)),
|
setClientSetting: (key, value) => dispatch(doSetClientSetting(key, value)),
|
||||||
});
|
});
|
||||||
|
|
||||||
export default connect(select, perform)(FilePage);
|
export default connect(
|
||||||
|
select,
|
||||||
|
perform
|
||||||
|
)(FilePage);
|
||||||
|
|
|
@ -16,8 +16,8 @@ import Native from 'native';
|
||||||
import { doFetchRewardedContent } from 'redux/actions/content';
|
import { doFetchRewardedContent } from 'redux/actions/content';
|
||||||
import { doFetchDaemonSettings } from 'redux/actions/settings';
|
import { doFetchDaemonSettings } from 'redux/actions/settings';
|
||||||
import { doAuthNavigate } from 'redux/actions/navigation';
|
import { doAuthNavigate } from 'redux/actions/navigation';
|
||||||
import { doPause } from 'redux/actions/media';
|
import { doAuthenticate } from 'redux/actions/user';
|
||||||
import { doCheckSubscriptionsInit } from 'redux/actions/subscriptions';
|
import { doCheckSubscriptions } from 'redux/actions/subscriptions';
|
||||||
import {
|
import {
|
||||||
selectIsUpgradeSkipped,
|
selectIsUpgradeSkipped,
|
||||||
selectUpdateUrl,
|
selectUpdateUrl,
|
||||||
|
@ -109,9 +109,6 @@ export function doDownloadUpgradeRequested() {
|
||||||
return (dispatch, getState) => {
|
return (dispatch, getState) => {
|
||||||
const state = getState();
|
const state = getState();
|
||||||
|
|
||||||
// Pause video if needed
|
|
||||||
dispatch(doPause());
|
|
||||||
|
|
||||||
const autoUpdateDeclined = selectAutoUpdateDeclined(state);
|
const autoUpdateDeclined = selectAutoUpdateDeclined(state);
|
||||||
|
|
||||||
if (['win32', 'darwin'].includes(process.platform)) {
|
if (['win32', 'darwin'].includes(process.platform)) {
|
||||||
|
|
|
@ -1,13 +0,0 @@
|
||||||
// @flow
|
|
||||||
import * as actions from 'constants/action_types';
|
|
||||||
import type { Dispatch } from 'redux/reducers/media';
|
|
||||||
|
|
||||||
export const doPlay = () => (dispatch: Dispatch) =>
|
|
||||||
dispatch({
|
|
||||||
type: actions.MEDIA_PLAY,
|
|
||||||
});
|
|
||||||
|
|
||||||
export const doPause = () => (dispatch: Dispatch) =>
|
|
||||||
dispatch({
|
|
||||||
type: actions.MEDIA_PAUSE,
|
|
||||||
});
|
|
|
@ -1,27 +0,0 @@
|
||||||
// @flow
|
|
||||||
import * as actions from 'constants/action_types';
|
|
||||||
import { handleActions } from 'util/redux-utils';
|
|
||||||
|
|
||||||
export type MediaState = {
|
|
||||||
paused: Boolean,
|
|
||||||
};
|
|
||||||
|
|
||||||
export type Action = any;
|
|
||||||
export type Dispatch = (action: Action) => any;
|
|
||||||
|
|
||||||
const defaultState = { paused: true, positions: {} };
|
|
||||||
|
|
||||||
export default handleActions(
|
|
||||||
{
|
|
||||||
[actions.MEDIA_PLAY]: (state: MediaState, action: Action) => ({
|
|
||||||
...state,
|
|
||||||
paused: false,
|
|
||||||
}),
|
|
||||||
|
|
||||||
[actions.MEDIA_PAUSE]: (state: MediaState, action: Action) => ({
|
|
||||||
...state,
|
|
||||||
paused: true,
|
|
||||||
}),
|
|
||||||
},
|
|
||||||
defaultState
|
|
||||||
);
|
|
|
@ -1,5 +0,0 @@
|
||||||
import { createSelector } from 'reselect';
|
|
||||||
|
|
||||||
const selectState = state => state.media || {};
|
|
||||||
|
|
||||||
export const selectMediaPaused = createSelector(selectState, state => state.paused);
|
|
|
@ -17,7 +17,6 @@ import settingsReducer from 'redux/reducers/settings';
|
||||||
import userReducer from 'redux/reducers/user';
|
import userReducer from 'redux/reducers/user';
|
||||||
import shapeShiftReducer from 'redux/reducers/shape_shift';
|
import shapeShiftReducer from 'redux/reducers/shape_shift';
|
||||||
import subscriptionsReducer from 'redux/reducers/subscriptions';
|
import subscriptionsReducer from 'redux/reducers/subscriptions';
|
||||||
import mediaReducer from 'redux/reducers/media';
|
|
||||||
import publishReducer from 'redux/reducers/publish';
|
import publishReducer from 'redux/reducers/publish';
|
||||||
import { persistStore, autoRehydrate } from 'redux-persist';
|
import { persistStore, autoRehydrate } from 'redux-persist';
|
||||||
import createCompressor from 'redux-persist-transform-compress';
|
import createCompressor from 'redux-persist-transform-compress';
|
||||||
|
@ -69,7 +68,6 @@ const reducers = combineReducers({
|
||||||
user: userReducer,
|
user: userReducer,
|
||||||
shapeShift: shapeShiftReducer,
|
shapeShift: shapeShiftReducer,
|
||||||
subscriptions: subscriptionsReducer,
|
subscriptions: subscriptionsReducer,
|
||||||
media: mediaReducer,
|
|
||||||
publish: publishReducer,
|
publish: publishReducer,
|
||||||
notifications: notificationsReducer,
|
notifications: notificationsReducer,
|
||||||
blacklist: blacklistReducer,
|
blacklist: blacklistReducer,
|
||||||
|
|
Loading…
Add table
Reference in a new issue