diff --git a/app/components/App.scss b/app/components/App.scss index 1a67ef86..4734ec44 100644 --- a/app/components/App.scss +++ b/app/components/App.scss @@ -195,3 +195,7 @@ HTML { display: none; } } + +.reveal-blurring { + backdrop-filter: blur(8px); +} diff --git a/app/components/cards/PostSummary.jsx b/app/components/cards/PostSummary.jsx index 197485d9..02544a8c 100644 --- a/app/components/cards/PostSummary.jsx +++ b/app/components/cards/PostSummary.jsx @@ -29,6 +29,7 @@ import { authRegisterUrl, } from 'app/utils/AuthApiClient' import { hideSummary } from 'app/utils/ContentAccess' import extractContent from 'app/utils/ExtractContent' import {authorNameAndRep} from 'app/utils/ComponentFormatters' +import { randomString } from 'app/utils/helpers' import { addHighlight, unsubscribePost } from 'app/utils/NotifyApiClient' import { detransliterate } from 'app/utils/ParsersAndFormatters' import { proxifyImageUrl } from 'app/utils/ProxifyUrl' @@ -150,7 +151,7 @@ class PostSummary extends React.Component { const {currentCategory, thumbSize, onClick} = this.props; const {post, content, pending_payout, total_payout, cashout_time, blockEye} = this.props; const {account} = this.props; - const {nsfwPref, username} = this.props + const {nsfwPref, username, loginBlurring} = this.props if (!content) return null; let reblogged_by; @@ -225,6 +226,11 @@ class PostSummary extends React.Component { comments_link = p.link + '#comments'; } + if (loginBlurring) { + title_text = randomString(title_text) + desc = randomString(desc) + } + if (title_link_url.includes('fm-') && $STM_Config.forums) { let parts = title_link_url.split('/'); for (let [_id, forum] of Object.entries($STM_Config.forums)) { @@ -442,9 +448,12 @@ export default connect( const stats = content.get('stats', Map()).toJS() gray = stats.gray } + const loginDefault = state.user.get('loginDefault') + const loginBlurring = loginDefault && loginDefault.get('blurring') return { post, content, gray, pending_payout, total_payout, event_count, encrypted, - username: state.user.getIn(['current', 'username']) || state.offchain.get('account') + username: state.user.getIn(['current', 'username']) || state.offchain.get('account'), + loginBlurring }; }, diff --git a/app/components/modules/Modals.jsx b/app/components/modules/Modals.jsx index 547d18a4..d51bb37a 100644 --- a/app/components/modules/Modals.jsx +++ b/app/components/modules/Modals.jsx @@ -47,7 +47,7 @@ class Modals extends React.Component { this.shouldComponentUpdate = shouldComponentUpdate(this, 'Modals'); } - onLoginBackdropClick = (e) => { + onLoginTryClose = (e) => { const { loginUnclosable } = this.props; if (loginUnclosable) throw new Error('Closing login modal is forbidden here'); @@ -56,6 +56,7 @@ class Modals extends React.Component { render() { const { show_login_modal, + loginBlurring, show_confirm_modal, show_donate_modal, show_gift_nft_modal, @@ -84,9 +85,11 @@ class Modals extends React.Component { return n; }) : []; + const loginClass = loginBlurring ? 'reveal-blurring' : undefined + return (
- {show_login_modal && + {show_login_modal && } {show_confirm_modal && @@ -129,9 +132,11 @@ export default connect( state => { const loginDefault = state.user.get('loginDefault'); const loginUnclosable = loginDefault && loginDefault.get('unclosable'); + const loginBlurring = loginDefault && loginDefault.get('blurring') return { show_login_modal: state.user.get('show_login_modal'), loginUnclosable, + loginBlurring, show_confirm_modal: state.transaction.get('show_confirm_modal'), show_donate_modal: state.user.get('show_donate_modal'), show_gift_nft_modal: state.user.get('show_gift_nft_modal'), diff --git a/app/redux/User.js b/app/redux/User.js index 49c4c5c5..240099af 100644 --- a/app/redux/User.js +++ b/app/redux/User.js @@ -33,6 +33,20 @@ export default createModule({ name: 'user', initialState: defaultState, transformations: [ + { + action: 'REQUIRE_LOGIN', + reducer: (state, {payload}) => { + console.log('ACT-----') + return state.merge({ + show_login_modal: true, + loginDefault: { + unclosable: true, + cancelIsRegister: true, + blurring: true + } + }) + } + }, { action: 'SHOW_LOGIN', reducer: (state, {payload}) => { diff --git a/app/utils/helpers.js b/app/utils/helpers.js index 4d79d5d6..ec3d88e7 100644 --- a/app/utils/helpers.js +++ b/app/utils/helpers.js @@ -1,3 +1,18 @@ +export function randomString(str) { + let res = '' + const abc = 'abcdefghijklmnopqrstuvwxz' + for (let i = 0; i < str.length; ++i) { + const c = str[i] + if (c === ' ') { + res += c + continue + } + const nc = abc[Math.floor(Math.random() * abc.length)] + res += nc + } + return res +} + export function encode(str) { let hash = 0, chr; if (str.length === 0) return hash; diff --git a/server/index.js b/server/index.js index c325c4a3..39d07941 100755 --- a/server/index.js +++ b/server/index.js @@ -52,6 +52,7 @@ global.$STM_Config = { forums: config.get('forums'), blocked_users, blocked_posts, + authorization_required: config.has('authorization_required') && config.get('authorization_required'), ui_version: version || '1.0-unknown', }; diff --git a/shared/UniversalRender.jsx b/shared/UniversalRender.jsx index ffa71cfa..2236b97a 100644 --- a/shared/UniversalRender.jsx +++ b/shared/UniversalRender.jsx @@ -11,7 +11,6 @@ import { match, applyRouterMiddleware } from 'react-router'; -import * as api from 'app/utils/APIWrapper' import { Provider } from 'react-redux'; import RootRoute from 'app/RootRoute'; import {createStore, applyMiddleware, compose} from 'redux'; @@ -19,6 +18,8 @@ import { browserHistory } from 'react-router'; import { useScroll } from 'react-router-scroll'; import createSagaMiddleware from 'redux-saga'; import { syncHistoryWithStore } from 'react-router-redux'; + +import * as api from 'app/utils/APIWrapper' import rootReducer from 'app/redux/RootReducer'; import rootSaga from 'app/redux/RootSaga'; import {component as NotFound} from 'app/components/pages/NotFound'; @@ -26,6 +27,7 @@ import extractMeta from 'app/utils/ExtractMeta'; import Translator from 'app/Translator'; import getState from 'app/utils/StateBuilder'; import {routeRegex} from "app/ResolveRoute"; +import session from 'app/utils/session' import {contentStats} from 'app/utils/StateFunctions' import {APP_NAME, SEO_TITLE} from 'app/client_config'; import constants from 'app/redux/constants'; @@ -80,6 +82,9 @@ export async function serverRender({ if (process.env.BROWSER) { const store = createStore(rootReducer, initial_state, middleware); + if (!session.load().currentName && $STM_Config.authorization_required) { + store.dispatch({type: 'user/REQUIRE_LOGIN', payload: {}}); + } // sagaMiddleware.run(PollDataSaga).done // .then(() => console.log('PollDataSaga is finished')) // .catch(err => console.log('PollDataSaga is finished with error', err)); @@ -161,6 +166,9 @@ export async function serverRender({ offchain.server_location = location; serverStore = createStore(rootReducer, { global: onchain, offchain}); + if (!offchain.account && $STM_Config.authorization_required) { + serverStore.dispatch({type: 'user/REQUIRE_LOGIN', payload: {}}); + } serverStore.dispatch({type: '@@router/LOCATION_CHANGE', payload: {pathname: location}}); // TODO: maybe use request to golosnotify to fetch counters? /*if (offchain.account) { @@ -221,6 +229,9 @@ export async function serverRender({ export function clientRender(initialState) { const store = createStore(rootReducer, initialState, middleware); + if (!session.load().currentName && $STM_Config.authorization_required) { + store.dispatch({type: 'user/REQUIRE_LOGIN', payload: {}}); + } sagaMiddleware.run(rootSaga) const history = syncHistoryWithStore(browserHistory, store);