Fix NSFW blurring on search and make search show/hide smarter
This commit is contained in:
parent
1d16c73cf4
commit
e1d23667bc
9 changed files with 63 additions and 4 deletions
|
@ -45,3 +45,15 @@ export function doSearchContent(query) {
|
|||
})
|
||||
}
|
||||
}
|
||||
|
||||
export function doActivateSearch() {
|
||||
return {
|
||||
type: types.ACTIVATE_SEARCH,
|
||||
}
|
||||
}
|
||||
|
||||
export function doDeactivateSearch() {
|
||||
return {
|
||||
type: types.DEACTIVATE_SEARCH,
|
||||
}
|
||||
}
|
||||
|
|
|
@ -35,7 +35,7 @@ const makeSelect = () => {
|
|||
fileInfo: selectFileInfoForUri(state, props),
|
||||
fetchingAvailability: selectFetchingAvailabilityForUri(state, props),
|
||||
selectAvailabilityForUri: selectAvailabilityForUri(state, props),
|
||||
obscureNswf: selectObscureNsfw(state),
|
||||
obscureNsfw: selectObscureNsfw(state),
|
||||
metadata: selectMetadataForUri(state, props),
|
||||
source: selectSourceForUri(state, props),
|
||||
})
|
||||
|
|
|
@ -75,7 +75,13 @@ class FileTileStream extends React.Component {
|
|||
<section className={ 'file-tile card ' + (obscureNsfw ? 'card--obscured ' : '') } onMouseEnter={this.handleMouseOver.bind(this)} onMouseLeave={this.handleMouseOut.bind(this)}>
|
||||
<div className={"row-fluid card__inner file-tile__row"}>
|
||||
<div className="span3 file-tile__thumbnail-container">
|
||||
<a href="#" onClick={() => navigate(`show=${uri}`)}><Thumbnail className="file-tile__thumbnail" {... metadata && metadata.thumbnail ? {src: metadata.thumbnail} : {}} alt={'Photo for ' + this.props.uri} /></a>
|
||||
<a href="#" onClick={() => navigate(`show=${uri}`)}>
|
||||
{metadata && metadata.thumbnail ?
|
||||
<Thumbnail key={this.props.uri} className="file-tile__thumbnail" src={metadata.thumbnail} alt={'Photo for ' + this.props.uri} />
|
||||
:
|
||||
<Thumbnail className="file-tile__thumbnail" alt={'Photo for ' + this.props.uri} />
|
||||
}
|
||||
</a>
|
||||
</div>
|
||||
<div className="span9">
|
||||
<div className="card__title-primary">
|
||||
|
|
|
@ -11,6 +11,8 @@ import {
|
|||
} from 'actions/app'
|
||||
import {
|
||||
doSearchContent,
|
||||
doActivateSearch,
|
||||
doDeactivateSearch,
|
||||
} from 'actions/search'
|
||||
import Header from './view'
|
||||
|
||||
|
@ -22,6 +24,8 @@ const select = (state) => ({
|
|||
const perform = (dispatch) => ({
|
||||
navigate: (path) => dispatch(doNavigate(path)),
|
||||
search: (query) => dispatch(doSearchContent(query)),
|
||||
activateSearch: () => dispatch(doActivateSearch()),
|
||||
deactivateSearch: () => setTimeout(() => { dispatch(doDeactivateSearch()) }, 10),
|
||||
})
|
||||
|
||||
export default connect(select, perform)(Header)
|
||||
|
|
|
@ -5,8 +5,6 @@ export const CLOSE_MODAL = 'CLOSE_MODAL'
|
|||
export const OPEN_DRAWER = 'OPEN_DRAWER'
|
||||
export const CLOSE_DRAWER = 'CLOSE_DRAWER'
|
||||
|
||||
export const START_SEARCH = 'START_SEARCH'
|
||||
|
||||
export const DAEMON_READY = 'DAEMON_READY'
|
||||
|
||||
// Upgrades
|
||||
|
@ -63,3 +61,5 @@ export const DELETE_FILE_COMPLETED = 'DELETE_FILE_COMPLETED'
|
|||
export const SEARCH_STARTED = 'SEARCH_STARTED'
|
||||
export const SEARCH_COMPLETED = 'SEARCH_COMPLETED'
|
||||
export const SEARCH_CANCELLED = 'SEARCH_CANCELLED'
|
||||
export const ACTIVATE_SEARCH = 'ACTIVATE_SEARCH'
|
||||
export const DEACTIVATE_SEARCH = 'DEACTIVATE_SEARCH'
|
||||
|
|
|
@ -12,6 +12,7 @@ import {
|
|||
selectIsSearching,
|
||||
selectSearchQuery,
|
||||
selectCurrentSearchResults,
|
||||
selectSearchActivated,
|
||||
} from 'selectors/search'
|
||||
import DiscoverPage from './view'
|
||||
|
||||
|
@ -20,6 +21,7 @@ const select = (state) => ({
|
|||
isSearching: selectIsSearching(state),
|
||||
query: selectSearchQuery(state),
|
||||
results: selectCurrentSearchResults(state),
|
||||
searchActive: selectSearchActivated(state),
|
||||
})
|
||||
|
||||
const perform = (dispatch) => ({
|
||||
|
|
|
@ -61,4 +61,22 @@ let DiscoverPage = React.createClass({
|
|||
}
|
||||
})
|
||||
|
||||
// const DiscoverPage = (props) => {
|
||||
// const {
|
||||
// isSearching,
|
||||
// query,
|
||||
// results,
|
||||
// searchActive,
|
||||
// } = props
|
||||
//
|
||||
// return (
|
||||
// <main>
|
||||
// { (!searchActive || (!isSearching && !query)) && <FeaturedContent {...props} /> }
|
||||
// { searchActive && isSearching ? <SearchActive /> : null }
|
||||
// { searchActive && !isSearching && query && results.length ? <SearchResults results={results} /> : null }
|
||||
// { searchActive && !isSearching && query && !results.length ? <SearchNoResults query={query} /> : null }
|
||||
// </main>
|
||||
// );
|
||||
// }
|
||||
|
||||
export default DiscoverPage;
|
|
@ -41,6 +41,18 @@ reducers[types.SEARCH_CANCELLED] = function(state, action) {
|
|||
})
|
||||
}
|
||||
|
||||
reducers[types.ACTIVATE_SEARCH] = function(state, action) {
|
||||
return Object.assign({}, state, {
|
||||
activated: true,
|
||||
})
|
||||
}
|
||||
|
||||
reducers[types.DEACTIVATE_SEARCH] = function(state, action) {
|
||||
return Object.assign({}, state, {
|
||||
activated: false,
|
||||
})
|
||||
}
|
||||
|
||||
export default function reducer(state = defaultState, action) {
|
||||
const handler = reducers[action.type];
|
||||
if (handler) return handler(state, action);
|
||||
|
|
|
@ -27,3 +27,8 @@ export const selectCurrentSearchResults = createSelector(
|
|||
selectSearchResultsByQuery,
|
||||
(query, byQuery) => byQuery[query] || []
|
||||
)
|
||||
|
||||
export const selectSearchActivated = createSelector(
|
||||
_selectState,
|
||||
(state) => !!state.activated
|
||||
)
|
||||
|
|
Loading…
Reference in a new issue