fix eslint
This commit is contained in:
Alexey Kasyanchuk
@ -12,171 +12,171 @@ import {Tabs, Tab} from 'material-ui/Tabs';
|
||||
import _ from 'lodash'
|
||||
|
||||
export default class TopPage extends Page {
|
||||
constructor(props) {
|
||||
super(props)
|
||||
this.setTitle('Rats On The Boat - Torrents top');
|
||||
this.topTorrents = {};
|
||||
this.types = ['main', 'video', 'audio', 'books', 'pictures', 'application', 'archive']
|
||||
this.descriptions = {
|
||||
main: __('All'),
|
||||
video: __('Video'),
|
||||
audio: __('Audio/Music'),
|
||||
books: __('Books'),
|
||||
pictures: __('Pictures/Images'),
|
||||
application: __('Apps/Games'),
|
||||
archive: __('Archives')
|
||||
}
|
||||
this.times = {
|
||||
overall: __('Overall'),
|
||||
hours: __('Last hour'),
|
||||
week: __('Last week'),
|
||||
month: __('Last month')
|
||||
}
|
||||
this.state = {type: 'main', time: 'overall'}
|
||||
}
|
||||
loadMoreTorrents(type, time)
|
||||
{
|
||||
time = time ? time : this.state.time
|
||||
window.torrentSocket.emit('topTorrents',
|
||||
type == 'main' ? null : type,
|
||||
{index: (this.topTorrents[type] && this.topTorrents[type][time] && this.topTorrents[type][time].length) || 0, time},
|
||||
window.customLoader((data) => {
|
||||
if(!this.topTorrents[type])
|
||||
this.topTorrents[type] = {}
|
||||
if(!this.topTorrents[type][time])
|
||||
this.topTorrents[type][time] = []
|
||||
constructor(props) {
|
||||
super(props)
|
||||
this.setTitle('Rats On The Boat - Torrents top');
|
||||
this.topTorrents = {};
|
||||
this.types = ['main', 'video', 'audio', 'books', 'pictures', 'application', 'archive']
|
||||
this.descriptions = {
|
||||
main: __('All'),
|
||||
video: __('Video'),
|
||||
audio: __('Audio/Music'),
|
||||
books: __('Books'),
|
||||
pictures: __('Pictures/Images'),
|
||||
application: __('Apps/Games'),
|
||||
archive: __('Archives')
|
||||
}
|
||||
this.times = {
|
||||
overall: __('Overall'),
|
||||
hours: __('Last hour'),
|
||||
week: __('Last week'),
|
||||
month: __('Last month')
|
||||
}
|
||||
this.state = {type: 'main', time: 'overall'}
|
||||
}
|
||||
loadMoreTorrents(type, time)
|
||||
{
|
||||
time = time ? time : this.state.time
|
||||
window.torrentSocket.emit('topTorrents',
|
||||
type == 'main' ? null : type,
|
||||
{index: (this.topTorrents[type] && this.topTorrents[type][time] && this.topTorrents[type][time].length) || 0, time},
|
||||
window.customLoader((data) => {
|
||||
if(!this.topTorrents[type])
|
||||
this.topTorrents[type] = {}
|
||||
if(!this.topTorrents[type][time])
|
||||
this.topTorrents[type][time] = []
|
||||
|
||||
if(data && data.length > 0)
|
||||
{
|
||||
this.topTorrents[type][time] = this.topTorrents[type][time].concat(data);
|
||||
this._update()
|
||||
}
|
||||
})
|
||||
)
|
||||
}
|
||||
_update()
|
||||
{
|
||||
if(this.timeForce)
|
||||
return
|
||||
this.timeForce = setTimeout(() => {
|
||||
delete this.timeForce
|
||||
this.forceUpdate()
|
||||
}, 550)
|
||||
}
|
||||
componentDidMount()
|
||||
{
|
||||
super.componentDidMount();
|
||||
for(const type of this.types)
|
||||
{
|
||||
this.loadMoreTorrents(type)
|
||||
}
|
||||
this.remoteTopTorrents = ({torrents, type, time}) => {
|
||||
if(!torrents)
|
||||
return
|
||||
if(data && data.length > 0)
|
||||
{
|
||||
this.topTorrents[type][time] = this.topTorrents[type][time].concat(data);
|
||||
this._update()
|
||||
}
|
||||
})
|
||||
)
|
||||
}
|
||||
_update()
|
||||
{
|
||||
if(this.timeForce)
|
||||
return
|
||||
this.timeForce = setTimeout(() => {
|
||||
delete this.timeForce
|
||||
this.forceUpdate()
|
||||
}, 550)
|
||||
}
|
||||
componentDidMount()
|
||||
{
|
||||
super.componentDidMount();
|
||||
for(const type of this.types)
|
||||
{
|
||||
this.loadMoreTorrents(type)
|
||||
}
|
||||
this.remoteTopTorrents = ({torrents, type, time}) => {
|
||||
if(!torrents)
|
||||
return
|
||||
|
||||
time = time ? time : 'overall'
|
||||
type = type ? type : 'main'
|
||||
this.topTorrents[type][time] = _.orderBy(_.unionBy(this.topTorrents[type][time], torrents, 'hash'), ['seeders'], ['desc'])
|
||||
this._update();
|
||||
}
|
||||
window.torrentSocket.on('remoteTopTorrents', this.remoteTopTorrents);
|
||||
}
|
||||
componentWillUnmount()
|
||||
{
|
||||
if(this.remoteTopTorrents)
|
||||
window.torrentSocket.off('remoteTopTorrents', this.remoteTopTorrents);
|
||||
}
|
||||
render() {
|
||||
return (
|
||||
<div>
|
||||
<div className='column center w100p'>
|
||||
{
|
||||
Object.keys(this.topTorrents).length == 0
|
||||
time = time ? time : 'overall'
|
||||
type = type ? type : 'main'
|
||||
this.topTorrents[type][time] = _.orderBy(_.unionBy(this.topTorrents[type][time], torrents, 'hash'), ['seeders'], ['desc'])
|
||||
this._update();
|
||||
}
|
||||
window.torrentSocket.on('remoteTopTorrents', this.remoteTopTorrents);
|
||||
}
|
||||
componentWillUnmount()
|
||||
{
|
||||
if(this.remoteTopTorrents)
|
||||
window.torrentSocket.off('remoteTopTorrents', this.remoteTopTorrents);
|
||||
}
|
||||
render() {
|
||||
return (
|
||||
<div>
|
||||
<div className='column center w100p'>
|
||||
{
|
||||
Object.keys(this.topTorrents).length == 0
|
||||
&&
|
||||
<div className='pad0-75 w100p '>
|
||||
<LinearProgress mode="indeterminate" />
|
||||
<LinearProgress mode="indeterminate" />
|
||||
</div>
|
||||
}
|
||||
<Tabs
|
||||
className='w100p'
|
||||
value={this.state.type}
|
||||
onChange={(type) => {
|
||||
this.setState({type});
|
||||
// lost other content
|
||||
if(!this.topTorrents[type][this.state.time])
|
||||
{
|
||||
this.loadMoreTorrents(type, this.state.time)
|
||||
}
|
||||
}}
|
||||
tabItemContainerStyle={{flexWrap: 'wrap', alignItems: 'stretch'}}
|
||||
inkBarStyle={{display: 'none'}}
|
||||
>
|
||||
{
|
||||
this.types.map((type, index) => {
|
||||
if(!this.topTorrents[type])
|
||||
return null;
|
||||
}
|
||||
<Tabs
|
||||
className='w100p'
|
||||
value={this.state.type}
|
||||
onChange={(type) => {
|
||||
this.setState({type});
|
||||
// lost other content
|
||||
if(!this.topTorrents[type][this.state.time])
|
||||
{
|
||||
this.loadMoreTorrents(type, this.state.time)
|
||||
}
|
||||
}}
|
||||
tabItemContainerStyle={{flexWrap: 'wrap', alignItems: 'stretch'}}
|
||||
inkBarStyle={{display: 'none'}}
|
||||
>
|
||||
{
|
||||
this.types.map((type, index) => {
|
||||
if(!this.topTorrents[type])
|
||||
return null;
|
||||
|
||||
return (
|
||||
<Tab buttonStyle={type === this.state.type ? {fontWeight: 'bold'} : undefined} style={{minWidth: 150}} key={index} label={this.descriptions[type]} value={type}>
|
||||
<Tabs
|
||||
className='w100p'
|
||||
value={this.state.time}
|
||||
onChange={(time) => {
|
||||
this.setState({time})
|
||||
// lost other content
|
||||
if(!this.topTorrents[type][time])
|
||||
{
|
||||
this.loadMoreTorrents(type, time)
|
||||
}
|
||||
}}
|
||||
tabItemContainerStyle={{flexWrap: 'wrap', alignItems: 'stretch'}}
|
||||
inkBarStyle={{display: 'none'}}
|
||||
>
|
||||
{
|
||||
Object.keys(this.times).map((time, index) => {
|
||||
const torrents = this.topTorrents[type][time];
|
||||
return (
|
||||
<Tab buttonStyle={type === this.state.type ? {fontWeight: 'bold'} : undefined} style={{minWidth: 150}} key={index} label={this.descriptions[type]} value={type}>
|
||||
<Tabs
|
||||
className='w100p'
|
||||
value={this.state.time}
|
||||
onChange={(time) => {
|
||||
this.setState({time})
|
||||
// lost other content
|
||||
if(!this.topTorrents[type][time])
|
||||
{
|
||||
this.loadMoreTorrents(type, time)
|
||||
}
|
||||
}}
|
||||
tabItemContainerStyle={{flexWrap: 'wrap', alignItems: 'stretch'}}
|
||||
inkBarStyle={{display: 'none'}}
|
||||
>
|
||||
{
|
||||
Object.keys(this.times).map((time, index) => {
|
||||
const torrents = this.topTorrents[type][time];
|
||||
|
||||
if(!torrents)
|
||||
return (
|
||||
<Tab buttonStyle={time === this.state.time ? {fontWeight: 'bold'} : undefined} style={{minWidth: 150}} key={index} label={this.times[time]} value={time}>
|
||||
<div className='pad0-75 w100p '>
|
||||
<LinearProgress mode="indeterminate" />
|
||||
</div>
|
||||
</Tab>
|
||||
)
|
||||
if(!torrents)
|
||||
return (
|
||||
<Tab buttonStyle={time === this.state.time ? {fontWeight: 'bold'} : undefined} style={{minWidth: 150}} key={index} label={this.times[time]} value={time}>
|
||||
<div className='pad0-75 w100p '>
|
||||
<LinearProgress mode="indeterminate" />
|
||||
</div>
|
||||
</Tab>
|
||||
)
|
||||
|
||||
return (
|
||||
<Tab buttonStyle={time === this.state.time ? {fontWeight: 'bold'} : undefined} style={{minWidth: 150}} key={index} label={this.times[time]} value={time}>
|
||||
<List style={{minWidth: '20em'}}>
|
||||
{
|
||||
torrents.map((torrent, index) => {
|
||||
return <TorrentLine key={index} torrent={torrent} />
|
||||
})
|
||||
}
|
||||
{
|
||||
torrents.length > 0
|
||||
return (
|
||||
<Tab buttonStyle={time === this.state.time ? {fontWeight: 'bold'} : undefined} style={{minWidth: 150}} key={index} label={this.times[time]} value={time}>
|
||||
<List style={{minWidth: '20em'}}>
|
||||
{
|
||||
torrents.map((torrent, index) => {
|
||||
return <TorrentLine key={index} torrent={torrent} />
|
||||
})
|
||||
}
|
||||
{
|
||||
torrents.length > 0
|
||||
&&
|
||||
<div>
|
||||
<ListItem innerDivStyle={{textAlign: 'center', padding: '1em'}} primaryText={<span>{__('More Torrents')}</span>} onClick={() => {
|
||||
this.loadMoreTorrents(type)
|
||||
}} />
|
||||
<Divider />
|
||||
<ListItem innerDivStyle={{textAlign: 'center', padding: '1em'}} primaryText={<span>{__('More Torrents')}</span>} onClick={() => {
|
||||
this.loadMoreTorrents(type)
|
||||
}} />
|
||||
<Divider />
|
||||
</div>
|
||||
}
|
||||
</List>
|
||||
</Tab>)
|
||||
})
|
||||
}
|
||||
}
|
||||
</List>
|
||||
</Tab>)
|
||||
})
|
||||
}
|
||||
|
||||
</Tabs>
|
||||
</Tab>
|
||||
)
|
||||
</Tabs>
|
||||
</Tab>
|
||||
)
|
||||
|
||||
})
|
||||
}
|
||||
</Tabs>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
})
|
||||
}
|
||||
</Tabs>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user