summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorJules Laplace <julescarbon@gmail.com>2019-02-13 22:56:35 +0100
committerJules Laplace <julescarbon@gmail.com>2019-02-13 22:56:35 +0100
commit41247c08ea359d0a72a247992d2019ae2120536c (patch)
tree89becc97e6831dd95cb5d96b297a2ce5d4395009
parenta2f1969b2c7c185e04e19c22a83245ad22f8df0c (diff)
interface working
-rw-r--r--scraper/client/actions.js4
-rw-r--r--scraper/client/common/autocomplete.component.js11
-rw-r--r--scraper/client/common/common.css3
-rw-r--r--scraper/client/common/header.component.js14
-rw-r--r--scraper/client/paper/paper.address.js71
-rw-r--r--scraper/client/paper/paper.css16
-rw-r--r--scraper/client/store.js6
-rw-r--r--scraper/client/types.js2
-rw-r--r--scraper/s2-geocode-server.py26
9 files changed, 110 insertions, 43 deletions
diff --git a/scraper/client/actions.js b/scraper/client/actions.js
index 2723deed..4e1fd620 100644
--- a/scraper/client/actions.js
+++ b/scraper/client/actions.js
@@ -3,7 +3,7 @@ import * as types from './types'
export const api = (dispatch, method, tag, url, params) => {
dispatch({ type: types.api.loading, tag })
- get(url, params).then(data => {
+ method(url, params).then(data => {
dispatch({ type: types.api.loaded, tag, data })
}).catch(err => {
dispatch({ type: types.api.error, tag, err })
@@ -18,7 +18,7 @@ export const getPapers = () => dispatch => {
api(dispatch, get, 'papers', '/api/papers', {})
}
-export const getPaperInfo = (key) => dispatch => {
+export const getPaperInfo = key => dispatch => {
api(dispatch, get, 'paperInfo', '/reports/datasets/final/' + key + '.json', {})
api(dispatch, get, 'unknownCitations', '/reports/datasets/unknown/' + key + '.json', {})
}
diff --git a/scraper/client/common/autocomplete.component.js b/scraper/client/common/autocomplete.component.js
index 03039b1c..e2908cd1 100644
--- a/scraper/client/common/autocomplete.component.js
+++ b/scraper/client/common/autocomplete.component.js
@@ -70,9 +70,9 @@ class Autocomplete extends Component {
componentDidUpdate(oldProps) {
if (this.props.vetting !== oldProps.vetting) {
- this.handleChange({ target: { value: this.props.vetting }})
+ this.handleChange({ target: { value: this.props.vetting } })
} else if (this.props.value !== oldProps.value) {
- this.handleChange({ target: { value: this.props.value }})
+ this.setState({ q: '' })
}
}
@@ -155,13 +155,14 @@ class Autocomplete extends Component {
}
handleSelect(name) {
+ console.log('select', name)
if (this.props.onSelect) this.props.onSelect(name)
- this.setState({ q: "", selected: 0, matches: [] })
+ this.setState({ q: name, selected: 0, matches: [] })
}
handleCancel() {
if (this.props.onCancel) this.props.onCancel()
- this.setState({ q: "", selected: 0, matches: [] })
+ this.setState({ q: '', selected: 0, matches: [] })
}
render() {
@@ -184,7 +185,7 @@ class Autocomplete extends Component {
<input
type="text"
name="q"
- value={this.state.q}
+ value={this.state.q || this.props.value}
onKeyDown={this.handleKeyDown}
onChange={this.handleChange}
autoFocus={this.props.autoFocus}
diff --git a/scraper/client/common/common.css b/scraper/client/common/common.css
index fb31aefb..7fdaf01c 100644
--- a/scraper/client/common/common.css
+++ b/scraper/client/common/common.css
@@ -63,12 +63,13 @@ header > section {
justify-content: flex-start;
align-items: center;
display: flex;
- flex: 1 0;
+ flex: 2 0;
font-weight: bold;
padding: 10px;
}
header > section:last-of-type {
justify-content: flex-end;
+ flex: 1 0;
}
/* sidebar / body columns */
diff --git a/scraper/client/common/header.component.js b/scraper/client/common/header.component.js
index 0cd67c76..4da5af8a 100644
--- a/scraper/client/common/header.component.js
+++ b/scraper/client/common/header.component.js
@@ -21,16 +21,26 @@ class Header extends Component {
render() {
let { papers } = this.props.api.papers
+ let { dataset } = this.props.api.paperInfo
papers = papers || {}
const paperOptions = Object.keys(papers).map(key => (
- <option key={key} value={key}>{papers[key][1]}</option>
+ <option key={key} value={key}>{papers[key].name}</option>
))
return (
<header>
<section>
- <select onChange={this.pickPaper.bind(this)}>
+ <select value={dataset && dataset.key} onChange={this.pickPaper.bind(this)}>
{paperOptions}
</select>
+ {dataset &&
+ <div>
+ {dataset.name_full}{' - '}
+ <a href={"/paper/" + dataset.key + "/info"}>Info</a>{' - '}
+ <a href={"/paper/" + dataset.key + "/citations/"}>Citations</a>{' - '}
+ <a href={"/paper/" + dataset.key + "/unknown/"}>Unknown</a>{' - '}
+ <a href={"/paper/" + dataset.key + "/random/"}>Random</a>
+ </div>
+ }
</section>
<section></section>
</header>
diff --git a/scraper/client/paper/paper.address.js b/scraper/client/paper/paper.address.js
index ff2bf032..09b20758 100644
--- a/scraper/client/paper/paper.address.js
+++ b/scraper/client/paper/paper.address.js
@@ -4,6 +4,8 @@ import { connect } from 'react-redux'
import * as actions from '../actions'
+import { history } from '../store'
+
import { Loader, Autocomplete } from '../common'
const initialState = {
@@ -16,6 +18,7 @@ const initialState = {
institution_2_vetting: '',
institution_3_vetting: '',
institution_4_vetting: '',
+ notes: '',
}
class PaperAddress extends Component {
state = {
@@ -25,8 +28,9 @@ class PaperAddress extends Component {
componentDidMount() {
const { sha256 } = this.props.match.params
this.props.actions.getAddress(sha256)
- const citation = this.getCitation(sha256)
- this.setState({ citation })
+ const citationState = this.getCitationState(sha256)
+ console.log('DID MOUNT')
+ this.setState(citationState)
}
componentDidUpdate(oldProps) {
@@ -40,23 +44,25 @@ class PaperAddress extends Component {
if (oldSha256 && sha256 !== oldSha256) {
console.log('update address')
this.props.actions.getAddress(sha256)
- const citation = this.getCitation(sha256)
+ const citationState = this.getCitationState(sha256)
this.setState({
...initialState,
- citation
+ ...citationState,
})
} else if (address && !address.loading && address.paper && (!oldPaper || oldPaper !== address.paper)) {
if (paper.error) {
- const citation = this.getCitation(sha256)
+ console.log('USING PAPER ADDRESS')
+ const citationState = this.getCitationState(sha256)
this.setState({
...initialState,
- citation,
+ ...citationState,
})
} else {
// console.log(paper)
- const citation = this.getCitation(sha256)
+ console.log('GOT CUSTOM ADDRESS')
+ const citationState = this.getCitationState(sha256)
this.setState({
- citation,
+ ...citationState,
institution_1: paper.institution_1,
institution_2: paper.institution_2,
institution_3: paper.institution_3,
@@ -68,24 +74,31 @@ class PaperAddress extends Component {
})
}
} else if (oldProps.api.unknownCitations !== this.props.api.unknownCitations) {
- const citation = this.getCitation(sha256)
- this.setState({ citation })
+ const citationState = this.getCitationState(sha256)
+ this.setState(citationState)
}
}
- getCitation(sha256) {
+ getCitationState(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
+ let state = { citation }
+ let addresses = citation ? citation.addresses : []
+ if (addresses) {
+ addresses.forEach((address, i) => {
+ state['institution_' + (i + 1)] = address.address
+ })
+ }
+ return state
}
save() {
console.log(this.state)
- this.actions.postAddress({
+ this.props.actions.postAddress({
paper_id: this.state.citation.id,
title: this.state.citation.title,
institution_1: this.state.institution_1,
@@ -96,7 +109,9 @@ class PaperAddress extends Component {
institution_2_vetting: this.state.institution_2_vetting,
institution_3_vetting: this.state.institution_3_vetting,
institution_4_vetting: this.state.institution_4_vetting,
+ notes: this.state.notes,
})
+ history.push('/paper/' + this.props.api.paperInfo.dataset.key + '/random/')
}
render() {
@@ -118,6 +133,7 @@ class PaperAddress extends Component {
autoFocus
className='vetting'
type='text'
+ value={this.state.institution_1_vetting}
placeholder='Paste Institution #1'
onChange={e => this.setState({
institution_1_vetting: e.target.value,
@@ -127,7 +143,6 @@ class PaperAddress extends Component {
autoFocus={false}
placeholder='Institution #1'
value={this.state.institution_1}
- vetting={this.state.institution_1_vetting}
onSelect={value => {
this.setState({ institution_1: value })
// this.institution_2._el.focus()
@@ -141,6 +156,7 @@ class PaperAddress extends Component {
className='vetting'
type='text'
placeholder='Paste Institution #2'
+ value={this.state.institution_2_vetting}
onChange={e => this.setState({
institution_2_vetting: e.target.value,
})}
@@ -160,6 +176,7 @@ class PaperAddress extends Component {
className='vetting'
type='text'
placeholder='Paste Institution #3'
+ value={this.state.institution_3_vetting}
onChange={e => this.setState({
institution_3_vetting: e.target.value,
})}
@@ -180,6 +197,7 @@ class PaperAddress extends Component {
className='vetting'
type='text'
placeholder='Paste Institution #4'
+ value={this.state.institution_4_vetting}
onChange={e => this.setState({
institution_4_vetting: e.target.value,
})}
@@ -195,12 +213,25 @@ class PaperAddress extends Component {
/>
</div>
- <button
- className='btn btn-primary'
- onClick={this.save.bind(this)}
- ref={ref => this.button = ref}
- >Save Institutions</button>
- <iframe className='pdfViewer' src={citation.pdf} />
+ <div className='param'>
+ <input
+ type='text'
+ className='notes'
+ value={this.state.notes}
+ placeholder='Notes'
+ onChange={e => this.setState({ notes: e.target.value })}
+ />
+ </div>
+
+ <div className='param'>
+ <button
+ className='btn btn-primary'
+ onClick={this.save.bind(this)}
+ ref={ref => this.button = ref}
+ >Save Institutions</button>
+ </div>
+
+ <iframe className='pdfViewer' src={citation.pdf} />
</div>
)
}
diff --git a/scraper/client/paper/paper.css b/scraper/client/paper/paper.css
index c10d21df..430face4 100644
--- a/scraper/client/paper/paper.css
+++ b/scraper/client/paper/paper.css
@@ -29,6 +29,10 @@
justify-content: flex-start;
align-items: flex-start;
}
+input.notes { width: 400px; }
+.param .btn {
+ margin-top: 5px;
+}
.vetting {
width: 250px;
margin-right: 10px;
@@ -39,4 +43,16 @@ iframe.pdfViewer {
width: 100%;
height: 75vh;
border: 1px solid black;
+}
+header select {
+ margin-right: 10px;
+ width: 100px;
+}
+header a {
+ color: white;
+ text-decoration: none;
+ font-weight: normal;
+}
+.desktop header a:hover {
+ text-decoration: underline;
} \ No newline at end of file
diff --git a/scraper/client/store.js b/scraper/client/store.js
index 3bf64114..8649d472 100644
--- a/scraper/client/store.js
+++ b/scraper/client/store.js
@@ -37,6 +37,12 @@ export default function apiReducer(state = initialState(), action) {
[action.tag]: { error: action.err },
}
+ case types.api.set_paper_key:
+ return {
+ ...state,
+ paperKey: action.paperKey
+ }
+
default:
return state
}
diff --git a/scraper/client/types.js b/scraper/client/types.js
index 8507d556..53c0cff0 100644
--- a/scraper/client/types.js
+++ b/scraper/client/types.js
@@ -7,7 +7,7 @@ export const tagAsType = (type, names) => (
)
export const api = tagAsType('api', [
- 'loading', 'loaded', 'error',
+ 'loading', 'loaded', 'error', 'set_paper_key',
])
export const init = '@@INIT'
diff --git a/scraper/s2-geocode-server.py b/scraper/s2-geocode-server.py
index beac75e3..edf768aa 100644
--- a/scraper/s2-geocode-server.py
+++ b/scraper/s2-geocode-server.py
@@ -69,19 +69,21 @@ def find_address(sha256):
@app.route('/api/address/add', methods=['POST'])
def add_address():
+ form = request.get_json()
+ print(form)
# id, title, institution_1, institution_2, institution_3, institution_4, notes
- locations_worksheet.insert_row([
- request.form['paper_id'],
- request.form['title'],
- request.form['institution_1'],
- request.form['institution_1_vetting'],
- request.form['institution_2'],
- request.form['institution_2_vetting'],
- request.form['institution_3'],
- request.form['institution_3_vetting'],
- request.form['institution_4'],
- request.form['institution_4_vetting'],
- request.form['notes'],
+ locations_worksheet.append_row([
+ form['paper_id'],
+ form['title'],
+ form['institution_1'],
+ form['institution_1_vetting'],
+ form['institution_2'],
+ form['institution_2_vetting'],
+ form['institution_3'],
+ form['institution_3_vetting'],
+ form['institution_4'],
+ form['institution_4_vetting'],
+ form['notes'],
])
return jsonify({
'status': 'ok'