KevinMidboe/seasonedShows
1
0
Fork 0
Code Issues 20 Pull Requests 2 Packages Projects Releases 8 Wiki Activity

This now contains the button and request function for getting torrents matching a serach query given by the name of the elment. The result is passed to the child component torrentTable which renders the result in a table view.

Browse Source
This commit is contained in:
Kevin
2018-01-09 16:28:34 +01:00
parent 262093d196
commit c8a2ea9907
1 changed files with 69 additions and 61 deletions
Download Patch File Download Diff File Expand all files Collapse all files

124
client/app/components/admin/PirateSearch.jsx
View File

@@ -1,6 +1,9 @@
import React, { Component } from 'react'; import React, { Component } from 'react';
import { fetchJSON } from '../http.jsx'; import { fetchJSON } from '../http.jsx';
// Components
import TorrentTable from './torrentTable.jsx'
// Stylesheets // Stylesheets
import btnStylesheet from '../styles/buttons.jsx'; import btnStylesheet from '../styles/buttons.jsx';
@@ -10,72 +13,77 @@ import Interactive from 'react-interactive';
import Loading from '../images/loading.jsx' import Loading from '../images/loading.jsx'
class PirateSearch extends Component { class PirateSearch extends Component {
constructor() { constructor() {
super(); super();
this.state = { this.state = {
response: [], torrentResponse: undefined,
name: '', name: '',
loading: '', loading: null,
} showButton: true,
} }
}
sendToDownload(torrent) { componentWillReceiveProps(props) {
let data = {magnet: torrent.magnet} if (props.name != this.state.name) {
fetchJSON('https://apollo.kevinmidboe.com/api/v1/pirate/add', 'POST', data) this.setState({
.then((response) => { torrentResponse: undefined,
console.log(response) showButton: true,
}) })
} }
}
searchTheBay() { searchTheBay() {
const query = this.props.name; const query = this.props.name;
const type = this.props.type; const type = this.props.type;
this.setState({ this.setState({
loading: <Loading /> showButton: false,
}) loading: <Loading />,
})
fetchJSON('https://apollo.kevinmidboe.com/api/v1/pirate/search?query='+query+'&type='+type, 'GET') fetchJSON('https://apollo.kevinmidboe.com/api/v1/pirate/search?query='+query+'&type='+type, 'GET')
.then((response) => { // fetchJSON('http://localhost:31459/api/v1/pirate/search?query='+query+'&type='+type, 'GET')
console.log(response.torrents) .then((response) => {
this.setState({ this.setState({
loading: '', torrentResponse: response.torrents,
response: response.torrents.map((torrent, index) => { loading: null,
return ( })
<div key={index}> })
<span>{torrent.name}</span><br /> .catch((error) => {
<span>{torrent.size}</span><br /> console.error(error);
<span>{torrent.seed}</span><br /> this.setState({
<button onClick={() => {this.sendToDownload(torrent)}}>Send to download</button> showButton: true,
<br /><br /> })
</div> })
) }
})
})
})
}
render() { render() {
return ( btnStylesheet.submit.top = '50%'
<div> btnStylesheet.submit.position = 'absolute'
<div> btnStylesheet.submit.marginLeft = '-75px'
<Interactive
as='button'
onClick={() => {this.searchTheBay()}}
style={btnStylesheet.submit}
focus={btnStylesheet.submit_hover}
hover={btnStylesheet.submit_hover}>
<span style={{whiteSpace: 'nowrap'}}>Search for torrents</span> return (
</Interactive> <div>
</div> { this.state.showButton ?
<div style={{textAlign:'center'}}>
<Interactive
as='button'
onClick={() => {this.searchTheBay()}}
style={btnStylesheet.submit}
focus={btnStylesheet.submit_hover}
hover={btnStylesheet.submit_hover}>
{ this.state.loading } <span style={{whiteSpace: 'nowrap'}}>Search for torrents</span>
</Interactive>
</div>
: null }
<span>{this.state.response}</span> { this.state.loading }
</div>
) <TorrentTable response={this.state.torrentResponse} />
} </div>
)
}
} }
export default PirateSearch export default PirateSearch