115 lines
3.1 KiB
JavaScript
115 lines
3.1 KiB
JavaScript
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 Dialog, {
|
|
DialogActions,
|
|
DialogContent,
|
|
DialogContentText,
|
|
DialogTitle,
|
|
} from 'material-ui/Dialog';
|
|
import StorageIcon from 'material-ui-icons/Storage';
|
|
import ReactTooltip from 'react-tooltip'
|
|
import Icon from 'material-ui/Icon';
|
|
import IconButton from 'material-ui/IconButton';
|
|
//Importing Redux
|
|
import {connect} from 'react-redux';
|
|
import * as actionTypes from '../../store/actions';
|
|
|
|
|
|
|
|
const button = {
|
|
fontSize: '60px',
|
|
marginLeft: '20px',
|
|
|
|
}
|
|
|
|
const inlineStyle = {
|
|
display: 'inline-block',
|
|
backdrop: 'static',
|
|
}
|
|
|
|
class ChangeStorageModal extends React.Component {
|
|
|
|
state = {
|
|
open: false,
|
|
storageValue: ``,
|
|
};
|
|
|
|
handleClickOpen = () => {
|
|
this.setState({ open: true });
|
|
};
|
|
|
|
handleRequestClose = () => {
|
|
this.setState({ open: false });
|
|
};
|
|
|
|
handleSubmit = () => {
|
|
this.setState({ open: false });
|
|
let changeStorageMessage = {
|
|
MessageType: "changeStorageValue",
|
|
Payload: {"ChangeStorageHashes": this.props.selectionHashes, "StorageValue": this.state.storageValue} //the selection hashes and new store value
|
|
}
|
|
|
|
console.log("Sending new Storage Location: ", changeStorageMessage);
|
|
ws.send(JSON.stringify(changeStorageMessage));
|
|
this.setState({storageValue: ``})
|
|
}
|
|
|
|
setStorageValue = (event) => {
|
|
this.setState({storageValue: event.target.value})
|
|
}
|
|
|
|
render() {
|
|
const { classes, onClose, handleRequestClose, handleSubmit } = this.props;
|
|
return (
|
|
<div style={inlineStyle}>
|
|
<IconButton onClick={this.handleClickOpen} color="primary" data-tip="Change Storage Location" style={button} centerRipple aria-label="Change Storage Location" >
|
|
<ReactTooltip place="top" type="light" effect="float" />
|
|
<StorageIcon />
|
|
</IconButton>
|
|
<Dialog open={this.state.open} onClose={this.handleRequestClose} onEscapeKeyDown={this.handleRequestClose}>
|
|
<DialogTitle>Change Storage Value</DialogTitle>
|
|
<DialogContent>
|
|
<DialogContentText>
|
|
Add a new Storage Location for selected Torrents and hit Submit
|
|
</DialogContentText>
|
|
<TextField
|
|
autoFocus
|
|
margin="dense"
|
|
id="name"
|
|
label="Storage Value"
|
|
type="text"
|
|
placeholder="Enter Storage Value Here"
|
|
fullWidth
|
|
onChange={this.setStorageValue}
|
|
/>
|
|
</DialogContent>
|
|
<DialogActions>
|
|
<Button onClick={this.handleRequestClose} color="primary">
|
|
Cancel
|
|
</Button>
|
|
<Button onClick={this.handleSubmit} color="primary">
|
|
Submit
|
|
</Button>
|
|
</DialogActions>
|
|
</Dialog>
|
|
</div>
|
|
);
|
|
}
|
|
};
|
|
|
|
|
|
const mapStateToProps = state => {
|
|
return {
|
|
selectionHashes: state.selectionHashes,
|
|
selection: state.selection,
|
|
};
|
|
}
|
|
|
|
|
|
|
|
|
|
export default connect(mapStateToProps)(ChangeStorageModal); |