From 5605b10f542dca722eafb202f1633440d0d0ba4e Mon Sep 17 00:00:00 2001 From: Jeremy Kauffman Date: Fri, 12 May 2017 13:14:06 -0400 Subject: [PATCH] more bug fixes and bugs --- ui/js/actions/content.js | 2 - ui/js/actions/cost_info.js | 2 +- ui/js/component/filePrice/index.js | 4 + ui/js/component/filePrice/view.jsx | 44 ++++++-- ui/js/component/video/view.jsx | 5 +- ui/js/lbryio.js | 5 +- ui/js/page/filePage/index.js | 4 + ui/js/page/filePage/view.jsx | 162 ++++++++++++++++------------- ui/js/page/showPage/view.jsx | 2 +- ui/js/selectors/cost_info.js | 2 +- ui/package.json | 1 - ui/scss/_mediaelement.scss | 16 --- ui/scss/all.scss | 2 - ui/scss/page/_watch.scss | 48 --------- 14 files changed, 142 insertions(+), 157 deletions(-) delete mode 100644 ui/scss/_mediaelement.scss delete mode 100644 ui/scss/page/_watch.scss diff --git a/ui/js/actions/content.js b/ui/js/actions/content.js index cc64d8d9a..5c0e288fd 100644 --- a/ui/js/actions/content.js +++ b/ui/js/actions/content.js @@ -47,8 +47,6 @@ export function doResolveUri(uri) { certificate, } }) - - dispatch(doFetchCostInfoForUri(uri)) }) } } diff --git a/ui/js/actions/cost_info.js b/ui/js/actions/cost_info.js index 5d28fb42c..5a6a66604 100644 --- a/ui/js/actions/cost_info.js +++ b/ui/js/actions/cost_info.js @@ -26,7 +26,7 @@ export function doFetchCostInfoForUri(uri) { type: types.FETCH_COST_INFO_COMPLETED, data: { uri, - costInfo: {} + costInfo: null } }) }) diff --git a/ui/js/component/filePrice/index.js b/ui/js/component/filePrice/index.js index c5a9497d0..b2271e493 100644 --- a/ui/js/component/filePrice/index.js +++ b/ui/js/component/filePrice/index.js @@ -2,6 +2,9 @@ import React from 'react' import { connect, } from 'react-redux' +import { + doFetchCostInfoForUri, +} from 'actions/cost_info' import { makeSelectCostInfoForUri, } from 'selectors/cost_info' @@ -17,6 +20,7 @@ const makeSelect = () => { } const perform = (dispatch) => ({ + fetchCostInfo: (uri) => dispatch(doFetchCostInfoForUri(uri)) }) export default connect(makeSelect, perform)(FilePrice) diff --git a/ui/js/component/filePrice/view.jsx b/ui/js/component/filePrice/view.jsx index 17b830bf2..4edc3a3e7 100644 --- a/ui/js/component/filePrice/view.jsx +++ b/ui/js/component/filePrice/view.jsx @@ -3,19 +3,41 @@ import { CreditAmount, } from 'component/common' -const FilePrice = (props) => { - const { - costInfo, - look = 'indicator', - } = props - - const isEstimate = costInfo ? !costInfo.includesData : null - - if (!costInfo) { - return ???; +class FilePrice extends React.Component{ + componentWillMount() { + this.fetchCost(this.props) } - return + componentWillReceiveProps(nextProps) { + this.fetchCost(nextProps) + } + + fetchCost(props) { + const { + costInfo, + fetchCostInfo, + uri + } = props + + if (costInfo === undefined) { + fetchCostInfo(uri) + } + } + + render() { + const { + costInfo, + look = 'indicator', + } = this.props + + const isEstimate = costInfo ? !costInfo.includesData : null + + if (!costInfo) { + return ???; + } + + return + } } export default FilePrice diff --git a/ui/js/component/video/view.jsx b/ui/js/component/video/view.jsx index 5485f1a48..e19e6b2a4 100644 --- a/ui/js/component/video/view.jsx +++ b/ui/js/component/video/view.jsx @@ -32,9 +32,12 @@ class WatchLink extends React.Component { fileInfo, } = this.props + console.log('watch link render') + console.log(fileInfo) + return (
EXCHANGE_RATE_TIMEOUT) { + + } return new Promise((resolve, reject) => { - const cached = getSession('exchangeRateCache'); if (!cached || Date.now() - cached.time > EXCHANGE_RATE_TIMEOUT) { lbryio.call('lbc', 'exchange_rate', {}, 'get', true).then(({lbc_usd, lbc_btc, btc_usd}) => { const rates = {lbc_usd, lbc_btc, btc_usd}; diff --git a/ui/js/page/filePage/index.js b/ui/js/page/filePage/index.js index a083bdf9c..3d0ba7665 100644 --- a/ui/js/page/filePage/index.js +++ b/ui/js/page/filePage/index.js @@ -2,6 +2,9 @@ import React from 'react' import { connect } from 'react-redux' +import { + doFetchCurrentUriFileInfo +} from 'actions/file_info' import { selectCurrentUri, } from 'selectors/app' @@ -26,6 +29,7 @@ const select = (state) => ({ }) const perform = (dispatch) => ({ + fetchFileInfo: () => dispatch(doFetchCurrentUriFileInfo()) }) export default connect(select, perform)(FilePage) diff --git a/ui/js/page/filePage/view.jsx b/ui/js/page/filePage/view.jsx index 30938d635..d5a29d7a9 100644 --- a/ui/js/page/filePage/view.jsx +++ b/ui/js/page/filePage/view.jsx @@ -45,87 +45,105 @@ const FormatItem = (props) => { ) } -const FilePage = (props) => { - const { - claim, - navigate, - claim: { - txid, - nout, - has_signature: hasSignature, - signature_is_valid: signatureIsValid, - value, - value: { - stream, - stream: { - metadata, - source, - metadata: { - title, - } = {}, - source: { - contentType, +class FilePage extends React.Component{ + + componentWillMount() { + this.fetchFileInfo(this.props) + } + + componentWillReceiveProps(nextProps) { + this.fetchFileInfo(nextProps) + } + + fetchFileInfo(props) { + if (!props.fileInfo) { + console.log('fetch file info') + props.fetchFileInfo() + } + } + + render() { + const { + claim, + navigate, + claim: { + txid, + nout, + has_signature: hasSignature, + signature_is_valid: signatureIsValid, + value, + value: { + stream, + stream: { + metadata, + source, + metadata: { + title, + } = {}, + source: { + contentType, + } = {}, } = {}, } = {}, + }, + uri, + isDownloaded, + fileInfo, + costInfo, + costInfo: { + cost, + includesData: costIncludesData, } = {}, - }, - uri, - isDownloaded, - fileInfo, - costInfo, - costInfo: { - cost, - includesData: costIncludesData, - } = {}, - } = props + } = this.props - const outpoint = txid + ':' + nout; - const uriLookupComplete = !!claim && Object.keys(claim).length + const outpoint = txid + ':' + nout; + const uriLookupComplete = !!claim && Object.keys(claim).length - const channelUriObj = lbryuri.parse(uri) - delete channelUriObj.path; - delete channelUriObj.contentName; - const channelUri = signatureIsValid && hasSignature && channelUriObj.isChannel ? lbryuri.build(channelUriObj, false) : null; - const uriIndicator = + const channelUriObj = lbryuri.parse(uri) + delete channelUriObj.path; + delete channelUriObj.contentName; + const channelUri = signatureIsValid && hasSignature && channelUriObj.isChannel ? lbryuri.build(channelUriObj, false) : null; + const uriIndicator = - //

This location is not yet in use. { ' ' } navigate('/publish')} label="Put something here" />.

+ //

This location is not yet in use. { ' ' } navigate('/publish')} label="Put something here" />.

- return ( -
-
- { contentType && contentType.startsWith('video/') ? -
-
-
-
- {isDownloaded === false - ? - : null} -

{title}

-
- { channelUri ? - {uriIndicator} : - uriIndicator} -
-
-
+ return ( +
+
+ { contentType && contentType.startsWith('video/') ? +
+
+
+
+ {isDownloaded === false + ? + : null}

{title}

+
+ { channelUri ? + {uriIndicator} : + uriIndicator} +
+
+
+
+
+ {metadata.description} +
-
- {metadata.description} -
-
- { metadata ? + { metadata ? +
+ +
: '' }
- -
: '' } -
- -
-
-
- ) + +
+ + + ) + } } export default FilePage; \ No newline at end of file diff --git a/ui/js/page/showPage/view.jsx b/ui/js/page/showPage/view.jsx index 7e84d3d30..bdc4f7a81 100644 --- a/ui/js/page/showPage/view.jsx +++ b/ui/js/page/showPage/view.jsx @@ -41,7 +41,7 @@ class ShowPage extends React.Component{

{uri}

- : +
; } diff --git a/ui/js/selectors/cost_info.js b/ui/js/selectors/cost_info.js index f48fa3438..da55c89af 100644 --- a/ui/js/selectors/cost_info.js +++ b/ui/js/selectors/cost_info.js @@ -14,7 +14,7 @@ export const selectAllCostInfoByUri = createSelector( export const selectCurrentUriCostInfo = createSelector( selectCurrentUri, selectAllCostInfoByUri, - (uri, byUri) => byUri[uri] || {} + (uri, byUri) => byUri[uri] ) export const selectFetchingCostInfo = createSelector( diff --git a/ui/package.json b/ui/package.json index e73d866f6..72d7bdde1 100644 --- a/ui/package.json +++ b/ui/package.json @@ -22,7 +22,6 @@ "babel-cli": "^6.11.4", "babel-preset-es2015": "^6.13.2", "babel-preset-react": "^6.11.1", - "mediaelement": "^2.23.4", "node-sass": "^3.8.0", "plyr": "^2.0.12", "rc-progress": "^2.0.6", diff --git a/ui/scss/_mediaelement.scss b/ui/scss/_mediaelement.scss deleted file mode 100644 index 44488808f..000000000 --- a/ui/scss/_mediaelement.scss +++ /dev/null @@ -1,16 +0,0 @@ -@import "global"; - -.mejs-container, .mejs-overlay, .mejs-mediaelement { - width: 100%; - height: 100%; -} - -.me-plugin { - width: 100%; - height: 100%; - - > embed { - width: 100%; - height: 100%; - } -} \ No newline at end of file diff --git a/ui/scss/all.scss b/ui/scss/all.scss index 7c87a5fbb..e69354bd0 100644 --- a/ui/scss/all.scss +++ b/ui/scss/all.scss @@ -1,6 +1,5 @@ @import "_reset"; @import "_icons"; -@import "_mediaelement"; @import "_gui"; @import "component/_table"; @import "component/_button.scss"; @@ -19,6 +18,5 @@ @import "component/_snack-bar.scss"; @import "component/_video.scss"; @import "page/_developer.scss"; -@import "page/_watch.scss"; @import "page/_reward.scss"; @import "page/_show.scss"; diff --git a/ui/scss/page/_watch.scss b/ui/scss/page/_watch.scss deleted file mode 100644 index 6ed5459ae..000000000 --- a/ui/scss/page/_watch.scss +++ /dev/null @@ -1,48 +0,0 @@ - -.video__overlay { - position: absolute; - top: 0px; - left: 0px; - color: #fff; - z-index: 1; -} - -.video__back { - margin-top: 30px; - margin-left: 50px; - display: flex; - flex-direction: row; - align-items: center; -} - -.video__back-link { - font-size: 50px; -} - -.video__back-label { - opacity: 0.5; - transition: opacity 100ms ease-in; -} - -.video__back-link:hover + .video__back-label { - opacity: 1; -} - -$video-back-background: #333; -$video-back-size: 20px; - -.video__back-label-arrow { - color: $video-back-background; - font-size: $video-back-size; -} - -.video__back-label-content { - display: inline-block; - margin-left: -2px; - font-size: $video-back-size; - padding: $spacing-vertical / 2; - border-radius: 3px; - background-color: $video-back-background; - color: #fff; - pointer-events: none; -}