diff options
| author | Jules Laplace <julescarbon@gmail.com> | 2019-02-13 19:19:10 +0100 |
|---|---|---|
| committer | Jules Laplace <julescarbon@gmail.com> | 2019-02-13 19:19:10 +0100 |
| commit | 5c176ce457f195dfad15d0c7d01d36fc2f9fdbdd (patch) | |
| tree | 5b86773170303e86edf54c135b9fb4750cbb3df2 | |
| parent | 83063b97105c7514d71ec2afaaf66def49116214 (diff) | |
possible PDF embed
| -rw-r--r-- | client/geocode/geocode.component.js | 25 | ||||
| -rw-r--r-- | client/geocode/index.js | 10 | ||||
| -rw-r--r-- | scraper/client/common/activeLink.component.js | 16 | ||||
| -rw-r--r-- | scraper/client/common/autocomplete.component.js (renamed from client/geocode/autocomplete.component.js) | 0 | ||||
| -rw-r--r-- | scraper/client/common/index.js | 4 | ||||
| -rw-r--r-- | scraper/client/paper/paper.address.js | 85 | ||||
| -rw-r--r-- | scraper/client/paper/paper.citations.js | 3 | ||||
| -rw-r--r-- | scraper/client/paper/paper.css | 12 | ||||
| -rw-r--r-- | scraper/client/paper/paper.manager.js | 4 | ||||
| -rw-r--r-- | scraper/client/paper/paper.unknown.js | 4 |
10 files changed, 97 insertions, 66 deletions
diff --git a/client/geocode/geocode.component.js b/client/geocode/geocode.component.js deleted file mode 100644 index e57d238d..00000000 --- a/client/geocode/geocode.component.js +++ /dev/null @@ -1,25 +0,0 @@ -import React, { Component } from 'react' - -import Autocomplete from './autocomplete.component' - -class GeocodeContainer extends Component { - // constructor() { - // super() - // } - render() { - // const { } = this.props - return ( - <div className=''> - <select> - {} - </select> - <div> - <Autocomplete /> - </div> - </div> - ) - } -} - - -export default GeocodeContainer diff --git a/client/geocode/index.js b/client/geocode/index.js deleted file mode 100644 index 4f0da3f6..00000000 --- a/client/geocode/index.js +++ /dev/null @@ -1,10 +0,0 @@ -import React from 'react' -import ReactDOM from 'react-dom' - -// import { toArray } from '../util' - -import GeocodeContainer from './autocomplete.component' - -ReactDOM.render( - <GeocodeContainer />, document.querySelector('#container') -) diff --git a/scraper/client/common/activeLink.component.js b/scraper/client/common/activeLink.component.js deleted file mode 100644 index 59f63881..00000000 --- a/scraper/client/common/activeLink.component.js +++ /dev/null @@ -1,16 +0,0 @@ -import React from 'react' -import { NavLink } from 'react-router-dom' - -export default function ActiveLink({ - to, - className = 'navlink', - children -}) { - return ( - <span className={className}> - <NavLink to={to}> - {children} - </NavLink> - </span> - ) -} diff --git a/client/geocode/autocomplete.component.js b/scraper/client/common/autocomplete.component.js index 12419cf1..12419cf1 100644 --- a/client/geocode/autocomplete.component.js +++ b/scraper/client/common/autocomplete.component.js diff --git a/scraper/client/common/index.js b/scraper/client/common/index.js index c5b4af5b..8ced56b3 100644 --- a/scraper/client/common/index.js +++ b/scraper/client/common/index.js @@ -1,8 +1,8 @@ -import ActiveLink from './activeLink.component' import Header from './header.component' import Footer from './footer.component' import Loader from './loader.component' import Gate from './gate.component' +import Autocomplete from './autocomplete.component' import { TableObject, TableArray, TableTuples, TableRow, TableCell } from './table.component' import './common.css' @@ -16,5 +16,5 @@ export { TableTuples, TableRow, TableCell, - ActiveLink, + Autocomplete, } diff --git a/scraper/client/paper/paper.address.js b/scraper/client/paper/paper.address.js index 2240388f..6d02c3db 100644 --- a/scraper/client/paper/paper.address.js +++ b/scraper/client/paper/paper.address.js @@ -4,27 +4,98 @@ import { connect } from 'react-redux' import * as actions from '../actions' -// import { Loader } from '../common' +import { Loader, Autocomplete } from '../common' +const initialState = { + citation: null, + institution_1: '', + institution_2: '', + institution_3: '', + institution_4: '', +} class PaperAddress extends Component { + state = { + ...initialState + } + componentDidMount() { const { sha256 } = this.props.match.params this.props.actions.getAddress(sha256) + const citation = this.getCitation(sha256) + this.setState({ citation }) } - componentDidUpdate(newProps) { - const { sha256: oldSha256 } = this.props.match.params - const { sha256 } = newProps.match.params - if (sha256 !== oldSha256) { - this.props.actions.getPaperInfo(this.props.match.params.key) + componentDidUpdate(oldProps) { + const { sha256 } = this.props.match.params + const { address } = this.props.api + const { sha256: oldSha256 } = oldProps.match.params + const { address: oldAddress } = oldProps.api + const oldPaper = oldAddress ? oldAddress.paper : null + const paper = address ? address.paper : null + + if (oldSha256 && sha256 !== oldSha256) { + console.log('update address') + this.props.actions.getAddress(sha256) + const citation = this.getCitation(sha256) + this.setState({ + ...initialState, + citation + }) + } else if (address && !address.loading && address.paper && (!oldPaper || oldPaper !== address.paper)) { + if (paper.error) { + const citation = this.getCitation(sha256) + this.setState({ + ...initialState, + citation, + }) + } else { + console.log(paper) + const citation = this.getCitation(sha256) + this.setState({ + citation, + institution_1: paper['Institution #1'], + institution_2: paper['Institution #2'], + institution_3: paper['Institution #3'], + institution_4: paper['Institution #4'], + }) + } + } else if (oldProps.api.unknownCitations !== this.props.api.unknownCitations) { + const citation = this.getCitation(sha256) + this.setState({ citation }) } } + getCitation(sha256) { + const { paperInfo, unknownCitations } = this.props.api + let citation = (unknownCitations.citations || []).find(f => f.id === sha256) + if (!citation) { + citation = (paperInfo.citations || []).find(f => f.id === sha256) + } + console.log(sha256, citation) + return citation + } + render() { // if (!this.props.match.params.key) return null // if (this.props.api.address.loading) return <Loader /> // if (!this.props.api.paperInfo.dataset) return <div className='paperInfo'>Metadata not found</div> - return null + let { paperInfo, unknownCitations } = this.props.api + if (paperInfo.loading || unknownCitations.loading) return <Loader /> + console.log(this.state) + const { citation } = this.state + if (!citation) { + return <div>Citation not found in this paper</div> + } + return ( + <div className='form'> + <h3>{citation.title}</h3> + <div className='gray'>{citation.id}</div> + {this.state.institution_1} + {/* + <iframe className='pdfViewer' src={citation.pdf} /> + */} + </div> + ) } } diff --git a/scraper/client/paper/paper.citations.js b/scraper/client/paper/paper.citations.js index de423a77..1789a815 100644 --- a/scraper/client/paper/paper.citations.js +++ b/scraper/client/paper/paper.citations.js @@ -1,6 +1,7 @@ import React, { Component } from 'react' import { bindActionCreators } from 'redux' import { connect } from 'react-redux' +import { Link } from 'react-router-dom' import * as actions from '../actions' @@ -19,7 +20,7 @@ class PaperCitations extends Component { let cite = { ...citation } cite.id = { _raw: true, - value: <a href={'/api/address/' + dataset.key + '/' + citation.id}>{citation.id}</a> + value: <Link to={'/paper/' + dataset.key + '/address/' + citation.id}>{citation.id}</Link> } cite.pdf = { _raw: true, diff --git a/scraper/client/paper/paper.css b/scraper/client/paper/paper.css index cd2f8529..0977dcb3 100644 --- a/scraper/client/paper/paper.css +++ b/scraper/client/paper/paper.css @@ -1,5 +1,6 @@ -.paperInfo { +.form, .paperInfo { padding: 10px; + width: 100%; } .citations ul { @@ -16,4 +17,13 @@ .type { color: #888; +} +.gray { + padding: 3px; +} +iframe.pdfViewer { + margin: 10px 0; + width: 100%; + height: 50vh; + border: 1px solid black; }
\ No newline at end of file diff --git a/scraper/client/paper/paper.manager.js b/scraper/client/paper/paper.manager.js index c52722e7..2ac03b01 100644 --- a/scraper/client/paper/paper.manager.js +++ b/scraper/client/paper/paper.manager.js @@ -11,8 +11,8 @@ class PaperManager extends Component { this.props.actions.getPaperInfo(this.props.match.params.key) } - componentDidUpdate(newProps) { - if (this.props.match.params.key !== newProps.match.params.key) { + componentDidUpdate(oldProps) { + if (this.props.match.params.key !== oldProps.match.params.key) { this.props.actions.getPaperInfo(this.props.match.params.key) } } diff --git a/scraper/client/paper/paper.unknown.js b/scraper/client/paper/paper.unknown.js index 7a20f398..0cb7d2da 100644 --- a/scraper/client/paper/paper.unknown.js +++ b/scraper/client/paper/paper.unknown.js @@ -1,6 +1,7 @@ import React, { Component } from 'react' import { bindActionCreators } from 'redux' import { connect } from 'react-redux' +import { Link } from 'react-router-dom' import * as actions from '../actions' @@ -20,7 +21,7 @@ class PaperUnknown extends Component { let cite = { ...citation } cite.id = { _raw: true, - value: <a href={'/api/address/' + dataset.key + '/' + citation.id}>{citation.id}</a> + value: <Link to={'/paper/' + dataset.key + '/address/' + citation.id}>{citation.id}</Link> } cite.pdf = { _raw: true, @@ -41,7 +42,6 @@ class PaperUnknown extends Component { ) } } - // order={['id', 'pdf', 'year']} const mapStateToProps = state => ({ api: state.api |
