Clean up torrent list

This commit is contained in:
John Furrow
2016-01-09 17:06:37 -08:00
parent ae85e0bdcd
commit d5445cef3a
9 changed files with 38 additions and 117 deletions

View File

@@ -2,10 +2,6 @@ import d3 from 'd3';
import React from 'react';
export default class LineChart extends React.Component {
constructor() {
super();
}
componentDidUpdate() {
let graph = d3.select('#' + this.props.id);
let transferData = this.props.data;

View File

@@ -10,6 +10,7 @@ import TorrentDetails from './TorrentDetails';
import TorrentFilterStore from '../../stores/TorrentFilterStore';
import TorrentStore from '../../stores/TorrentStore';
import UIActions from '../../actions/UIActions';
import UIStore from '../../stores/UIStore';
const METHODS_TO_BIND = [
'onReceiveTorrentsError',
@@ -29,7 +30,6 @@ export default class TorrentListContainer extends React.Component {
super();
this.state = {
detailsPanelOpen: false,
maxTorrentIndex: 10,
minTorrentIndex: 0,
scrollPosition: 0,
@@ -106,16 +106,11 @@ export default class TorrentListContainer extends React.Component {
}
onTorrentSelectionChange() {
if ((TorrentStore.getSelectedTorrents().length !== 1 &&
this.state.detailsPanelOpen) || TorrentStore.getTorrents().length === 0) {
// Close the detail side panel if more than one torrent is selected or if
// none are selected.
this.setState({
detailsPanelOpen: false
});
} else {
this.forceUpdate();
if (TorrentStore.getSelectedTorrents().length !== 1) {
UIStore.closeTorrentDetailsPanel();
}
this.forceUpdate();
}
getListPadding(minTorrentIndex, maxTorrentIndex, torrentCount) {

View File

@@ -1,30 +1,12 @@
import _ from 'lodash';
import classNames from 'classnames';
import React from 'react';
import TorrentDetails from './TorrentDetails';
import TorrentList from './TorrentList';
const METHODS_TO_BIND = [
'toggleDetailsPanel'
];
export default class TorrentListContainer extends React.Component {
constructor() {
super();
this.state = {
detailsPanelOpen: false
};
}
render() {
let classes = classNames({
'torrents': true
});
return (
<div className={classes}>
<div className="torrents">
<TorrentList />
<TorrentDetails />
</div>

View File

@@ -1,63 +0,0 @@
import classNames from 'classnames';
import React from 'react';
import UIActions from '../../actions/UIActions';
class HeaderItem extends React.Component {
constructor() {
super();
}
render() {
let isSorted = this.props.sortCriteria.property === this.props.propertylet;
let classes = classNames({
'is-sorted': isSorted,
'is-sorted--asc': isSorted && (this.props.sortCriteria.direction === 'asc'),
'is-sorted--desc': isSorted && (this.props.sortCriteria.direction === 'desc'),
'torrent__header__item': true,
'torrent__detail--primary': this.props.primary,
'torrent__detail--secondary--sub': !this.props.primary
});
classes += ' torrent__detail--' + this.props.slug;
return (
<span className={classes} onClick={this._onClick}>{this.props.label}</span>
);
}
_onClick() {
let newDirection = this.props.sortCriteria.direction === 'asc' ? 'desc' : 'asc';
UIActions.sortTorrents(this.props.propertylet, newDirection);
}
}
export default class TorrentListHeader extends React.Component {
constructor() {
super();
}
render() {
return (
<div className="torrent__header">
<HeaderItem primary="true" label="Name" slug="name" propertylet="name" sortCriteria={this.props.sortCriteria} />
<div className="torrent__detail--secondary">
<HeaderItem label="Up" slug="speed" propertylet="uploadRate" sortCriteria={this.props.sortCriteria} />
<HeaderItem label="Down" slug="speed" propertylet="downloadRate" sortCriteria={this.props.sortCriteria} />
<HeaderItem label="ETA" slug="eta" propertylet="eta" sortCriteria={this.props.sortCriteria} />
<HeaderItem label="Completed" slug="completed" propertylet="percentComplete" sortCriteria={this.props.sortCriteria} />
<HeaderItem label="Size" slug="size" propertylet="sizeBytes" sortCriteria={this.props.sortCriteria} />
<HeaderItem label="Ratio" slug="ratio" propertylet="ratio" sortCriteria={this.props.sortCriteria} />
<HeaderItem label="Peers" slug="peers" propertylet="name" sortCriteria={this.props.sortCriteria} />
<HeaderItem label="Seeds" slug="seeds" propertylet="name" sortCriteria={this.props.sortCriteria} />
</div>
</div>
);
}
}

View File

@@ -14,6 +14,13 @@ class UIStoreClass extends BaseStore {
this.torrentDetailsOpen = false;
}
closeTorrentDetailsPanel() {
if (this.torrentDetailsOpen) {
this.torrentDetailsOpen = false;
this.emit(EventTypes.UI_TORRENT_DETAILS_OPEN_CHANGE);
}
}
getActiveModal() {
return this.activeModal;
}
@@ -28,11 +35,14 @@ class UIStoreClass extends BaseStore {
}
handleTorrentClick(hash) {
console.log('set torrent details hash');
this.torrentDetailsHash = hash;
this.emit(EventTypes.UI_TORRENT_DETAILS_HASH_CHANGE);
}
handleTorrentDetailsClick(hash, event) {
console.log(hash);
console.log(this.torrentDetailsHash);
this.torrentDetailsOpen = !this.torrentDetailsOpen;
this.emit(EventTypes.UI_TORRENT_DETAILS_OPEN_CHANGE);
}
@@ -48,12 +58,12 @@ AppDispatcher.register((payload) => {
const {action, source} = payload;
switch (action.type) {
case ActionTypes.UI_CLICK_TORRENT:
UIStore.handleTorrentClick(action.data.hash);
break;
case ActionTypes.UI_CLICK_TORRENT_DETAILS:
UIStore.handleTorrentDetailsClick(action.data.hash, action.data.event);
break;
case ActionTypes.UI_CLICK_TORRENT:
UIStore.handleTorrentClick(action.data.hash);
break;
case ActionTypes.UI_DISPLAY_MODAL:
UIStore.setActiveModal(action.data);
break;