evan/rats-search
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat(search): moved search to header (now search are always on)

Browse Source
This commit is contained in:
Alexey Kasyanchuk
2018-05-05 18:33:14 +03:00
parent 0e9c0e4411
commit 31a6a44184
3 changed files with 100 additions and 111 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
src/app/header.js
View File

@ -2,6 +2,7 @@ import React from 'react';
import {Card, CardActions, CardHeader, CardMedia, CardTitle, CardText} from 'material-ui/Card';
import Background from './images/pirate-mod.jpg'
import RaisedButton from 'material-ui/RaisedButton';
import Search from './search'
class Header extends React.Component {
constructor(props)
@ -249,7 +250,15 @@ class Header extends React.Component {
{
((window.currentWindow && !window.currentWindow.isModal()) || typeof WEB !== 'undefined')
&&
<div className='fs0-85 pad0-75 column peers-status' style={{marginLeft: 'auto', marginTop: '-10px', color: window.peers > 0 ? '#42f445' : 'white'}}>
<div className='fs0-85 pad0-75 column peers-status' style={{
marginLeft: 'auto',
marginTop: '-10px',
color: window.peers > 0 ? '#42f445' : 'white',
backgroundColor: 'white',
zIndex: 2
}}>
<Search />
<div>rats peers: {window.peers} [{window.peersTorrents} torrents] {window.peers > 0 ? ' (p2p rats search enabled)' : ' (p2p rats search not available at this moment)'}</div>
{
window.p2pStatus == 0

74
src/app/index-page.js
View File

@ -2,17 +2,89 @@ import React from 'react';
import Page from './page';
import RecentTorrents from './recent-torrents'
import SearchResults from './search-results'
import Search from './search'
import SelectField from 'material-ui/SelectField';
import MenuItem from 'material-ui/MenuItem';
export default class IndexPage extends Page {
constructor(props) {
super(props)
this.setTitle('Rats On The Boat - Content Search Engine');
}
componentDidMount()
{
Search.instance().onSearchUpdate = () => this.forceUpdate()
}
componentWillUnmount()
{
Search.instance().onSearchUpdate = () => {}
}
render() {
const orderText = (text, field) => {
if(field !== Search.instance().state.orderBy)
return text;
if(Search.instance().state.orderDesc)
return text + ' ⇩'
else
return text + ' ⇧'
}
return (
<div id='index-window'>
<Search />
<SearchResults
torrentsSearchResults={Search.instance().searchTorrents}
filesSearchResults={Search.instance().searchFiles}
currentSearching={Search.instance().state.searchingIndicator}
searchText={Search.instance().currentSearch}
resultSelector={
<SelectField
floatingLabelText="Sort by"
floatingLabelFixed={true}
value={Search.instance().state.orderBy}
onChange={(event, index, value) => {
event.preventDefault(); // fix overclick on torrent
if(value === 'none') {
Search.instance().setState({orderBy: null}, () => {
Search.instance().search(true)
})
return;
}
if(value === Search.instance().state.orderBy)
{
Search.instance().setState({orderDesc: !Search.instance().state.orderDesc}, () => {
Search.instance().search(true)
})
return;
}
Search.instance().setState({
orderBy: value,
orderDesc: (value === 'seeders' || value === 'completed' || value === 'added') ? true : Search.instance().state.orderDesc
}, () => {
Search.instance().search(true)
})
}}
>
<MenuItem value='none' primaryText={'None'} />
<MenuItem value='seeders' primaryText={orderText('Seeders', 'seeders')} />
<MenuItem value='name' primaryText={orderText('Name', 'name')} />
<MenuItem value='files' primaryText={orderText('Files', 'files')} />
<MenuItem value='size' primaryText={orderText('Size', 'size')} />
<MenuItem value='added' primaryText={orderText('Added date', 'added')} />
<MenuItem value='completed' primaryText={orderText('Completed', 'completed')} />
</SelectField>
}
moreTorrentsEnabled={Search.instance().moreSearchTorrents && !Search.instance().state.searchingIndicator}
moreFilesEnabled={Search.instance().moreSearchFiles && !Search.instance().state.searchingIndicator}
onMoreTorrents={() => Search.instance().moreTorrents()}
onMoreFiles={() => Search.instance().moreFiles()}
moreTorrentsIndicator={Search.instance().state.moreTorrentsIndicator}
moreFilesIndicator={Search.instance().state.moreFilesIndicator}
/>
<div className='column center w100p pad0-75'>
<RecentTorrents />
</div>

126
src/app/search.js
View File

@ -1,6 +1,5 @@
import React, { Component } from 'react';
import SearchResults from './search-results'
import AdvancedSearch from './search-advanced-controls'
import TextField from 'material-ui/TextField';
import RaisedButton from 'material-ui/RaisedButton';
@ -12,20 +11,16 @@ import VisibilityOff from 'material-ui/svg-icons/action/visibility-off';
import AddIcon from 'material-ui/svg-icons/content/add';
import RemoveIcon from 'material-ui/svg-icons/content/remove';
import SelectField from 'material-ui/SelectField';
import MenuItem from 'material-ui/MenuItem';
import formatBytes from './format-bytes'
import _ from 'lodash'
let session;
import singleton from './singleton';
class TorrentsStatistic extends Component {
constructor(props)
{
super(props)
this.stats = props.stats || {}
}
componentDidMount()
@ -52,10 +47,12 @@ class TorrentsStatistic extends Component {
}
}
export default class Search extends Component {
class Search extends Component {
constructor(props)
{
super(props)
this.onSearchUpdate = () => {}
this.state = {
searchingIndicator: false,
safeSearchText: 'safe search enabled',
@ -69,28 +66,14 @@ export default class Search extends Component {
this.searchLimit = 10
this.advanced = {}
this.searchError = undefined;
if(session)
{
this.searchTorrents = session.searchTorrents;
this.searchFiles = session.searchFiles;
this.moreSearchTorrents = session.moreSearchTorrents;
this.moreSearchFiles = session.moreSearchFiles;
this.currentSearch = session.currentSearch;
this.searchValue = session.searchValue;
Object.assign(this.state, this.setSafeSearch(session.notSafeSearch))
this.state.orderBy = session.orderBy;
this.state.orderDesc = session.orderDesc;
this.state.advancedSearch = session.advancedSearch;
this.advanced = session.advanced;
this.searchError = session.searchError;
}
}
search(oldSearch) {
this.setState({
searchingIndicator: true
});
this.onSearchUpdate('indicator')
this.searchTorrents = [];
this.moreSearchTorrents = true;
this.searchFiles = [];
@ -120,9 +103,8 @@ export default class Search extends Component {
this.setState({
searchingIndicator: false
});
} else {
this.forceUpdate();
}
this.onSearchUpdate('torrents')
}));
let searchFilesParams = {
limit: this.searchLimit,
@ -135,7 +117,6 @@ export default class Search extends Component {
window.torrentSocket.emit('searchFiles', oldSearch ? this.currentSearch : this.searchValue, searchFilesParams, window.customLoader((torrents) => {
if(torrents) {
console.log('back torrents')
this.searchFiles = torrents;
let files = 0;
torrents.forEach((torrent) => {
@ -153,13 +134,13 @@ export default class Search extends Component {
this.setState({
searchingIndicator: false
});
} else {
this.forceUpdate();
}
this.onSearchUpdate('files')
}));
}
moreTorrents() {
this.setState({moreTorrentsIndicator: true});
this.onSearchUpdate('indicator')
window.torrentSocket.emit('searchTorrent', this.currentSearch, {
index: this.searchTorrents.length,
@ -169,12 +150,12 @@ export default class Search extends Component {
orderDesc: this.state.orderDesc,
}, window.customLoader((torrents) => {
if(torrents) {
console.log('back torrents')
this.searchTorrents = this.searchTorrents.concat(torrents);
if(torrents.length != this.searchLimit)
this.moreSearchTorrents = false;
this.setState({moreTorrentsIndicator: false});
this.onSearchUpdate('more torrents')
}
}));
}
@ -186,6 +167,7 @@ export default class Search extends Component {
});
this.setState({moreFilesIndicator: true});
this.onSearchUpdate('indicator')
window.torrentSocket.emit('searchFiles', this.currentSearch, {
index: index,
@ -207,6 +189,7 @@ export default class Search extends Component {
this.mergeFiles()
this.setState({moreFilesIndicator: false});
this.onSearchUpdate('more files')
}
}));
}
@ -245,7 +228,7 @@ export default class Search extends Component {
if(!torrents)
return
this.searchTorrents = _.unionBy(this.searchTorrents, torrents, 'hash')
this.forceUpdate();
this.onSearchUpdate('remote torrents')
}
window.torrentSocket.on('remoteSearchTorrent', this.remoteSearchTorrent);
@ -254,7 +237,7 @@ export default class Search extends Component {
return
this.searchFiles = _.unionBy(this.searchFiles, torrents, 'hash')
this.mergeFiles()
this.forceUpdate();
this.onSearchUpdate('remote files')
}
window.torrentSocket.on('remoteSearchFiles', this.remoteSearchFiles);
}
@ -268,21 +251,6 @@ export default class Search extends Component {
if(this.remoteSearchFiles)
window.torrentSocket.off('remoteSearchFiles', this.remoteSearchFiles);
session = {
searchTorrents: this.searchTorrents,
searchFiles: this.searchFiles,
moreSearchTorrents: this.moreSearchTorrents,
moreSearchFiles: this.moreSearchFiles,
currentSearch: this.currentSearch,
searchValue: this.searchValue,
notSafeSearch: this.notSafeSearch,
orderBy: this.state.orderBy,
orderDesc: this.state.orderDesc,
advancedSearch: this.state.advancedSearch,
advanced: this.advanced,
searchError: this.searchError,
}
}
setSafeSearch(ch) {
this.notSafeSearch = ch;
@ -303,16 +271,6 @@ export default class Search extends Component {
},
};
const orderText = (text, field) => {
if(field !== this.state.orderBy)
return text;
if(this.state.orderDesc)
return text + ' ⇩'
else
return text + ' ⇧'
}
return (
<div className="column w100p center">
<div className='row inline w100p pad0-75' style={{maxWidth: '30em'}}>
@ -399,59 +357,9 @@ export default class Search extends Component {
:
null
}
<SearchResults
torrentsSearchResults={this.searchTorrents}
filesSearchResults={this.searchFiles}
currentSearching={this.state.searchingIndicator}
searchText={this.currentSearch}
resultSelector={
<SelectField
floatingLabelText="Sort by"
floatingLabelFixed={true}
value={this.state.orderBy}
onChange={(event, index, value) => {
event.preventDefault(); // fix overclick on torrent
if(value === 'none') {
this.setState({orderBy: null}, () => {
this.search(true)
})
return;
}
if(value === this.state.orderBy)
{
this.setState({orderDesc: !this.state.orderDesc}, () => {
this.search(true)
})
return;
}
this.setState({
orderBy: value,
orderDesc: (value === 'seeders' || value === 'completed' || value === 'added') ? true : this.state.orderDesc
}, () => {
this.search(true)
})
}}
>
<MenuItem value='none' primaryText={'None'} />
<MenuItem value='seeders' primaryText={orderText('Seeders', 'seeders')} />
<MenuItem value='name' primaryText={orderText('Name', 'name')} />
<MenuItem value='files' primaryText={orderText('Files', 'files')} />
<MenuItem value='size' primaryText={orderText('Size', 'size')} />
<MenuItem value='added' primaryText={orderText('Added date', 'added')} />
<MenuItem value='completed' primaryText={orderText('Completed', 'completed')} />
</SelectField>
}
moreTorrentsEnabled={this.moreSearchTorrents && !this.state.searchingIndicator}
moreFilesEnabled={this.moreSearchFiles && !this.state.searchingIndicator}
onMoreTorrents={() => this.moreTorrents()}
onMoreFiles={() => this.moreFiles()}
moreTorrentsIndicator={this.state.moreTorrentsIndicator}
moreFilesIndicator={this.state.moreFilesIndicator}
/>
</div>
);
}
}
export default singleton(Search)