From c5e6db73f0efa606b58ff30d04b36bd65b629366 Mon Sep 17 00:00:00 2001 From: seanyesmunt Date: Mon, 6 Aug 2018 23:31:42 -0400 Subject: [PATCH] move autoplay back to below file actions --- .../common/form-components/form-field.jsx | 2 -- .../common/form-components/form-row.jsx | 11 +------- .../component/recommendedContent/index.js | 5 ---- .../component/recommendedContent/view.jsx | 21 ++------------- src/renderer/page/file/view.jsx | 27 +++++++++++++++++++ src/renderer/scss/component/_form-field.scss | 11 +------- src/renderer/scss/component/_tooltip.scss | 4 +-- 7 files changed, 33 insertions(+), 48 deletions(-) diff --git a/src/renderer/component/common/form-components/form-field.jsx b/src/renderer/component/common/form-components/form-field.jsx index 140c7d6af..a38722d94 100644 --- a/src/renderer/component/common/form-components/form-field.jsx +++ b/src/renderer/component/common/form-components/form-field.jsx @@ -40,7 +40,6 @@ export class FormField extends React.PureComponent { children, stretch, affixClass, - firstInList, ...inputProps } = this.props; @@ -103,7 +102,6 @@ export class FormField extends React.PureComponent {
{prefix && ( diff --git a/src/renderer/component/common/form-components/form-row.jsx b/src/renderer/component/common/form-components/form-row.jsx index 3bd93252d..79f1b5cd0 100644 --- a/src/renderer/component/common/form-components/form-row.jsx +++ b/src/renderer/component/common/form-components/form-row.jsx @@ -9,7 +9,6 @@ type Props = { verticallyCentered?: boolean, stretch?: boolean, alignRight?: boolean, - spaceBetween?: boolean, }; export class FormRow extends React.PureComponent { @@ -18,14 +17,7 @@ export class FormRow extends React.PureComponent { }; render() { - const { - children, - padded, - verticallyCentered, - stretch, - alignRight, - spaceBetween, - } = this.props; + const { children, padded, verticallyCentered, stretch, alignRight } = this.props; return (
{ 'form-row--vertically-centered': verticallyCentered, 'form-row--stretch': stretch, 'form-row--right': alignRight, - 'form-row--space-between': spaceBetween, })} > {children} diff --git a/src/renderer/component/recommendedContent/index.js b/src/renderer/component/recommendedContent/index.js index 06885d139..1cc5c2f51 100644 --- a/src/renderer/component/recommendedContent/index.js +++ b/src/renderer/component/recommendedContent/index.js @@ -1,18 +1,13 @@ -import * as settings from 'constants/settings'; import { connect } from 'react-redux'; import { makeSelectClaimForUri, doSearch, makeSelectRecommendedContentForUri } from 'lbry-redux'; -import { doSetClientSetting } from 'redux/actions/settings'; -import { makeSelectClientSetting } from 'redux/selectors/settings'; import RecommendedVideos from './view'; const select = (state, props) => ({ claim: makeSelectClaimForUri(props.uri)(state), recommendedContent: makeSelectRecommendedContentForUri(props.uri)(state), - autoplay: makeSelectClientSetting(settings.AUTOPLAY)(state), }); const perform = dispatch => ({ - setAutoplay: value => dispatch(doSetClientSetting(settings.AUTOPLAY, value)), search: query => dispatch(doSearch(query, 20)), }); diff --git a/src/renderer/component/recommendedContent/view.jsx b/src/renderer/component/recommendedContent/view.jsx index 6305b7861..7fedc5420 100644 --- a/src/renderer/component/recommendedContent/view.jsx +++ b/src/renderer/component/recommendedContent/view.jsx @@ -1,17 +1,13 @@ // @flow import React from 'react'; import FileTile from 'component/fileTile'; -import { FormRow, FormField } from 'component/common/form'; -import ToolTip from 'component/common/tooltip'; import type { Claim } from 'types/claim'; type Props = { uri: string, claim: ?Claim, - autoplay: boolean, recommendedContent: Array, search: string => void, - setAutoplay: boolean => void, }; type State = { @@ -62,24 +58,11 @@ export default class RecommendedContent extends React.PureComponent - - Related - - setAutoplay(e.target.checked)} - /> - - + Related {recommendedContent && recommendedContent.length && recommendedContent.map(recommendedUri => ( diff --git a/src/renderer/page/file/view.jsx b/src/renderer/page/file/view.jsx index 9dfab3fe2..8eba0ed2d 100644 --- a/src/renderer/page/file/view.jsx +++ b/src/renderer/page/file/view.jsx @@ -1,5 +1,6 @@ // @flow import * as React from 'react'; +import * as settings from 'constants/settings'; import { buildURI, normalizeURI, MODALS } from 'lbry-redux'; import FileViewer from 'component/fileViewer'; import Thumbnail from 'component/common/thumbnail'; @@ -20,6 +21,8 @@ import FileDownloadLink from 'component/fileDownloadLink'; import classnames from 'classnames'; import getMediaType from 'util/getMediaType'; import RecommendedContent from 'component/recommendedContent'; +import { FormField, FormRow } from 'component/common/form'; +import ToolTip from 'component/common/tooltip'; type Props = { claim: Claim, @@ -43,6 +46,8 @@ type Props = { prepareEdit: ({}, string) => void, checkSubscription: ({ channelName: string, uri: string }) => void, subscriptions: Array, + setClientSetting: (string, boolean | string) => void, + autoplay: boolean, }; class FilePage extends React.Component { @@ -59,6 +64,12 @@ class FilePage extends React.Component { 'application', ]; + constructor(props: Props) { + super(props); + + (this: any).onAutoplayChange = this.onAutoplayChange.bind(this); + } + componentDidMount() { const { uri, fileInfo, fetchFileInfo, fetchCostInfo } = this.props; @@ -79,6 +90,10 @@ class FilePage extends React.Component { } } + onAutoplayChange(event: SyntheticInputEvent<*>) { + this.props.setClientSetting(settings.AUTOPLAY, event.target.checked); + } + checkSubscription = (props: Props) => { if (props.subscriptions.find(sub => sub.channelName === props.claim.channel_name)) { props.checkSubscription({ @@ -108,6 +123,7 @@ class FilePage extends React.Component { navigate, costInfo, fileInfo, + autoplay, } = this.props; // File info @@ -213,6 +229,17 @@ class FilePage extends React.Component {
+ + + + +
diff --git a/src/renderer/scss/component/_form-field.scss b/src/renderer/scss/component/_form-field.scss index f1a0b4f37..15fbe14e5 100644 --- a/src/renderer/scss/component/_form-field.scss +++ b/src/renderer/scss/component/_form-field.scss @@ -12,7 +12,7 @@ } &.form-row--padded { - padding-top: $spacing-vertical * 2/3; + padding-top: $spacing-vertical * 1/3; } &.form-row--vertically-centered { @@ -27,10 +27,6 @@ justify-content: flex-end; } - &.form-row--space-between { - justify-content: space-between; - } - .form-field.form-field--stretch { width: 100%; @@ -125,11 +121,6 @@ padding-left: $spacing-vertical * 1/3; } -.form-field__prefix--recommended-content { - font-size: 12px; - align-self: center; -} - .form-field__select { min-width: 60px; height: 30px; diff --git a/src/renderer/scss/component/_tooltip.scss b/src/renderer/scss/component/_tooltip.scss index ff58835f6..9acd75954 100644 --- a/src/renderer/scss/component/_tooltip.scss +++ b/src/renderer/scss/component/_tooltip.scss @@ -75,8 +75,8 @@ .tooltip--right { .tooltip__body { - margin-top: -5px; - margin-left: 10px; + margin-top: -30px; + margin-left: 110%; &::after { top: 17px;