From 52b404b552038da52096268c71e6a82840509126 Mon Sep 17 00:00:00 2001 From: Akinwale Ariwodola Date: Thu, 6 Jul 2017 04:14:45 +0100 Subject: [PATCH 01/14] Issue #312 home page scroll position on back navigation --- ui/js/page/discover/view.jsx | 20 +++++++++++++++++++- 1 file changed, 19 insertions(+), 1 deletion(-) diff --git a/ui/js/page/discover/view.jsx b/ui/js/page/discover/view.jsx index d6c506dfd..99387949d 100644 --- a/ui/js/page/discover/view.jsx +++ b/ui/js/page/discover/view.jsx @@ -3,6 +3,7 @@ import lbryio from "lbryio.js"; import lbryuri from "lbryuri"; import FileCard from "component/fileCard"; import { BusyMessage } from "component/common.js"; +import { setSession, getSession } from "utils"; import ToolTip from "component/tooltip.js"; const FeaturedCategory = props => { @@ -37,10 +38,27 @@ const FeaturedCategory = props => { class DiscoverPage extends React.PureComponent { componentWillMount() { this.props.fetchFeaturedUris(); + this.scrollListener = this.handleScroll.bind(this); + } + + componentDidMount() { + const scrollY = parseInt(getSession("prefs_scrolly")); + if (!isNaN(scrollY)) { + const restoreScrollPosition = () => { + window.scrollTo(0, scrollY); + }; + setTimeout(restoreScrollPosition, 100); + } + window.addEventListener("scroll", this.scrollListener); + } + + handleScroll() { + setSession("prefs_scrolly", window.scrollY); } componentWillUnmount() { this.props.cancelResolvingUris(); + window.removeEventListener("scroll", this.scrollListener); } render() { @@ -51,7 +69,7 @@ class DiscoverPage extends React.PureComponent { (featuredUris !== undefined && Object.keys(featuredUris).length === 0)); return ( -
+
{fetchingFeaturedUris && } {typeof featuredUris === "object" && From 89b58aa588bcf4f9e57ef1066a3999820f3506b3 Mon Sep 17 00:00:00 2001 From: Akinwale Ariwodola Date: Thu, 6 Jul 2017 04:20:25 +0100 Subject: [PATCH 02/14] removed unused ref --- ui/js/page/discover/view.jsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/ui/js/page/discover/view.jsx b/ui/js/page/discover/view.jsx index 99387949d..b68d026b9 100644 --- a/ui/js/page/discover/view.jsx +++ b/ui/js/page/discover/view.jsx @@ -69,7 +69,7 @@ class DiscoverPage extends React.PureComponent { (featuredUris !== undefined && Object.keys(featuredUris).length === 0)); return ( -
+
{fetchingFeaturedUris && } {typeof featuredUris === "object" && From 187ac405fe44aa7551b91fb54fda4db0a2199cd3 Mon Sep 17 00:00:00 2001 From: Akinwale Ariwodola Date: Thu, 13 Jul 2017 16:32:32 +0100 Subject: [PATCH 03/14] Modified to use redux store and return to previous scroll position only upon back navigation --- ui/js/actions/app.js | 11 +++++++++++ ui/js/constants/action_types.js | 1 + ui/js/page/discover/index.js | 4 ++++ ui/js/page/discover/view.jsx | 20 ++++++++++++-------- ui/js/reducers/app.js | 12 ++++++++++++ ui/js/selectors/app.js | 5 +++++ 6 files changed, 45 insertions(+), 8 deletions(-) diff --git a/ui/js/actions/app.js b/ui/js/actions/app.js index 35049d435..5eba212f1 100644 --- a/ui/js/actions/app.js +++ b/ui/js/actions/app.js @@ -64,6 +64,17 @@ export function doHistoryBack() { if (!history.state) return; history.back(); + dispatch({ + type: types.HISTORY_BACK, + }); + }; +} + +export function doHistoryBackCompleted() { + return function(dispatch, getState) { + dispatch({ + type: types.HISTORY_BACK_COMPLETED, + }); }; } diff --git a/ui/js/constants/action_types.js b/ui/js/constants/action_types.js index 216c84762..eca5dc928 100644 --- a/ui/js/constants/action_types.js +++ b/ui/js/constants/action_types.js @@ -2,6 +2,7 @@ export const CHANGE_PATH = "CHANGE_PATH"; export const OPEN_MODAL = "OPEN_MODAL"; export const CLOSE_MODAL = "CLOSE_MODAL"; export const HISTORY_BACK = "HISTORY_BACK"; +export const HISTORY_BACK_COMPLETED = "HISTORY_BACK_COMPLETED"; export const SHOW_SNACKBAR = "SHOW_SNACKBAR"; export const REMOVE_SNACKBAR_SNACK = "REMOVE_SNACKBAR_SNACK"; export const WINDOW_FOCUSED = "WINDOW_FOCUSED"; diff --git a/ui/js/page/discover/index.js b/ui/js/page/discover/index.js index be49b892d..eb8d4d0bc 100644 --- a/ui/js/page/discover/index.js +++ b/ui/js/page/discover/index.js @@ -1,20 +1,24 @@ import React from "react"; import { connect } from "react-redux"; +import { doHistoryBackCompleted } from "actions/app"; import { doFetchFeaturedUris, doCancelAllResolvingUris } from "actions/content"; import { selectFeaturedUris, selectFetchingFeaturedUris, } from "selectors/content"; +import { selectNavigatingBack } from "selectors/app"; import DiscoverPage from "./view"; const select = state => ({ featuredUris: selectFeaturedUris(state), fetchingFeaturedUris: selectFetchingFeaturedUris(state), + isNavigatingBack: selectNavigatingBack(state), }); const perform = dispatch => ({ fetchFeaturedUris: () => dispatch(doFetchFeaturedUris()), cancelResolvingUris: () => dispatch(doCancelAllResolvingUris()), + finishedNavigatingBack: () => dispatch(doHistoryBackCompleted()), }); export default connect(select, perform)(DiscoverPage); diff --git a/ui/js/page/discover/view.jsx b/ui/js/page/discover/view.jsx index b68d026b9..ea3e7b858 100644 --- a/ui/js/page/discover/view.jsx +++ b/ui/js/page/discover/view.jsx @@ -1,9 +1,9 @@ import React from "react"; +import lbry from "lbry.js"; import lbryio from "lbryio.js"; import lbryuri from "lbryuri"; import FileCard from "component/fileCard"; import { BusyMessage } from "component/common.js"; -import { setSession, getSession } from "utils"; import ToolTip from "component/tooltip.js"; const FeaturedCategory = props => { @@ -42,18 +42,22 @@ class DiscoverPage extends React.PureComponent { } componentDidMount() { - const scrollY = parseInt(getSession("prefs_scrolly")); - if (!isNaN(scrollY)) { - const restoreScrollPosition = () => { - window.scrollTo(0, scrollY); - }; - setTimeout(restoreScrollPosition, 100); + if (this.props.isNavigatingBack) { + const scrollY = parseInt(lbry.getClientSetting("prefs_scrolly")); + if (!isNaN(scrollY)) { + const restoreScrollPosition = () => { + window.scrollTo(0, scrollY); + }; + setTimeout(restoreScrollPosition, 100); + } + + this.props.finishedNavigatingBack(); } window.addEventListener("scroll", this.scrollListener); } handleScroll() { - setSession("prefs_scrolly", window.scrollY); + lbry.setClientSetting("prefs_scrolly", window.scrollY); } componentWillUnmount() { diff --git a/ui/js/reducers/app.js b/ui/js/reducers/app.js index fe8c9adae..f2c50d2ec 100644 --- a/ui/js/reducers/app.js +++ b/ui/js/reducers/app.js @@ -141,6 +141,18 @@ reducers[types.WINDOW_FOCUSED] = function(state, action) { }); }; +reducers[types.HISTORY_BACK] = function(state, action) { + return Object.assign({}, state, { + navigatingBack: true, + }); +}; + +reducers[types.HISTORY_BACK_COMPLETED] = function(state, action) { + return Object.assign({}, state, { + navigatingBack: false, + }); +}; + export default function reducer(state = defaultState, action) { const handler = reducers[action.type]; if (handler) return handler(state, action); diff --git a/ui/js/selectors/app.js b/ui/js/selectors/app.js index f6acd6d07..c36ccc18c 100644 --- a/ui/js/selectors/app.js +++ b/ui/js/selectors/app.js @@ -191,3 +191,8 @@ export const selectBadgeNumber = createSelector( _selectState, state => state.badgeNumber ); + +export const selectNavigatingBack = createSelector( + _selectState, + state => state.navigatingBack +); From d07a0bd8ad974c1c3f1cae1e5f45cb12ce8afc5f Mon Sep 17 00:00:00 2001 From: hackrush Date: Sun, 16 Jul 2017 15:35:57 +0530 Subject: [PATCH 04/14] A quick fix for oscuring cards for nsfw content. The download cards in page were not obscured when opening a link directly(e.g. lbry://jacki2). --- ui/js/page/filePage/index.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/ui/js/page/filePage/index.js b/ui/js/page/filePage/index.js index f6629214c..ec151ab50 100644 --- a/ui/js/page/filePage/index.js +++ b/ui/js/page/filePage/index.js @@ -25,7 +25,7 @@ const makeSelect = () => { contentType: selectContentType(state, props), costInfo: selectCostInfo(state, props), metadata: selectMetadata(state, props), - showNsfw: !selectShowNsfw(state), + obscureNsfw: !selectShowNsfw(state), fileInfo: selectFileInfo(state, props), }); From 0854fb70045e00d235b385d745e90fd72fc1469a Mon Sep 17 00:00:00 2001 From: Akinwale Ariwodola Date: Mon, 17 Jul 2017 15:50:07 +0100 Subject: [PATCH 05/14] Discover page UI tweaks --- ui/js/component/fileCard/view.jsx | 4 ++-- ui/scss/component/_card.scss | 11 ++++++++--- 2 files changed, 10 insertions(+), 5 deletions(-) diff --git a/ui/js/component/fileCard/view.jsx b/ui/js/component/fileCard/view.jsx index 5a35d740d..12f0218e2 100644 --- a/ui/js/component/fileCard/view.jsx +++ b/ui/js/component/fileCard/view.jsx @@ -78,8 +78,9 @@ class FileCard extends React.PureComponent { onClick={() => navigate("/show", { uri })} className="card__link" > +
-
+
{title}
@@ -92,7 +93,6 @@ class FileCard extends React.PureComponent {
-
{description}
diff --git a/ui/scss/component/_card.scss b/ui/scss/component/_card.scss index da73b21bd..72032fbb4 100644 --- a/ui/scss/component/_card.scss +++ b/ui/scss/component/_card.scss @@ -28,6 +28,9 @@ $padding-card-horizontal: $spacing-vertical * 2/3; margin-top: $spacing-vertical * 1/3; margin-bottom: $spacing-vertical * 1/3; } +.card__title-identity .card__title { + font-size: 0.95em +} .card__actions { padding: 0 $padding-card-horizontal; } @@ -51,8 +54,8 @@ $padding-card-horizontal: $spacing-vertical * 2/3; color: #444; margin-top: 12px; font-size: 0.9em; - margin-top: $spacing-vertical * 2/3; - margin-bottom: $spacing-vertical * 2/3; + margin-top: $spacing-vertical * 1/3; + margin-bottom: $spacing-vertical * 1/3; padding: 0 $padding-card-horizontal; } .card__subtext--allow-newlines { @@ -60,6 +63,8 @@ $padding-card-horizontal: $spacing-vertical * 2/3; } .card__subtext--two-lines { height: $font-size * 0.9 * $font-line-height * 2; + font-size: 0.82em; + color: #515151 } .card-overlay { position: absolute; @@ -144,7 +149,7 @@ $card-link-scaling: 1.1; top: 36% } -$width-card-small: $spacing-vertical * 12; +$width-card-small: $spacing-vertical * 10; $height-card-small: $spacing-vertical * 15; .card--small { From 95c5ddbfda155d0e87678418622a51429f974ed5 Mon Sep 17 00:00:00 2001 From: 6ea86b96 <6ea86b96@gmail.com> Date: Tue, 18 Jul 2017 13:45:00 +0700 Subject: [PATCH 06/14] Fix hiding price input when free is checked on publish form --- ui/js/component/publishForm/view.jsx | 10 ++++------ 1 file changed, 4 insertions(+), 6 deletions(-) diff --git a/ui/js/component/publishForm/view.jsx b/ui/js/component/publishForm/view.jsx index da6e6eb39..4d765e6d6 100644 --- a/ui/js/component/publishForm/view.jsx +++ b/ui/js/component/publishForm/view.jsx @@ -42,6 +42,7 @@ class PublishForm extends React.PureComponent { submitting: false, creatingChannel: false, modal: null, + isFee: false, }; } @@ -635,11 +636,8 @@ class PublishForm extends React.PureComponent { label={__("Free")} type="radio" name="isFree" - value="1" - onChange={() => { - this.handleFeePrefChange(false); - }} - defaultChecked={!this.state.isFee} + onChange={() => this.handleFeePrefChange(false)} + checked={!this.state.isFee} /> { this.handleFeePrefChange(true); }} - defaultChecked={this.state.isFee} + checked={this.state.isFee} /> Date: Tue, 18 Jul 2017 13:53:45 +0700 Subject: [PATCH 07/14] Fix hiding new channel fields on publish form --- ui/js/component/publishForm/internal/channelSection.jsx | 7 +++---- 1 file changed, 3 insertions(+), 4 deletions(-) diff --git a/ui/js/component/publishForm/internal/channelSection.jsx b/ui/js/component/publishForm/internal/channelSection.jsx index 6c7802625..76f442af1 100644 --- a/ui/js/component/publishForm/internal/channelSection.jsx +++ b/ui/js/component/publishForm/internal/channelSection.jsx @@ -93,6 +93,7 @@ class ChannelSection extends React.PureComponent { "This LBC remains yours and the deposit can be undone at any time." ); + const channel = this.state.addingChannel ? "new" : this.props.channel; const { fetchingChannels, channels = [] } = this.props; let channelContent = []; @@ -102,7 +103,7 @@ class ChannelSection extends React.PureComponent { type="select" tabIndex="1" onChange={this.handleChannelChange.bind(this)} - value={this.props.channel} + value={channel} >