diff options
Diffstat (limited to 'scraper/client/paper/paper.verify.js')
| -rw-r--r-- | scraper/client/paper/paper.verify.js | 286 |
1 files changed, 226 insertions, 60 deletions
diff --git a/scraper/client/paper/paper.verify.js b/scraper/client/paper/paper.verify.js index 5f85a551..61faa24a 100644 --- a/scraper/client/paper/paper.verify.js +++ b/scraper/client/paper/paper.verify.js @@ -3,20 +3,28 @@ import { bindActionCreators } from 'redux' import { connect } from 'react-redux' import * as actions from '../actions' - import { history } from '../store' - import { Loader, Autocomplete } from '../common' +import { USES_DATASET } from '../types' const initialState = { citation: null, - uses_dataset: false, - doesnt_use_dataset: true, - images_in_paper: false, + address: {}, + uses_dataset: USES_DATASET.UNKNOWN, + images_in_paper: "FALSE", + used_as_model: "FALSE", verified_by: localStorage.getItem('verify.username') || '', reference: '', notes: '', + location: '', pdf_index: 0, + isUnknown: false, + institution_1: '', + institution_2: '', + institution_3: '', + validate_1: false, + validate_2: false, + validate_3: false, } class PaperVerify extends Component { @@ -27,6 +35,7 @@ class PaperVerify extends Component { componentDidMount() { const { sha256 } = this.props.match.params this.props.actions.getInstitutions() + this.props.actions.getAddress(sha256) this.props.actions.getVerification(sha256) const citationState = this.getCitationState(sha256) console.log('DID MOUNT') @@ -35,53 +44,67 @@ class PaperVerify extends Component { componentDidUpdate(oldProps) { const { sha256 } = this.props.match.params - const { verify } = this.props.api + const { address, verify } = this.props.api const { sha256: oldSha256 } = oldProps.match.params - const { verify: oldVerify } = oldProps.api + const { verify: oldVerify, address: oldAddress } = oldProps.api const oldPaper = oldVerify ? oldVerify.paper : null const paper = verify ? verify.paper : null + let newState = {} if (oldSha256 && sha256 !== oldSha256) { console.log('update verification') + this.props.actions.getAddress(sha256) this.props.actions.getVerification(sha256) const citationState = this.getCitationState(sha256) - this.setState({ + newState = { ...initialState, ...citationState, - }) + ...address.paper, + } + this.setState(newState) } else if (verify && !verify.loading && verify.paper && (!oldPaper || oldPaper !== verify.paper)) { if (paper.error) { console.log('USING PAPER VERIFICATION') const citationState = this.getCitationState(sha256) - this.setState({ + newState = { ...initialState, ...citationState, - }) + ...address.paper, + } + this.setState(newState) } else { // console.log(paper) console.log('GOT CUSTOM CITATION STATE', paper) const citationState = this.getCitationState(sha256) - this.setState({ + newState = { ...citationState, - uses_dataset: paper.uses_dataset === "TRUE", - doesnt_use_dataset: paper.doesnt_use_dataset === "TRUE", - images_in_paper: paper.images_in_paper === "TRUE", + ...address.paper, + uses_dataset: paper.uses_dataset, + images_in_paper: paper.images_in_paper, verified_by: paper.verified_by, reference: paper.reference, notes: paper.notes, - }) + } + this.setState(newState) } } else if (oldProps.api.unknownCitations !== this.props.api.unknownCitations) { + console.log('loaded unknown citations') const citationState = this.getCitationState(sha256) - this.setState(citationState) + newState = citationState + this.setState(newState) } } getCitationState(sha256) { const { paperInfo, unknownCitations } = this.props.api let citation = (unknownCitations.citations || []).find(f => f.id === sha256) - if (!citation) { + if (citation) { + citation.isUnknown = true + } else { citation = (paperInfo.citations || []).find(f => f.id === sha256) + if (citation) { + citation.isUnknown = false + } } // console.log(sha256, citation) let state = { citation } @@ -103,12 +126,19 @@ class PaperVerify extends Component { title: this.state.citation.title, dataset: this.props.api.paperInfo.dataset.key, uses_dataset: this.state.uses_dataset, - doesnt_use_dataset: this.state.doesnt_use_dataset, images_in_paper: this.state.images_in_paper, + used_as_model: this.state.used_as_model, verified_by: this.state.verified_by, reference: this.state.reference, notes: this.state.notes, date: dateString, + isUnknown: this.state.citation.isUnknown, + institution_1: this.state.institution_1, + validate_1: this.state.validate_1, + institution_2: this.state.institution_2, + validate_2: this.state.validate_2, + institution_3: this.state.institution_3, + validate_3: this.state.validate_3, }) this.next(false) } @@ -150,7 +180,7 @@ class PaperVerify extends Component { } render() { - let { paperInfo } = this.props.api + const { paperInfo, unknownCitations } = this.props.api if (paperInfo.loading) return <Loader /> // console.log(this.state) const { citation } = this.state @@ -169,6 +199,7 @@ class PaperVerify extends Component { return ( <a key={i} + href={pdf} onClick={() => this.setState({ pdf_index: i })} className={i === this.state.pdf_index ? 'selected pdfLink' : 'pdfLink'} > @@ -186,45 +217,117 @@ class PaperVerify extends Component { </a> </div> - <div className='param'> - <label>Uses the dataset?</label> - <input - className='vetting' - type='radio' - name='uses_dataset' - checked={!!this.state.uses_dataset} - onChange={e => this.setState({ - uses_dataset: e.target.checked, - doesnt_use_dataset: !e.target.checked, - })} - /> + {this.renderLocationForm()} + + <div className='row vettingRow'> + <div className='rowHeading'> + {'Uses dataset'} + </div> + <label> + <input + className='vetting' + type='radio' + name='uses_dataset' + checked={String(this.state.uses_dataset) === USES_DATASET.YES} + onChange={e => this.setState({ + uses_dataset: USES_DATASET.YES, + })} + /> + <div>{"Yes"}</div> + </label> + + <label> + <input + className='vetting' + type='radio' + name='uses_dataset' + checked={String(this.state.uses_dataset) === USES_DATASET.NO} + onChange={e => this.setState({ + uses_dataset: USES_DATASET.NO, + })} + /> + <div>{"No"}</div> + </label> + + <label> + <input + className='vetting' + type='radio' + name='uses_dataset' + checked={String(this.state.uses_dataset) !== USES_DATASET.YES && String(this.state.uses_dataset) !== USES_DATASET.NO} + onChange={e => this.setState({ + uses_dataset: USES_DATASET.UNKNOWN, + })} + /> + <div>{"Not enough information"}</div> + </label> </div> - <div className='param'> - <label>{"Doesn't use dataset"}</label> - <input - className='vetting' - type='radio' - name='uses_dataset' - checked={!!this.state.doesnt_use_dataset} - onChange={e => this.setState({ - uses_dataset: !e.target.checked, - doesnt_use_dataset: e.target.checked - })} - /> + <div + className={String(this.state.uses_dataset) === USES_DATASET.YES ? 'row vettingRow' : 'row vettingRow disabled'} + disabled={String(this.state.uses_dataset) === USES_DATASET.YES ? false : true} + > + <div className='rowHeading'> + {'Paper shows images'} + </div> + + <label> + <input + className='vetting' + type='radio' + name='images_in_paper' + checked={this.state.images_in_paper === "TRUE"} + onChange={e => this.setState({ + images_in_paper: "TRUE", + })} + /> + <div>{"Yes"}</div> + </label> + + <label> + <input + className='vetting' + type='radio' + name='images_in_paper' + checked={this.state.images_in_paper === "FALSE"} + onChange={e => this.setState({ + images_in_paper: "FALSE", + })} + /> + <div>{"No"}</div> + </label> </div> - <div className='param'> - <label>{"Uses images from dataset"}</label> - <input - className='vetting' - type='checkbox' - name='images_in_paper' - checked={!!this.state.images_in_paper} - onChange={e => this.setState({ - images_in_paper: e.target.checked, - })} - /> + <div className='row vettingRow'> + <div className='rowHeading'> + {'Used as model'} + </div> + + <label> + <input + className='vetting' + type='radio' + name='used_as_model' + checked={this.state.used_as_model === "TRUE"} + onChange={e => this.setState({ + used_as_model: "TRUE", + })} + /> + <div>{"Yes"}</div> + </label> + + <label> + <input + className='vetting' + type='radio' + name='used_as_model' + checked={this.state.used_as_model === "FALSE"} + onChange={e => this.setState({ + used_as_model: "FALSE", + })} + /> + <div>{"No"}</div> + </label> </div> <div className='param'> @@ -244,10 +347,10 @@ class PaperVerify extends Component { rows={3} cols={50} type='text' - className='notes' - value={this.state.notes} - placeholder='Notes' - onChange={e => this.setState({ notes: e.target.value })} + className='reference' + value={this.state.reference} + placeholder='Reference' + onChange={e => this.setState({ reference: e.target.value })} /> </div> @@ -274,7 +377,7 @@ class PaperVerify extends Component { <button className='btn' onClick={this.prev.bind(this)} - >{'Prev >'}</button> + >{'< Prev'}</button> <button className='btn' @@ -286,8 +389,71 @@ class PaperVerify extends Component { </div> ) } + renderLocationForm() { + if (!this.state.citation.isUnknown) return + return ( + <div> + <div className='param'> + <label>Institution #1</label> + <Autocomplete + placeholder='Institution #1' + value={this.state.institution_1} + onSelect={(institution_1, validate_1) => { + this.setState({ institution_1, validate_1 }) + }} + onCancel={value => { + this.setState({ institution_1: '', validate_1: false }) + }} + /> + </div> + + <div className='param'> + <label>Institution #2</label> + <Autocomplete + placeholder='Institution #2' + value={this.state.institution_2} + onSelect={(institution_2, validate_2) => { + this.setState({ institution_2, validate_2 }) + }} + onCancel={value => { + this.setState({ institution_2: '', validate_2: false }) + }} + /> + </div> + + <div className='param'> + <label>Institution #3</label> + <Autocomplete + placeholder='Institution #3' + value={this.state.institution_3} + onSelect={(institution_3, validate_3) => { + this.setState({ institution_3, validate_3 }) + }} + onCancel={value => { + this.setState({ institution_3: '', validate_3: false }) + }} + /> + </div> + </div> + ) + } } +/* + <div className='param'> + <label>{"Verifiable"}</label> + <input + className='vetting' + type='checkbox' + name='verifiable' + checked={!!this.state.verifiable} + onChange={e => this.setState({ + verifiable: e.target.checked, + })} + /> + </div> +*/ + const mapStateToProps = state => ({ api: state.api, }) |