diff options
| author | Jules Laplace <julescarbon@gmail.com> | 2019-04-01 19:45:15 +0200 |
|---|---|---|
| committer | Jules Laplace <julescarbon@gmail.com> | 2019-04-01 19:45:15 +0200 |
| commit | 36cda707b6b03a7b2aa10e6b17ca780797916060 (patch) | |
| tree | 34201825d669ef8d7693fde893be4a8266d5e9b1 /client | |
| parent | 83858f95425278d44e7f39177e141e7b82c0022c (diff) | |
test csv
Diffstat (limited to 'client')
| -rw-r--r-- | client/index.js | 8 | ||||
| -rw-r--r-- | client/table/citations.table.js | 28 | ||||
| -rw-r--r-- | client/table/file.table.js | 42 | ||||
| -rw-r--r-- | client/util/index.js | 9 |
4 files changed, 59 insertions, 28 deletions
diff --git a/client/index.js b/client/index.js index 668aebfb..5e36d341 100644 --- a/client/index.js +++ b/client/index.js @@ -65,14 +65,17 @@ function runApplets() { let opt = null payload.cmd = cmd payload.partz = cmdPartz + if (payload.cmd === 'load_file') { + payload.url = 'https://nyc3.digitaloceanspaces.com/megapixels/v1' + cmdPartz.shift() + return [el, payload] + } + if (payload.partz.length) { opt = payload.partz.shift().trim() if (opt.indexOf('http') === 0) { dataset = null url = opt } else if (opt.indexOf('assets') === 0) { - let pathname = window.location.pathname.replace('index.html', '') - url = 'https://nyc3.digitaloceanspaces.com/megapixels/v1' + pathname + opt dataset = null // console.log(url) } else { @@ -95,6 +98,7 @@ function runApplets() { } payload.dataset = dataset payload.url = url + console.log(payload) return [el, payload] }).filter(a => !!a) const withDataset = applets.map(a => a[1].dataset ? a[1] : null).filter(a => !!a) diff --git a/client/table/citations.table.js b/client/table/citations.table.js index f9599f5d..0092015f 100644 --- a/client/table/citations.table.js +++ b/client/table/citations.table.js @@ -2,10 +2,9 @@ import React, { Component } from 'react' import { bindActionCreators } from 'redux' import { connect } from 'react-redux' import { ReactTabulator } from 'react-tabulator' -import MultiValueFormatter from "react-tabulator/lib/formatters/MultiValueFormatter" import { Loader } from '../common' -import { toArray, toTuples } from '../util' +import { toArray, toTuples, domainFromUrl } from '../util' export const citationsColumns = [ { title: 'Title', field: 'title', sorter: 'string' }, @@ -42,13 +41,7 @@ class CitationsTable extends Component { : (citation.doi && citation.doi.length) ? citation.doi[0] : 'https://www.semanticscholar.org/paper/' + citation.id - let pdf_text - const pdf_partz = pdf_link.split('/')[2].split('.') - if (pdf_partz.length > 2 && pdf_partz[pdf_partz.length - 2].length == 2) { - pdf_text = pdf_partz.slice(-3).join('.') - } else { - pdf_text = pdf_partz.slice(-2).join('.') - } + let pdf_text = domainFromUrl(pdf_link) return { title: citation.title, institution: citation.addresses.map(a => a.name).sort().join('; '), @@ -83,13 +76,16 @@ class CitationsTable extends Component { if (!formattedCitations.length) return <Loader /> return ( <div className='citationBrowser'> - <input - type="text" - value={this.state.q} - onChange={e => this.updateFilter(e.target.value)} - className='q' - placeholder='Enter text to search citations...' - /> + <div className='citationHeader'> + <input + type="text" + value={this.state.q} + onChange={e => this.updateFilter(e.target.value)} + className='q' + placeholder='Enter text to search citations...' + /> + <a href= + </div> <ReactTabulator columns={citationsColumns} data={filteredCitations} diff --git a/client/table/file.table.js b/client/table/file.table.js index 92f5cf72..82c01ac5 100644 --- a/client/table/file.table.js +++ b/client/table/file.table.js @@ -1,25 +1,32 @@ import React, { Component } from 'react' import { bindActionCreators } from 'redux' import { connect } from 'react-redux' -import { toArray, toTuples } from '../util' +import { ReactTabulator } from 'react-tabulator' +import { toArray, toTuples, domainFromUrl } from '../util' import { Loader } from '../common' import csv from 'parse-csv' class FileTable extends Component { state = { - data: [] + keys: [], + data: [], + columns: [], } componentDidMount() { + const { payload } = this.props console.log(payload.url) fetch(payload.url, { mode: 'cors' }) .then(r => r.text()) .then(text => { try { + const keys = text.split('\n')[0].split(',').map(s => s.trim().replace(/\"/,'')) const data = csv.toJSON(text, { headers: { included: true } }) - this.setState({ data }) + // console.log(data) + const columns = this.getColumns(keys, data, payload.fields) + this.setState({ keys, data, columns }) } catch (e) { console.error("error making json:", payload.url) console.error(e) @@ -27,26 +34,41 @@ class FileTable extends Component { }) } - getColumns(payload) { - let { cmd, url, fields } = payload - return ((fields && fields.length) ? fields[0] : '').split(', ').map(field => { + getColumns(keys, data, fields) { + let titles = fields.length ? fields[0].split(', ') : keys + let numberFields = [] + let columns = keys.map((field, i) => { + const title = titles[i] || field + if (field.match('url')) { + let textField = field.replace('url', 'label') + data.forEach(el => el[textField] = domainFromUrl(el[field])) + return { + title, + field: textField, + formatter: 'link', + formatterParams: { target: "_blank", urlField: field, }, + sorter: 'string' + } + } switch (field) { + case 'images': + case 'year': + return { title, field: field.toLowerCase(), sorter: 'number' } default: - return { title: field, field: field.toLowerCase(), sorter: 'string' } + return { title, field: field.toLowerCase(), sorter: 'string' } } }) + return columns } render() { const { payload } = this.props - const { paper, citations } = payload.data - const columns = getColumns(payload) if (!this.state.data.length) { return <Loader /> } return ( <ReactTabulator - columns={citationsColumns} + columns={this.state.columns} data={this.state.data} options={{ height: 311, diff --git a/client/util/index.js b/client/util/index.js index 87d32ebb..e90e5466 100644 --- a/client/util/index.js +++ b/client/util/index.js @@ -63,6 +63,15 @@ export const percent = n => (n * 100).toFixed(1) + '%' export const px = (n, w) => Math.round(n * w) + 'px' export const clamp = (n, a, b) => n < a ? a : n < b ? n : b +export const domainFromUrl = url => { + const partz = url.split('/')[2].split('.') + if (partz.length > 2 && partz[partz.length - 2].length == 2) { + return partz.slice(-3).join('.') + } else { + return partz.slice(-2).join('.') + } +} + /* URLs */ export const preloadImage = opt => { |
