From c1161fc10bbaa2a7755305f5a942c227197d8a26 Mon Sep 17 00:00:00 2001 From: Jeremy Kauffman Date: Thu, 11 May 2017 19:28:43 -0400 Subject: [PATCH] mainly more bug fixes --- ui/js/actions/content.js | 9 +------ ui/js/actions/cost_info.js | 10 +++++++- ui/js/actions/search.js | 14 +++-------- ui/js/component/fileTile/index.js | 6 ++++- ui/js/component/fileTile/view.jsx | 16 ++++++++++-- ui/js/component/video/view.jsx | 40 ++---------------------------- ui/js/component/wunderbar/view.jsx | 29 ++++++++++++++++------ ui/js/page/filePage/index.js | 4 +-- ui/js/page/filePage/view.jsx | 2 ++ ui/js/page/search/index.js | 3 +-- ui/js/page/search/view.jsx | 3 --- ui/js/page/showPage/index.js | 31 ++++++----------------- ui/js/page/showPage/view.jsx | 38 +++++++++++++--------------- ui/js/selectors/content.js | 7 ++++++ ui/js/selectors/search.js | 9 +++---- ui/js/store.js | 12 ++++----- 16 files changed, 101 insertions(+), 132 deletions(-) diff --git a/ui/js/actions/content.js b/ui/js/actions/content.js index 94eed6a10..cc64d8d9a 100644 --- a/ui/js/actions/content.js +++ b/ui/js/actions/content.js @@ -9,9 +9,6 @@ import { import { selectBalance, } from 'selectors/wallet' -import { - selectSearchTerm, -} from 'selectors/content' import { selectCurrentUriFileInfo, selectDownloadingByUri, @@ -19,9 +16,6 @@ import { import { selectCurrentUriCostInfo, } from 'selectors/cost_info' -import { - selectCurrentResolvedUriClaimOutpoint, -} from 'selectors/content' import { selectClaimsByUri, } from 'selectors/claims' @@ -31,7 +25,6 @@ import { import { doFetchCostInfoForUri, } from 'actions/cost_info' -import batchActions from 'util/batchActions' export function doResolveUri(uri) { return function(dispatch, getState) { @@ -40,7 +33,7 @@ export function doResolveUri(uri) { data: { uri } }) - return lbry.resolve({ uri }).then((resolutionInfo) => { + lbry.resolve({ uri }).then((resolutionInfo) => { const { claim, certificate, diff --git a/ui/js/actions/cost_info.js b/ui/js/actions/cost_info.js index 42d5f61e9..5d28fb42c 100644 --- a/ui/js/actions/cost_info.js +++ b/ui/js/actions/cost_info.js @@ -21,7 +21,15 @@ export function doFetchCostInfoForUri(uri) { costInfo, } }) - }).catch(() => {}) + }).catch(() => { + dispatch({ + type: types.FETCH_COST_INFO_COMPLETED, + data: { + uri, + costInfo: {} + } + }) + }) } } diff --git a/ui/js/actions/search.js b/ui/js/actions/search.js index 88206d05e..b2748ff1b 100644 --- a/ui/js/actions/search.js +++ b/ui/js/actions/search.js @@ -1,6 +1,4 @@ import * as types from 'constants/action_types' -import lbry from 'lbry' -import lbryio from 'lbryio' import lbryuri from 'lbryuri' import lighthouse from 'lighthouse' import { @@ -12,9 +10,6 @@ import { import { selectCurrentPage, } from 'selectors/app' -import { - selectSearchQuery, -} from 'selectors/search' export function doSearch(query) { return function(dispatch, getState) { @@ -27,16 +22,15 @@ export function doSearch(query) { }) } - if(page != 'search' && query != undefined) { - return dispatch(doNavigate('search', { query: query })) - } - - dispatch({ type: types.SEARCH_STARTED, data: { query } }) + if(page != 'search') { + dispatch(doNavigate('search', { query: query })) + } + lighthouse.search(query).then(results => { results.forEach(result => { const uri = lbryuri.build({ diff --git a/ui/js/component/fileTile/index.js b/ui/js/component/fileTile/index.js index 82261bc0e..dd17e8e60 100644 --- a/ui/js/component/fileTile/index.js +++ b/ui/js/component/fileTile/index.js @@ -5,6 +5,9 @@ import { import { doNavigate, } from 'actions/app' +import { + doResolveUri, +} from 'actions/content' import { makeSelectClaimForUri, makeSelectSourceForUri, @@ -49,7 +52,8 @@ const makeSelect = () => { } const perform = (dispatch) => ({ - navigate: (path, params) => dispatch(doNavigate(path, params)) + navigate: (path, params) => dispatch(doNavigate(path, params)), + resolveUri: (uri) => dispatch(doResolveUri(uri)), }) export default connect(makeSelect, perform)(FileTile) \ No newline at end of file diff --git a/ui/js/component/fileTile/view.jsx b/ui/js/component/fileTile/view.jsx index 09570527e..455e59d5a 100644 --- a/ui/js/component/fileTile/view.jsx +++ b/ui/js/component/fileTile/view.jsx @@ -22,10 +22,22 @@ class FileTile extends React.Component { } componentDidMount() { + const { + isResolvingUri, + resolveUri, + claim, + uri, + } = this.props + this._isMounted = true; + if (this.props.hideOnRemove) { this._fileInfoSubscribeId = lbry.fileInfoSubscribe(this.props.outpoint, this.onFileInfoUpdate); } + + if(!isResolvingUri && !claim && uri) { + resolveUri(uri) + } } componentWillUnmount() { @@ -85,14 +97,14 @@ class FileTile extends React.Component { description = "Loading..." } else if (showEmpty === FileTile.SHOW_EMPTY_PUBLISH) { onClick = () => navigate('/publish') - description = This location is unclaimed - ! + description = This location is unclaimed - put something here! } else if (showEmpty === FileTile.SHOW_EMPTY_PENDING) { description = This file is pending confirmation. } return (
- +
diff --git a/ui/js/component/video/view.jsx b/ui/js/component/video/view.jsx index a1093cf40..5485f1a48 100644 --- a/ui/js/component/video/view.jsx +++ b/ui/js/component/video/view.jsx @@ -64,43 +64,7 @@ const plyr = require('plyr') class Video extends React.Component { constructor(props) { super(props) - - // TODO none of this mouse handling stuff seems to actually do anything? - this._controlsHideDelay = 3000 // Note: this needs to be shorter than the built-in delay in Electron, or Electron will hide the controls before us - this._controlsHideTimeout = null - this.state = {} - } - handleMouseMove() { - if (this._controlsTimeout) { - clearTimeout(this._controlsTimeout); - } - - if (!this.state.controlsShown) { - this.setState({ - controlsShown: true, - }); - } - this._controlsTimeout = setTimeout(() => { - if (!this.isMounted) { - return; - } - - this.setState({ - controlsShown: false, - }); - }, this._controlsHideDelay); - } - - handleMouseLeave() { - if (this._controlsTimeout) { - clearTimeout(this._controlsTimeout); - } - - if (this.state.controlsShown) { - this.setState({ - controlsShown: false, - }); - } + this.state = { isPlaying: false } } onWatchClick() { @@ -141,7 +105,7 @@ class Video extends React.Component { } return ( -
{ +
{ isPlaying ? !readyToPlay ? this is the world's worst loading screen and we shipped our software with it anyway...

{loadStatusMessage} : diff --git a/ui/js/component/wunderbar/view.jsx b/ui/js/component/wunderbar/view.jsx index bdf432ea8..79aae5d1f 100644 --- a/ui/js/component/wunderbar/view.jsx +++ b/ui/js/component/wunderbar/view.jsx @@ -3,6 +3,8 @@ import lbryuri from 'lbryuri.js'; import {Icon} from 'component/common.js'; class WunderBar extends React.PureComponent { + static TYPING_TIMEOUT = 800 + static propTypes = { onSearch: React.PropTypes.func.isRequired, onSubmit: React.PropTypes.func.isRequired @@ -11,6 +13,7 @@ class WunderBar extends React.PureComponent { constructor(props) { super(props); this._userTypingTimer = null; + this._isSearchDispatchPending = false; this._input = null; this._stateBeforeSearch = null; this._resetOnNextBlur = true; @@ -40,15 +43,18 @@ class WunderBar extends React.PureComponent { this.setState({ address: event.target.value }) + this._isSearchDispatchPending = true; + let searchQuery = event.target.value; this._userTypingTimer = setTimeout(() => { const hasQuery = searchQuery.length === 0; this._resetOnNextBlur = hasQuery; + this._isSearchDispatchPending = false; if (searchQuery) { this.props.onSearch(searchQuery); } - }, 800); // 800ms delay, tweak for faster/slower + }, WunderBar.TYPING_TIMEOUT); // 800ms delay, tweak for faster/slower } componentWillReceiveProps(nextProps) { @@ -74,14 +80,21 @@ class WunderBar extends React.PureComponent { } onBlur() { - let commonState = {isActive: false}; - if (this._resetOnNextBlur) { - this.setState(Object.assign({}, this._stateBeforeSearch, commonState)); - this._input.value = this.state.address; + if (this._isSearchDispatchPending) { + setTimeout(() => { + this.onBlur(); + }, WunderBar.TYPING_TIMEOUT + 1) } else { - this._resetOnNextBlur = true; - this._stateBeforeSearch = this.state; - this.setState(commonState); + let commonState = {isActive: false}; + if (this._resetOnNextBlur) { + this.setState(Object.assign({}, this._stateBeforeSearch, commonState)); + this._input.value = this.state.address; + } + else { + this._resetOnNextBlur = true; + this._stateBeforeSearch = this.state; + this.setState(commonState); + } } } diff --git a/ui/js/page/filePage/index.js b/ui/js/page/filePage/index.js index d553517c2..a083bdf9c 100644 --- a/ui/js/page/filePage/index.js +++ b/ui/js/page/filePage/index.js @@ -6,14 +6,12 @@ import { selectCurrentUri, } from 'selectors/app' import { + selectCurrentUriFileInfo, selectCurrentUriIsDownloaded, } from 'selectors/file_info' import { selectCurrentUriClaim, } from 'selectors/claims' -import { - selectCurrentUriFileInfo, -} from 'selectors/file_info' import { selectCurrentUriCostInfo, } from 'selectors/cost_info' diff --git a/ui/js/page/filePage/view.jsx b/ui/js/page/filePage/view.jsx index 339caa3f1..30938d635 100644 --- a/ui/js/page/filePage/view.jsx +++ b/ui/js/page/filePage/view.jsx @@ -88,6 +88,8 @@ const FilePage = (props) => { 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" />.

+ return (
diff --git a/ui/js/page/search/index.js b/ui/js/page/search/index.js index 01a75d6d8..0848d15b2 100644 --- a/ui/js/page/search/index.js +++ b/ui/js/page/search/index.js @@ -14,8 +14,7 @@ import SearchPage from './view' const select = (state) => ({ isSearching: selectIsSearching(state), - query: selectSearchQuery(state), - results: selectCurrentSearchResults(state), + query: selectSearchQuery(state) }) const perform = (dispatch) => ({ diff --git a/ui/js/page/search/view.jsx b/ui/js/page/search/view.jsx index 50b580c79..30f9b2aee 100644 --- a/ui/js/page/search/view.jsx +++ b/ui/js/page/search/view.jsx @@ -8,9 +8,6 @@ import {BusyMessage} from 'component/common.js'; class SearchPage extends React.Component{ render() { - console.log('searhc page render'); - console.log(this.props); - const isValidUri = (query) => true //FIXME const { query, diff --git a/ui/js/page/showPage/index.js b/ui/js/page/showPage/index.js index e1aa5f810..bbaba13f6 100644 --- a/ui/js/page/showPage/index.js +++ b/ui/js/page/showPage/index.js @@ -8,39 +8,22 @@ import { import { selectCurrentUri, } from 'selectors/app' -import { - selectCurrentUriIsDownloaded, -} from 'selectors/file_info' import { selectCurrentUriClaim, } from 'selectors/claims' import { - selectCurrentUriFileInfo, -} from 'selectors/file_info' -import { - selectCurrentUriCostInfo, -} from 'selectors/cost_info' -import { - makeSelectResolvingUri, + selectCurrentUriIsResolving, } from 'selectors/content' import ShowPage from './view' -const makeSelect = () => { - const selectResolvingUri = makeSelectResolvingUri() - - const select = (state, props) => ({ - claim: selectCurrentUriClaim(state), - uri: selectCurrentUri(state), - isResolvingUri: selectResolvingUri(state, props), - claimType: 'file', - }) - - return select -} +const select = (state, props) => ({ + claim: selectCurrentUriClaim(state), + uri: selectCurrentUri(state), + isResolvingUri: selectCurrentUriIsResolving(state) +}) const perform = (dispatch) => ({ - navigate: (path, params) => dispatch(doNavigate(path, params)), resolveUri: (uri) => dispatch(doResolveUri(uri)) }) -export default connect(makeSelect, perform)(ShowPage) +export default connect(select, perform)(ShowPage) diff --git a/ui/js/page/showPage/view.jsx b/ui/js/page/showPage/view.jsx index 4205c3e73..7e84d3d30 100644 --- a/ui/js/page/showPage/view.jsx +++ b/ui/js/page/showPage/view.jsx @@ -6,12 +6,20 @@ import FilePage from 'page/filePage' class ShowPage extends React.Component{ componentWillMount() { + this.resolve(this.props) + } + + componentWillReceiveProps(nextProps) { + this.resolve(nextProps) + } + + resolve(props) { const { isResolvingUri, resolveUri, claim, uri, - } = this.props + } = props if(!isResolvingUri && !claim && uri) { resolveUri(uri) @@ -20,41 +28,29 @@ class ShowPage extends React.Component{ render() { const { - claim: { - value: { - stream: { - metadata - } = {}, - } = {}, - } = {}, - navigate, + claim, uri, isResolvingUri, - claimType, } = this.props - const pageTitle = metadata ? metadata.title : uri; - let innerContent = ""; if (isResolvingUri) { innerContent =
-

{pageTitle}

+

{uri}

- { isResolvingUri ? - : -

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

- } + :
; } - else if (claimType == "channel") { - innerContent = + else if (claim && claim.whatever) { + innerContent = "channel" + // innerContent = } - else { - innerContent = + else if (claim) { + innerContent = } return ( diff --git a/ui/js/selectors/content.js b/ui/js/selectors/content.js index 68df29b0f..6ee54bf94 100644 --- a/ui/js/selectors/content.js +++ b/ui/js/selectors/content.js @@ -53,6 +53,13 @@ export const selectResolvingUris = createSelector( (state) => state.resolvingUris || [] ) + +export const selectCurrentUriIsResolving = createSelector( + selectCurrentUri, + selectResolvingUris, + (uri, resolvingUris) => resolvingUris.indexOf(uri) != -1 +) + const selectResolvingUri = (state, props) => { return selectResolvingUris(state).indexOf(props.uri) != -1 } diff --git a/ui/js/selectors/search.js b/ui/js/selectors/search.js index 1a4e6ffde..12dec7658 100644 --- a/ui/js/selectors/search.js +++ b/ui/js/selectors/search.js @@ -1,7 +1,5 @@ import { createSelector } from 'reselect' import { - selectCurrentParams, - selectDaemonReady, selectPageTitle, selectCurrentPage, selectCurrentUri @@ -10,8 +8,8 @@ import { export const _selectState = state => state.search || {} export const selectSearchQuery = createSelector( - selectCurrentParams, - (params) => params.query + _selectState, + (state) => state.query ) export const selectIsSearching = createSelector( @@ -37,9 +35,10 @@ export const selectCurrentSearchResults = createSelector( export const selectWunderBarAddress = createSelector( + selectCurrentPage, selectPageTitle, selectSearchQuery, - (title, query) => query || title + (page, title, query) => page != "search" ? title : (query ? query : title) ) export const selectWunderBarIcon = createSelector( diff --git a/ui/js/store.js b/ui/js/store.js index b824cbe7d..462c6a5d0 100644 --- a/ui/js/store.js +++ b/ui/js/store.js @@ -62,12 +62,12 @@ const reducers = redux.combineReducers({ const bulkThunk = createBulkThunkMiddleware() const middleware = [thunk, bulkThunk] -// if (env === 'development') { -// const logger = createLogger({ -// collapsed: true -// }); -// middleware.push(logger) -// } +if (env === 'development') { + const logger = createLogger({ + collapsed: true + }); + middleware.push(logger) +} const createStoreWithMiddleware = redux.compose( redux.applyMiddleware(...middleware)