Added Settings Webui (view only), rewrite of API, Fixes #14, Fixes #2, now Testing

This commit is contained in:
2018-02-20 21:51:49 -05:00
parent d4966f597b
commit 840a965877
19 changed files with 689 additions and 209 deletions

View File

@@ -1,122 +0,0 @@
[serverConfig]
ServerPort = ":8000" #leave format as is it expects a string with colon
ServerAddr = "" #blank will bind to default IP address, usually fine to leave be
LogLevel = "Info" # Options = Debug, Info, Warn, Error, Fatal, Panic
LogOutput = "stdout" #Options = file, stdout #file will print it to logs/server.log
SeedRatioStop = 1.50 #automatically stops the torrent after it reaches this seeding ratio
#Relative or absolute path accepted, the server will convert any relative path to an absolute path.
DefaultMoveFolder = 'downloaded' #default path that a finished torrent is symlinked to after completion. Torrents added via RSS will default here
TorrentWatchFolder = 'torrentUpload' #folder path that is watched for .torrent files and adds them automatically every 5 minutes
#Limits your upload and download speed globally, all are averages and not burst protected (usually burst on start).
#Low = ~.05MB/s, Medium = ~.5MB/s, High = ~1.5MB/s
UploadRateLimit = "Unlimited" #Options are "Low", "Medium", "High", "Unlimited" #Unlimited is default
DownloadRateLimit = "Unlimited"
[goTorrentWebUI]
#Basic goTorrentWebUI authentication (not terribly secure, implemented in JS, password is hashed to SHA256, not salted, basically don't depend on this if you require very good security)
WebUIAuth = true # bool, if false no authentication is required for the webUI
WebUIUser = "admin"
WebUIPassword = "Password1"
[notifications]
PushBulletToken = "" #add your pushbullet api token here to notify of torrent completion to pushbullet
[reverseProxy]
#This is for setting up goTorrent behind a reverse Proxy (with SSL, reverse proxy with no SSL will require editing the WSS connection to a WS connection manually)
ProxyEnabled = false #bool, either false or true
#URL is CASE SENSITIVE
BaseURL = "yoursubdomain.domain.org/subroute/" # MUST be in the format (if you have a subdomain, and must have trailing slash) "yoursubdomain.domain.org/subroute/"
[EncryptionPolicy]
DisableEncryption = false
ForceEncryption = false
PreferNoEncryption = true
[torrentClientConfig]
DownloadDir = 'downloading' #the full OR relative path where the torrent server stores in-progress torrents
Seed = true #boolean #seed after download
# Never send chunks to peers.
NoUpload = false #boolean
#User-provided Client peer ID. If not present, one is generated automatically.
PeerID = "" #string
#The address to listen for new uTP and TCP bittorrent protocol connections. DHT shares a UDP socket with uTP unless configured otherwise.
ListenAddr = "" #Leave Blank for default, syntax "HOST:PORT"
#Don't announce to trackers. This only leaves DHT to discover peers.
DisableTrackers = false #boolean
DisablePEX = false # boolean
# Don't create a DHT.
NoDHT = false #boolean
#For the bittorrent protocol.
DisableUTP = false #bool
#For the bittorrent protocol.
DisableTCP = false #bool
#Called to instantiate storage for each added torrent. Builtin backends
# are in the storage package. If not set, the "file" implementation is used.
DefaultStorage = "storage.ClientImpl"
#encryption policy
IPBlocklist = "" #of type iplist.Ranger
DisableIPv6 = false #boolean
Debug = false #boolean
#HTTP *http.Client
HTTPUserAgent = "" # HTTPUserAgent changes default UserAgent for HTTP requests
ExtendedHandshakeClientVersion = ""
Bep20 = ""
# Overrides the default DHT configuration, see dhtServerConfig #advanced.. so be careful
DHTConfig = "" # default is "dht.ServerConfig"
[dhtServerConfig]
# Set NodeId Manually. Caller must ensure that if NodeId does not conform to DHT Security Extensions, that NoSecurity is also set.
NodeId = "" #[20]byte
Conn = "" # https:#godoc.org/net#PacketConn #not implemented
# Don't respond to queries from other nodes.
Passive = false # boolean
# the default addresses are "router.utorrent.com:6881","router.bittorrent.com:6881","dht.transmissionbt.com:6881","dht.aelitis.com:6881",
#https:#github.com/anacrolix/dht/blob/master/dht.go
StartingNodes = "dht.GlobalBootstrapAddrs"
#Disable the DHT security extension: http:#www.libtorrent.org/dht_sec.html.
NoSecurity = false
#Initial IP blocklist to use. Applied before serving and bootstrapping begins.
IPBlocklist = "" #of type iplist.Ranger
#Used to secure the server's ID. Defaults to the Conn's LocalAddr(). Set to the IP that remote nodes will see,
#as that IP is what they'll use to validate our ID.
PublicIP = "" #net.IP
#Hook received queries. Return true if you don't want to propagate to the default handlers.
OnQuery = "func(query *krpc.Msg, source net.Addr) (propagate bool)"
#Called when a peer successfully announces to us.
OnAnnouncePeer = "func(infoHash metainfo.Hash, peer Peer)"
#How long to wait before re-sending queries that haven't received a response. Defaults to a random value between 4.5 and 5.5s.
QueryResendDelay = "func() time.Duration"

View File

@@ -20,6 +20,7 @@ let RSSTorrentList = [];
let serverMessage = [];
let serverPushMessage = [];
let webSocketState = false;
let settingsFile = [];
var torrentListRequest = {
MessageType: "torrentListRequest"
@@ -113,13 +114,9 @@ ws.onmessage = function (evt) { //When we recieve a message from the websocket
RSSName: serverMessage.RSSFeeds[i].RSSName,
})
}
console.log("RSSURLS", RSSList)
console.log("FIRSTURL", RSSList[1])
console.log("FULLURL", RSSList[1].RSSURL)
break;
case "rssTorrentList":
//console.log("RSSTorrentList recieved", evt.data)
RSSTorrentList = [];
for (var i = 0; i < serverMessage.TotalTorrents; i++){
RSSTorrentList.push({
@@ -133,6 +130,10 @@ ws.onmessage = function (evt) { //When we recieve a message from the websocket
console.log("SERVER PUSHED MESSAGE", serverMessage)
serverPushMessage = [serverMessage.MessageLevel, serverMessage.Payload];
break;
case "settingsFile":
settingsFile = [];
console.log("Settings File Returned", serverMessage)
settingsFile = serverMessage.Config
}
}
@@ -221,6 +222,9 @@ class BackendSocket extends React.Component {
console.log("PROPSSERVER", this.props.serverPushMessage, "SERVERPUSH", serverPushMessage)
this.props.newServerMessage(serverPushMessage)
}
if (this.props.settingsModalOpen) { //TODO don't really need to updaate every tick currently until we can edit config
this.props.newSettingsFile(settingsFile)
}
ws.send(JSON.stringify(torrentListRequest))//talking to the server to get the torrent list
if (ws.readyState === ws.CLOSED){ //if our websocket gets closed inform the user
@@ -281,7 +285,9 @@ const mapStateToProps = state => {
selection: state.selection,
RSSModalOpen: state.RSSModalOpen,
RSSTorrentList: state.RSSTorrentList,
serverPushMessage: state.serverPushMessage
serverPushMessage: state.serverPushMessage,
settingsModalOpen: state.settingsModalOpen,
};
}
@@ -295,6 +301,7 @@ const mapDispatchToProps = dispatch => {
RSSTorrentList: (RSSTorrentList) => dispatch({type: actionTypes.RSS_TORRENT_LIST, RSSTorrentList}),
newServerMessage: (serverPushMessage) => dispatch({type: actionTypes.SERVER_MESSAGE, serverPushMessage}),
webSocketStateUpdate: (webSocketState) => dispatch({type: actionTypes.WEBSOCKET_STATE, webSocketState}),
newSettingsFile: (settingsFile) => dispatch({type: actionTypes.NEW_SETTINGS_FILE, settingsFile})
//changeSelection: (selection) => dispatch({type: actionTypes.CHANGE_SELECTION, selection}),//forcing an update to the buttons
}

View File

@@ -1,6 +1,6 @@
import React from 'react';
import PropTypes from 'prop-types';
import 'typeface-roboto'; // contains the font for material UI
//import 'typeface-roboto'; // contains the font for material UI
import { withStyles } from 'material-ui/styles';
import AppBar from 'material-ui/AppBar';
import Tabs, { Tab } from 'material-ui/Tabs';

View File

@@ -101,8 +101,7 @@ const inlineStyle = {
}
handleRSSModalClose = () => {
let closeState = false
this.props.rssModalOpenState(closeState)
this.props.rssModalOpenState(false)
}
handleAddRSSFeed = () => {

View File

@@ -16,12 +16,10 @@ import Dialog, {
DialogContentText,
DialogTitle,
} from 'material-ui/Dialog';
import InsertLinkIcon from 'material-ui-icons/Link';
import ReactTooltip from 'react-tooltip'
import Icon from 'material-ui/Icon';
import IconButton from 'material-ui/IconButton';
import RSSTorrentIcon from 'material-ui-icons/RssFeed';
import AddRSSIcon from 'material-ui-icons/AddCircle';
import RSSModalLayout from './RSSModalLayout'

View File

@@ -0,0 +1,65 @@
import React from 'react';
import ReactDOM from 'react-dom';
import { withStyles } from 'material-ui/styles';
import Paper from 'material-ui/Paper';
import Grid from 'material-ui/Grid';
import {connect} from 'react-redux';
const styles = theme => ({
root: {
flexGrow: 1,
marginTop: 0,
},
paper: {
padding: 16,
textAlign: 'left',
color: theme.palette.text.primary,
},
floatRight: {
float: 'right',
}
});
class ClientSettingsTab extends React.PureComponent {
render() {
const { classes } = this.props;
return (
<div className={classes.root}>
<Grid container spacing={8}>
<Grid item xs={12} sm={4}>
<Paper className={classes.paper}>HTTP Address: <span className={classes.floatRight}>{this.props.settingsFile["HTTPAddrIP"]} </span></Paper>
<Paper className={classes.paper}>HTTP Port: <span className={classes.floatRight}>{this.props.settingsFile["HTTPAddr"]} </span> </Paper>
<Paper className={classes.paper}>Use Proxy: <span className={classes.floatRight}>{String(this.props.settingsFile["UseProxy"])} </span> </Paper>
<Paper className={classes.paper}>Base URL: <span className={classes.floatRight}>{this.props.settingsFile["BaseURL"]} </span> </Paper>
</Grid>
<Grid item xs={12} sm={4}>
<Paper className={classes.paper}>Client Username: <span className={classes.floatRight}>{this.props.settingsFile["ClientUsername"]} </span> </Paper>
<Paper className={classes.paper}>Client Password: <span className={classes.floatRight}>{this.props.settingsFile["ClientPassword"]} </span> </Paper>
</Grid>
<Grid item xs={12} sm={4}>
</Grid>
</Grid>
</div>
);
}
}
const mapStateToProps = state => {
return {
settingsFile: state.settingsFile,
};
}
export default withStyles(styles)(connect(mapStateToProps)(ClientSettingsTab))

View File

@@ -0,0 +1,83 @@
import React from 'react';
import ReactDOM from 'react-dom';
import { withStyles } from 'material-ui/styles';
import Paper from 'material-ui/Paper';
import Grid from 'material-ui/Grid';
import {connect} from 'react-redux';
let logLevel = "None"
const styles = theme => ({
root: {
flexGrow: 1,
marginTop: 0,
},
paper: {
padding: 16,
textAlign: 'left',
color: theme.palette.text.primary,
},
floatRight: {
float: 'right',
}
});
class LoggingSettingsTab extends React.Component {
componentWillMount = () => {
switch (String(this.props.settingsFile["LoggingLevel"])) { //Options = Debug 5, Info 4, Warn 3, Error 2, Fatal 1, Panic 0
case "0":
logLevel = "Panic"
case "1":
logLevel = "Fatal"
case "2":
logLevel = "Error"
case "3":
logLevel = "Warn"
case "4":
logLevel = "Info"
case "5":
logLevel = "Debug"
}
}
render() {
const { classes } = this.props;
return (
<div className={classes.root}>
<Grid container spacing={8}>
<Grid item xs={12} sm={4}>
<Paper className={classes.paper}>Logging Output: <span className={classes.floatRight}>{this.props.settingsFile["LoggingOutput"]} </span></Paper>
<Paper className={classes.paper}>Logging Level: <span className={classes.floatRight}>{logLevel} </span> </Paper>
</Grid>
<Grid item xs={12} sm={4}>
</Grid>
<Grid item xs={12} sm={4}>
</Grid>
</Grid>
</div>
);
}
}
const mapStateToProps = state => {
return {
settingsFile: state.settingsFile,
};
}
export default withStyles(styles)(connect(mapStateToProps)(LoggingSettingsTab))

View File

@@ -0,0 +1,36 @@
import React from 'react';
import ReactDOM from 'react-dom';
import { withStyles } from 'material-ui/styles';
const styles = theme => ({
root: {
flexGrow: 1,
marginTop: 0,
},
paper: {
padding: 16,
textAlign: 'left',
color: theme.palette.text.primary,
},
floatRight: {
float: 'right',
}
});
class NotesTab extends React.PureComponent {
render() {
const { classes } = this.props;
return (
<div className={classes.root}>
Here will be notes/news/links, etc, maybe pull from github?
</div>
);
}
}
export default withStyles(styles)(NotesTab)

View File

@@ -0,0 +1,64 @@
import React from 'react';
import ReactDOM from 'react-dom';
import { withStyles } from 'material-ui/styles';
import Paper from 'material-ui/Paper';
import Grid from 'material-ui/Grid';
import {connect} from 'react-redux';
const styles = theme => ({
root: {
flexGrow: 1,
marginTop: 0,
},
paper: {
padding: 16,
textAlign: 'left',
color: theme.palette.text.primary,
},
floatRight: {
float: 'right',
}
});
class ServerSettingsTab extends React.PureComponent {
render() {
const { classes } = this.props;
return (
<div className={classes.root}>
<Grid container spacing={8}>
<Grid item xs={12} sm={4}>
<Paper className={classes.paper}>Scan Folder for Torrent Files: <span className={classes.floatRight}>{this.props.settingsFile["TorrentWatchFolder"]} </span></Paper>
<Paper className={classes.paper}>Folder that stores Uploaded Torrents: <span className={classes.floatRight}>{this.props.settingsFile["TFileUploadFolder"]} </span> </Paper>
<Paper className={classes.paper}>Default Move Folder: <span className={classes.floatRight}>{String(this.props.settingsFile["DefaultMoveFolder"])} </span> </Paper>
</Grid>
<Grid item xs={12} sm={4}>
<Paper className={classes.paper}>Automatic stop seeding Ratio: <span className={classes.floatRight}>{this.props.settingsFile["SeedRatioStop"]} </span> </Paper>
</Grid>
<Grid item xs={12} sm={4}>
</Grid>
</Grid>
</div>
);
}
}
const mapStateToProps = state => {
return {
settingsFile: state.settingsFile,
};
}
export default withStyles(styles)(connect(mapStateToProps)(ServerSettingsTab))

View File

@@ -0,0 +1,87 @@
import React from 'react';
import ReactDOM from 'react-dom';
import Button from 'material-ui/Button';
import TextField from 'material-ui/TextField';
import { withStyles } from 'material-ui/styles';
import PropTypes from 'prop-types';
import List, {
ListItem,
ListItemIcon,
ListItemSecondaryAction,
ListItemText,
} from 'material-ui/List';
import Dialog, {
DialogActions,
DialogContent,
DialogContentText,
DialogTitle,
} from 'material-ui/Dialog';
import ReactTooltip from 'react-tooltip'
import Icon from 'material-ui/Icon';
import IconButton from 'material-ui/IconButton';
import SettingsIcon from 'material-ui-icons/Settings';
import SettingsModalLayout from './settingsModalLayout'
//Redux
import {connect} from 'react-redux';
import * as actionTypes from '../../../store/actions';
const button = {
fontSize: '60px',
marginLeft: '20px',
marginRight: '20px',
}
const inlineStyle = {
display: 'inline-block',
backdrop: 'static',
}
class AddSettingsModal extends React.Component {
settingsModalOpenState = () => {
let settingsFileRequest = {
MessageType: "settingsFileRequest",
}
ws.send(JSON.stringify(settingsFileRequest))
console.log("Opening Settings Modal")
this.props.settingsModalOpenState(true)
}
render() {
const { classes, onRequestClose, handleRequestClose, handleSubmit } = this.props;
return (
<div style={inlineStyle}>
<IconButton onClick={this.settingsModalOpenState} color="primary" data-tip="Settings Modal" style={button} aria-label="Settings Modal">
<ReactTooltip place="top" type="light" effect="float" />
<SettingsIcon />
</IconButton>
<Dialog fullScreen open={this.props.settingsModalOpen} onRequestClose={this.handleRequestClose}>
<DialogTitle>Manage Settings</DialogTitle>
<SettingsModalLayout />
</Dialog>
</div>
);
}
};
const mapStateToProps = state => {
return {
settingsModalOpen: state.settingsModalOpen,
}
}
const mapDispatchToProps = dispatch => {
return {
settingsModalOpenState: (settingsModalOpen) => dispatch({type: actionTypes.SETTINGS_MODAL_OPEN_STATE, settingsModalOpen}),
}
}
export default connect(mapStateToProps, mapDispatchToProps)(AddSettingsModal)

View File

@@ -0,0 +1,56 @@
import React from 'react';
import ReactDOM from 'react-dom';
import Button from 'material-ui/Button';
import Paper from 'material-ui/Paper';
import Grid from 'material-ui/Grid';
import {connect} from 'react-redux';
import ClientSettingsTab from './SettingsModalContentTabs/clientSettingsTab';
import LoggingSettingsTab from './SettingsModalContentTabs/loggingSettingsTab';
import NotesTab from './SettingsModalContentTabs/notesTab';
import ServerSettingsTab from './SettingsModalContentTabs/serverSettingsTab';
class SettingsModalContent extends React.Component {
handleChange = (event, value) => {
console.log("HandleChange", event, value)
};
componentDidMount = () => {
console.log("settingsFile", this.props.settingsFile)
}
render() {
switch(this.props.selectedMenuItem){
case 0:
return <NotesTab />
case 1:
return <ClientSettingsTab />
case 2:
return <LoggingSettingsTab />
case 3:
return <ServerSettingsTab />
default:
return <NotesTab />
}
}
}
const mapStateToProps = state => {
return {
settingsFile: state.settingsFile,
};
}
export default connect(mapStateToProps)(SettingsModalContent)

View File

@@ -0,0 +1,146 @@
import React from 'react';
import ReactDOM from 'react-dom';
//css for react grid
import '../../../../node_modules/react-grid-layout/css/styles.css';
import '../../../../node_modules/react-resizable/css/styles.css';
//react-grid for layout
import RGL, { WidthProvider } from 'react-grid-layout';
import PropTypes from 'prop-types';
import _ from 'lodash';
//Redux
import {connect} from 'react-redux';
import * as actionTypes from '../../../store/actions';
//interior items
import TextField from 'material-ui/TextField';
import { withStyles } from 'material-ui/styles';
import ReactTooltip from 'react-tooltip'
import Icon from 'material-ui/Icon';
import SettingsMenuList from './settingsModalList.js';
import SettingsModalContent from './settingsModalContent';
import IconButton from 'material-ui/IconButton';
import Button from 'material-ui/Button';
import Dialog, {
DialogActions,
DialogContent,
DialogContentText,
DialogTitle,
} from 'material-ui/Dialog';
const ReactGridLayout = WidthProvider(RGL);
const background = {
backgroundColor: '#e5e5e5',
boxShadow: '0 0 20px #000',
}
const button = {
fontSize: '60px',
paddingRight: '20px',
paddingLeft: '20px',
}
const smallButton = {
width: '36px',
height: '36px',
padding: '5px',
}
const inlineStyle = {
display: 'inline-block',
backdrop: 'static',
}
class SettingsModalLayout extends React.Component {
static propTypes = {
onLayoutChange: PropTypes.func.isRequired
};
static defaultProps = {
className: "layout",
items: 4,
rowHeight: 100,
onLayoutChange: function() {},
cols: 8,
draggableCancel: '.NoDrag',
draggableHandle: '.DragHandle'
};
constructor(props) {
super(props);
var layout = [
{i: 'b', x: 0, y: 0, w: 1, h: 5, static: true},
{i: 'c', x: 1, y: 0, w: 7, h: 5, minW: 4, minH: 3, static: true},
];
this.state = {
layout ,
textValue: "",
selectedMenuItem: 0,
};
};
onLayoutChange(layout) {
this.props.onLayoutChange(layout);
}
handleSettingsModalClose = () => {
this.props.settingsModalOpenState(false)
}
changeMenuSelection = (menuItem) => {
this.setState({selectedMenuItem: menuItem})
}
render() {
return (
<div style={inlineStyle}>
<DialogContent>
<ReactGridLayout layout={this.state.layout} onLayoutChange={this.onLayoutChange}
{...this.props}>
<div key="b" style={background} className="DragHandle">
<SettingsMenuList changeMenuSelection={this.changeMenuSelection} />
</div>
<div key="c" style={background} className="DragHandle">
<SettingsModalContent selectedMenuItem={this.state.selectedMenuItem} />
</div>
</ReactGridLayout>
</DialogContent>
<DialogActions>
<Button onClick={this.handleSettingsModalClose} color="primary">
Close
</Button>
</DialogActions>
</div>
);
}
};
const mapStateToProps = state => {
return {
settingsModalOpen: state.settingsModalOpen,
};
}
const mapDispatchToProps = dispatch => {
return {
settingsModalOpenState: (settingsModalOpen) => dispatch({type: actionTypes.SETTINGS_MODAL_OPEN_STATE, settingsModalOpen}),
}
}
export default connect(mapStateToProps, mapDispatchToProps)(SettingsModalLayout)

View File

@@ -0,0 +1,102 @@
import React from 'react';
import ReactDOM from 'react-dom';
import Button from 'material-ui/Button';
import TextField from 'material-ui/TextField';
import { withStyles } from 'material-ui/styles';
import PropTypes from 'prop-types';
import List, {
ListItem,
ListItemIcon,
ListItemSecondaryAction,
ListItemText,
} from 'material-ui/List';
import Dialog, {
DialogActions,
DialogContent,
DialogContentText,
DialogTitle,
} from 'material-ui/Dialog';
import InsertLinkIcon from 'material-ui-icons/Link';
import ReactTooltip from 'react-tooltip'
import Icon from 'material-ui/Icon';
import IconButton from 'material-ui/IconButton';
import RSSTorrentIcon from 'material-ui-icons/RssFeed';
import AddRSSIcon from 'material-ui-icons/AddCircle';
import DeleteIcon from 'material-ui-icons/Delete';
//Redux
import {connect} from 'react-redux';
import * as actionTypes from '../../../store/actions';
const styles = theme => ({
root: {
width: '100%',
maxWidth: 360,
backgroundColor: '#e5e5e5',
},
icons: {
width: '40px',
height: '40px',
},
inactiveIcon: {
width: '40px',
height: '40px',
color: 'red',
},
active: {
backgroundColor: '#80b3ff',
}
});
const inlineStyle = {
display: 'inline-block',
backdrop: 'static',
}
class SettingsMenuList extends React.Component {
constructor(props){
super(props)
this.state = {
activeIndex: 0
}
}
changeMenuSelection = (listItem) => {
console.log("Menu Selection", listItem)
this.setState({activeIndex: listItem})
this.props.changeMenuSelection(listItem)
console.log("ACTIVEINDEX", this.state.activeIndex)
}
render() {
const { classes } = this.props;
return (
<div style={inlineStyle}>
<List component="nav">
<ListItem className={this.state.activeIndex==0 ? classes.active: null} button onClick={() => this.changeMenuSelection(0)}>
<ListItemText primary="News/About" />
</ListItem>
<ListItem className={this.state.activeIndex==1 ? classes.active: null} button onClick={() => this.changeMenuSelection(1)}>
<ListItemText primary="Client Connect" />
</ListItem>
<ListItem className={this.state.activeIndex==2 ? classes.active: null} button onClick={() => this.changeMenuSelection(2)}>
<ListItemText primary="Logging" />
</ListItem>
<ListItem className={this.state.activeIndex==3 ? classes.active: null} button onClick={() => this.changeMenuSelection(3)}>
<ListItemText primary="Server Settings" />
</ListItem>
</List>
</div>
);
}
};
export default withStyles(styles)(SettingsMenuList)

View File

@@ -11,12 +11,13 @@ import AddRSSModal from './Modals/RSSModal/addRSSModal';
import DeleteTorrentModal from './Modals/deleteTorrentModal';
import ChangeStorageModal from './Modals/changeStorageModal';
import TorrentSearch from './torrentSearch';
import AddSettingsModal from './Modals/SettingsModal/addSettingsModal';
import StartTorrentIcon from 'material-ui-icons/PlayArrow';
//import PauseTorrentIcon from 'material-ui-icons/Pause';
import StopTorrentIcon from 'material-ui-icons/Stop';
import RSSTorrentIcon from 'material-ui-icons/RssFeed';
import SettingsIcon from 'material-ui-icons/Settings';
import ForceUploadIcon from 'material-ui-icons/KeyboardArrowUp';
@@ -136,10 +137,7 @@ class IconButtons extends React.Component {
<div className={classes.verticalDivider}></div>
<ChangeStorageModal />
<AddRSSModal />
<IconButton color="primary" data-tip="Settings" className={classes.button} aria-label="Settings">
<ReactTooltip place="top" type="light" effect="float" />
<SettingsIcon />
</IconButton>
<AddSettingsModal />
<div className={classes.verticalDivider}></div>
<TorrentSearch />
<div className={classes.verticalDivider}></div>

View File

@@ -83,7 +83,7 @@ class BasicLayout extends React.PureComponent {
<ReactGridLayout layout={this.state.layout} onLayoutChange={this.onLayoutChange} {...this.props}>
<div key="a" style={background} className="DragHandle"><TopMenu /></div>
<div key="b" style={background} className="DragHandle"><LeftMenu /></div>
{ this.state.loggedin
{ this.state.loggedin //if we are not logged into the app don't show the list of torrents
? <div key="c" style={background} className="DragHandle"><TorrentList /></div>
: <div key="c" style={background} className="DragHandle"></div>
}

View File

@@ -8,12 +8,12 @@ import DownloadingTorrentsIcon from 'material-ui-icons/FileDownload'
import UploadingTorrentsIcon from 'material-ui-icons/FileUpload'
import ActiveTorrentsIcon from 'material-ui-icons/SwapVert'
import AllTorrentsIcon from 'material-ui-icons/AllInclusive'
import StopTorrentIcon from 'material-ui-icons/Stop';
//react redux
import {connect} from 'react-redux';
import * as actionTypes from '../store/actions';
//TODO, clean up the goddamn variable names you are all over the place
const styles = theme => ({
root: {
width: '100%',
@@ -40,32 +40,14 @@ class SimpleList extends React.Component {
super(props);
const { classes } = this.props;
this.state = {
allTorrentsClass: classes.active,
downloadingClass: '',
seedingClass: '',
activeTorrentsClass: '',
completedTorrentsClass: '',
allID: "All",
downloadingID: "Downloading",
seedingID: "Seeding",
activeID: "Active",
completedID: "Completed",
activeIndex: 0,
}
}
componentWillReceiveProps = (nextprops) => {
const { classes } = this.props;
if (nextprops.filter[0].columnName == "TorrentName"){ //If we are using the top searchbox move back to all torrents
this.setState({
allTorrentsClass: classes.active,
downloadingClass: '',
seedingClass: '',
activeTorrentsClass: '',
completedTorrentsClass: '',
})
this.setState({activeIndex: 0})
}
}
@@ -75,79 +57,41 @@ class SimpleList extends React.Component {
filterState = [{columnName: 'Status', value: filterState}]
this.props.changeFilter(filterState)//dispatch to redux
console.log("Switching filters classes", id)
switch (id){ //TODO.. there has to be a better fucking way to do this
case "All":
this.state.allTorrentsClass = classes.active
this.state.downloadingClass = ''
this.state.seedingClass = ''
this.state.activeTorrentsClass = ''
this.state.completedTorrentsClass = ''
break
case "Downloading":
console.log("Downloading...")
this.state.downloadingClass = classes.active
this.state.allTorrentsClass = ''
this.state.seedingClass = ''
this.state.activeTorrentsClass = ''
this.state.completedTorrentsClass = ''
break
case "Seeding":
this.state.seedingClass = classes.active
this.state.allTorrentsClass = ''
this.state.downloadingClass = ''
this.state.activeTorrentsClass = ''
this.state.completedTorrentsClass = ''
break
case "Active":
this.state.activeTorrentsClass = classes.active
this.state.allTorrentsClass = ''
this.state.downloadingClass = ''
this.state.seedingClass = ''
this.state.completedTorrentsClass = ''
break
case "Completed":
this.state.completedTorrentsClass = classes.active
this.state.allTorrentsClass = ''
this.state.downloadingClass = ''
this.state.seedingClass = ''
this.state.activeTorrentsClass = ''
break
this.setState({activeIndex: id})
}
}
render() {
const { classes } = this.props;
return (
<div className={classes.root}>
<List dense>
<ListItem dense className={this.state.allTorrentsClass} button onClick={ () => this.setFilter('', this.state.allID)}>
<ListItem dense className={this.state.activeIndex==0 ? classes.active: null} button onClick={ () => this.setFilter('', 0)}>
<ListItemIcon className={classes.icons} >
<AllTorrentsIcon />
</ListItemIcon>
<ListItemText primary="All Torrents" />
</ListItem>
<ListItem className={this.state.downloadingClass} button={true} onClick={ () => this.setFilter('Downloading', this.state.downloadingID)}>
<ListItem className={this.state.activeIndex==1 ? classes.active: null} button onClick={ () => this.setFilter('Downloading', 1)}>
<ListItemIcon className={classes.icons}>
<DownloadingTorrentsIcon />
</ListItemIcon>
<ListItemText primary="Downloading Torrents" />
</ListItem>
<ListItem className={this.state.seedingClass} button={true} onClick={ () => this.setFilter('Seeding', this.state.seedingID)}>
<ListItem className={this.state.activeIndex==2 ? classes.active: null} button onClick={ () => this.setFilter('Seeding', 2)}>
<ListItemIcon className={classes.icons}>
<UploadingTorrentsIcon />
</ListItemIcon>
<ListItemText primary="Seeding Torrents" />
</ListItem>
{/* <ListItem className={this.state.activeTorrentsClass} button={true} onClick={ () => this.setFilter('Active', this.state.activeID)}>
<ListItemIcon className={classes.icons}>
<ActiveTorrentsIcon />
</ListItemIcon>
<ListItemText primary="Active Torrents" />
</ListItem> */}
<ListItem className={this.state.completedTorrentsClass} button={true} onClick={ () => this.setFilter('Completed', this.state.completedID)}>
<ListItem className={this.state.activeIndex==3 ? classes.active: null} button onClick={ () => this.setFilter('Stopped', 3)}>
<ListItemIcon className={classes.inactiveIcon}>
<StopTorrentIcon />
</ListItemIcon>
<ListItemText primary="Stopped Torrents" />
</ListItem>
<ListItem className={this.state.activeIndex==4 ? classes.active: null} button onClick={ () => this.setFilter('Completed', 4)}>
<ListItemIcon className={classes.icons}>
<ActiveTorrentsIcon />
</ListItemIcon>
<ListItemText primary="Completed Torrents" />

View File

@@ -10,6 +10,8 @@ export const FILE_LIST = 'FILE_LIST';
export const CHANGE_FILE_SELECTION = 'CHANGE_FILE_SELECTION';
export const NEW_RSS_FEED_STORE = 'NEW_RSS_FEED_STORE';
export const RSS_MODAL_OPEN_STATE = 'RSS_MODAL_OPEN_STATE';
export const SETTINGS_MODAL_OPEN_STATE = 'SETTINGS_MODAL_OPEN_STATE';
export const NEW_SETTINGS_FILE = 'NEW_SETTINGS_FILE';
export const RSS_TORRENT_LIST = 'RSS_TORRENT_LIST';
export const SERVER_MESSAGE = 'SERVER_MESSAGE';
export const WEBSOCKET_STATE = 'WEBSOCKET_STATE';

View File

@@ -20,7 +20,8 @@ const initialState = {
RSSModalOpen: false,
serverPushMessage: [],
webSocketState: false,
searchFilterTerm: ""
searchFilterTerm: "",
settingsFile: [],
}
@@ -106,6 +107,20 @@ const reducer = (state = initialState, action) => {
...state,
RSSModalOpen: action.RSSModalOpen
}
case actionTypes.SETTINGS_MODAL_OPEN_STATE:
console.log("Settings Modal State...", action.settingsModalOpen)
return {
...state,
settingsModalOpen: action.settingsModalOpen
}
case actionTypes.NEW_SETTINGS_FILE:
console.log("New settings file", action.settingsFile)
return {
...state,
settingsFile: action.settingsFile
}
case actionTypes.SERVER_MESSAGE:
console.log("New server push message", action.serverPushMessage)