From 7268da9248b89c4b020890ab6f4c86982501b342 Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Mon, 1 Apr 2019 10:45:19 +0200 Subject: reworking citations table --- client/table/tabulator.css | 26 ++++++++++++++++++++++++++ 1 file changed, 26 insertions(+) create mode 100644 client/table/tabulator.css (limited to 'client/table/tabulator.css') diff --git a/client/table/tabulator.css b/client/table/tabulator.css new file mode 100644 index 00000000..24005368 --- /dev/null +++ b/client/table/tabulator.css @@ -0,0 +1,26 @@ +.tabulator { + border-left: 1px solid #333; + border-bottom: 1px solid #333; +} +.tabulator-row.tabulator-row-odd { + background-color: #222; +} +.tabulator-row.tabulator-row-even { + background-color: #333; +} +.desktop .tabulator-row.tabulator-selectable:hover { + background-color: #555; +} +.tabulator-row .tabulator-cell { + border-right: 1px solid #444; + padding: 8px; +} +.tabulator .tabulator-header { + border-bottom: 0; +} +.tabulator .tabulator-header .tabulator-col { + border-right: 1px solid #444; +} +.tabulator .tabulator-tableHolder .tabulator-table { + background-color: #333; +} \ No newline at end of file -- cgit v1.2.3-70-g09d2 From bca367770c426a6f2086c53b2e821a7a35de4e4f Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Mon, 1 Apr 2019 17:21:21 +0200 Subject: build --- client/table/citations.table.js | 84 +++++++++++++++++++++++++++++--------- client/table/tabulator.css | 9 ++++ scraper/client/paper/paper.info.js | 9 +++- 3 files changed, 80 insertions(+), 22 deletions(-) (limited to 'client/table/tabulator.css') diff --git a/client/table/citations.table.js b/client/table/citations.table.js index f65998aa..4ee1a0c9 100644 --- a/client/table/citations.table.js +++ b/client/table/citations.table.js @@ -2,13 +2,15 @@ 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' export const citationsColumns = [ { title: 'Title', field: 'title', sorter: 'string' }, - { title: 'Institution', field: 'institution', sorter: 'string' }, - { title: 'Country', field: 'country', sorter: 'string', width: 140 }, + { title: 'Institution', field: 'institution', sorter: 'string', }, + { title: 'Country', field: 'country', sorter: 'string', width: 140, }, { title: 'Year', field: 'year', sorter: 'number', width: 70 }, { title: 'PDF', field: 'pdf_text', formatter: 'link', formatterParams: { target: "_blank", urlField: 'pdf_link', }, @@ -16,13 +18,24 @@ export const citationsColumns = [ ] class CitationsTable extends Component { - render() { - const { payload } = this.props - const { paper, citations } = payload.data - - if (!citations.length) return + state = { + q: '', + formattedCitations: [], + filteredCitations: [], + } - const formattedCitations = citations.map(citation => { + componentDidMount(){ + this.updateCitations() + } + componentDidUpdate(oldProps){ + if (this.props.payload.data.citations !== oldProps.payload.data.citations) { + this.updateCitations() + } + } + updateCitations(){ + const { paper, citations } = this.props.payload.data + if (!citations.length) this.setState({ formattedCitations: [] }) + const formattedCitations = citations.sort((a,b) => a.title.localeCompare(b.title)).map(citation => { const pdf_link = (citation.pdf && citation.pdf.length) ? citation.pdf[0] : (citation.doi && citation.doi.length) @@ -37,25 +50,56 @@ class CitationsTable extends Component { } return { title: citation.title, - institution: citation.addresses[0].name, - country: citation.addresses[0].country, + institution: citation.addresses.map(a => a.name).sort().join('; '), + country: Array.from(new Set(citation.addresses.map(a => a.country))).sort().join('; '), year: citation.year, pdf_link, pdf_text, } }) + this.setState({ + formattedCitations, + filteredCitations: formattedCitations, + }) + } - // console.log(formattedCitations) + updateFilter(q) { + const { formattedCitations } = this.state + if (!q.length) { + this.setState({ q, filteredCitations: formattedCitations }) + } else { + let q_re = new RegExp('(' + q.replace(/\s+/g, ' ').trim().replace(' ', '|') + ')', 'gi') + let filteredCitations = formattedCitations.filter(citation => ( + citation.title.match(q_re) || + citation.institution.match(q_re) || + citation.country.match(q_re) + )) + this.setState({ q, filteredCitations }) + } + } + render() { + const { formattedCitations, filteredCitations } = this.state + if (!formattedCitations.length) return + // console.log(formattedCitations) return ( - +
+ this.updateFilter(e.target.value)} + className='q' + placeholder='Filter by title/institution' + /> + +
) } } diff --git a/client/table/tabulator.css b/client/table/tabulator.css index 24005368..06bceb20 100644 --- a/client/table/tabulator.css +++ b/client/table/tabulator.css @@ -23,4 +23,13 @@ } .tabulator .tabulator-tableHolder .tabulator-table { background-color: #333; +} +.multi-value-formatter-content span { + border: 0; + padding: 0 5px 0 0; +} + +.citationBrowser .q { + max-width: 400px; + margin-bottom: 4px; } \ No newline at end of file diff --git a/scraper/client/paper/paper.info.js b/scraper/client/paper/paper.info.js index 35234617..b4fe54ba 100644 --- a/scraper/client/paper/paper.info.js +++ b/scraper/client/paper/paper.info.js @@ -9,7 +9,7 @@ import { TableObject } from '../common' class PaperInfo extends Component { render() { const { paperInfo, unknownCitations } = this.props.api - const { dataset, address } = paperInfo + const { dataset, paper, address } = paperInfo if (!dataset) return null return (
@@ -17,7 +17,12 @@ class PaperInfo extends Component { + Date: Mon, 1 Apr 2019 17:38:55 +0200 Subject: search icon --- client/table/citations.table.js | 4 ++-- client/table/tabulator.css | 12 +++++++++++- site/assets/img/icon-search.png | Bin 0 -> 1196 bytes 3 files changed, 13 insertions(+), 3 deletions(-) create mode 100644 site/assets/img/icon-search.png (limited to 'client/table/tabulator.css') diff --git a/client/table/citations.table.js b/client/table/citations.table.js index 4ee1a0c9..f9599f5d 100644 --- a/client/table/citations.table.js +++ b/client/table/citations.table.js @@ -35,6 +35,7 @@ class CitationsTable extends Component { updateCitations(){ const { paper, citations } = this.props.payload.data if (!citations.length) this.setState({ formattedCitations: [] }) + console.log(citations.filter(a => a.title.match('Coarse'))) const formattedCitations = citations.sort((a,b) => a.title.localeCompare(b.title)).map(citation => { const pdf_link = (citation.pdf && citation.pdf.length) ? citation.pdf[0] @@ -80,7 +81,6 @@ class CitationsTable extends Component { render() { const { formattedCitations, filteredCitations } = this.state if (!formattedCitations.length) return - // console.log(formattedCitations) return (
this.updateFilter(e.target.value)} className='q' - placeholder='Filter by title/institution' + placeholder='Enter text to search citations...' /> Date: Mon, 1 Apr 2019 20:03:27 +0200 Subject: csv export --- client/table/citations.table.js | 29 ++++++++++++++++++++++++++++- client/table/tabulator.css | 25 ++++++++++++++++++++++--- 2 files changed, 50 insertions(+), 4 deletions(-) (limited to 'client/table/tabulator.css') diff --git a/client/table/citations.table.js b/client/table/citations.table.js index 0092015f..bbc55047 100644 --- a/client/table/citations.table.js +++ b/client/table/citations.table.js @@ -2,6 +2,7 @@ import React, { Component } from 'react' import { bindActionCreators } from 'redux' import { connect } from 'react-redux' import { ReactTabulator } from 'react-tabulator' +import { saveAs } from 'file-saver' import { Loader } from '../common' import { toArray, toTuples, domainFromUrl } from '../util' @@ -71,6 +72,32 @@ class CitationsTable extends Component { } } + download() { + const { formattedCitations } = this.state + const fn = this.props.payload.data.paper.key + '.csv' + const titles = citationsColumns.map(c => c.title) + const fields = citationsColumns.map(c => c.formatterParams ? c.formatterParams.urlField : c.field) + const rows = formattedCitations.map(citation => { + const row = fields.map(field => citation[field]).map(data => { + switch (typeof data) { + case 'number': + return String(data) + default: + return '\"' + String(data) + '\"' + } + }) + return row.join(",") + }) + + const blob = new Blob([ + [ + titles.join(','), + ...rows, + ].join('\n') + ], {type: "text/csv;charset=utf-8"}); + saveAs(blob, fn); + } + render() { const { formattedCitations, filteredCitations } = this.state if (!formattedCitations.length) return @@ -84,7 +111,7 @@ class CitationsTable extends Component { className='q' placeholder='Enter text to search citations...' /> - this.download()}>Download CSV
Date: Mon, 1 Apr 2019 20:06:28 +0200 Subject: css --- client/table/tabulator.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'client/table/tabulator.css') diff --git a/client/table/tabulator.css b/client/table/tabulator.css index 465d4839..17dad62a 100644 --- a/client/table/tabulator.css +++ b/client/table/tabulator.css @@ -60,5 +60,5 @@ span.download { } .desktop span.download:hover { color: #fff; - background: #000; + background: #666; } \ No newline at end of file -- cgit v1.2.3-70-g09d2 From 087cf70c944c09c4d03f2fbcaf7c74718ccb5f8f Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Tue, 2 Apr 2019 14:47:34 +0200 Subject: cursor --- client/table/tabulator.css | 3 ++- site/public/about/faq/index.html | 1 - site/public/about/index.html | 1 - site/public/about/legal/index.html | 1 - site/public/about/press/index.html | 1 - site/public/datasets/50_people_one_question/index.html | 1 - site/public/datasets/afad/index.html | 1 - site/public/datasets/aflw/index.html | 1 - site/public/datasets/brainwash/index.html | 1 - site/public/datasets/caltech_10k/index.html | 1 - site/public/datasets/celeba/index.html | 1 - site/public/datasets/cofw/index.html | 1 - site/public/datasets/duke_mtmc/index.html | 1 - site/public/datasets/facebook/index.html | 1 - site/public/datasets/feret/index.html | 1 - site/public/datasets/hrt_transgender/index.html | 1 - site/public/datasets/index.html | 1 - site/public/datasets/lfpw/index.html | 1 - site/public/datasets/lfw/index.html | 1 - site/public/datasets/market_1501/index.html | 1 - site/public/datasets/msceleb/index.html | 1 - site/public/datasets/pipa/index.html | 1 - site/public/datasets/uccs/index.html | 1 - site/public/datasets/vgg_face2/index.html | 1 - site/public/datasets/viper/index.html | 1 - site/public/datasets/youtube_celebrities/index.html | 1 - site/public/info/index.html | 1 - site/public/research/00_introduction/index.html | 1 - site/public/research/01_from_1_to_100_pixels/index.html | 1 - site/public/research/02_what_computers_can_see/index.html | 1 - site/public/research/index.html | 1 - site/public/test/chart/index.html | 1 - site/public/test/citations/index.html | 1 - site/public/test/csv/index.html | 1 - site/public/test/datasets/index.html | 1 - site/public/test/face_search/index.html | 1 - site/public/test/gallery/index.html | 1 - site/public/test/index.html | 1 - site/public/test/map/index.html | 1 - site/public/test/name_search/index.html | 1 - site/public/test/pie_chart/index.html | 1 - site/templates/layout.html | 1 - 42 files changed, 2 insertions(+), 42 deletions(-) (limited to 'client/table/tabulator.css') diff --git a/client/table/tabulator.css b/client/table/tabulator.css index 17dad62a..9a7ca00e 100644 --- a/client/table/tabulator.css +++ b/client/table/tabulator.css @@ -9,6 +9,7 @@ background-color: #333; } .desktop .tabulator-row.tabulator-selectable:hover { + cursor: text; background-color: #555; } .tabulator-row .tabulator-cell { @@ -35,7 +36,7 @@ max-width: 400px; margin-bottom: 10px; background-image: url(/assets/img/icon-search.png); - background-position: 390px center; + background-position: 380px center; background-repeat: no-repeat; box-shadow: 0px 2px 4px rgba(0,0,0,0.2); border: 0; diff --git a/site/public/about/faq/index.html b/site/public/about/faq/index.html index b86dac22..00e5d719 100644 --- a/site/public/about/faq/index.html +++ b/site/public/about/faq/index.html @@ -8,7 +8,6 @@ - diff --git a/site/public/about/index.html b/site/public/about/index.html index 18ad797a..d5d72b04 100644 --- a/site/public/about/index.html +++ b/site/public/about/index.html @@ -8,7 +8,6 @@ - diff --git a/site/public/about/legal/index.html b/site/public/about/legal/index.html index 331712ba..b27e9188 100644 --- a/site/public/about/legal/index.html +++ b/site/public/about/legal/index.html @@ -8,7 +8,6 @@ - diff --git a/site/public/about/press/index.html b/site/public/about/press/index.html index 3fc33969..e09bf732 100644 --- a/site/public/about/press/index.html +++ b/site/public/about/press/index.html @@ -8,7 +8,6 @@ - diff --git a/site/public/datasets/50_people_one_question/index.html b/site/public/datasets/50_people_one_question/index.html index 8afe69e3..e3006385 100644 --- a/site/public/datasets/50_people_one_question/index.html +++ b/site/public/datasets/50_people_one_question/index.html @@ -8,7 +8,6 @@ - diff --git a/site/public/datasets/afad/index.html b/site/public/datasets/afad/index.html index a0aea1a6..8254d4fa 100644 --- a/site/public/datasets/afad/index.html +++ b/site/public/datasets/afad/index.html @@ -8,7 +8,6 @@ - diff --git a/site/public/datasets/aflw/index.html b/site/public/datasets/aflw/index.html index 7aaa9af0..6c7b2397 100644 --- a/site/public/datasets/aflw/index.html +++ b/site/public/datasets/aflw/index.html @@ -8,7 +8,6 @@ - diff --git a/site/public/datasets/brainwash/index.html b/site/public/datasets/brainwash/index.html index c0830a96..2a839a24 100644 --- a/site/public/datasets/brainwash/index.html +++ b/site/public/datasets/brainwash/index.html @@ -8,7 +8,6 @@ - diff --git a/site/public/datasets/caltech_10k/index.html b/site/public/datasets/caltech_10k/index.html index 6615bb1a..9692fb2b 100644 --- a/site/public/datasets/caltech_10k/index.html +++ b/site/public/datasets/caltech_10k/index.html @@ -8,7 +8,6 @@ - diff --git a/site/public/datasets/celeba/index.html b/site/public/datasets/celeba/index.html index b8300dbf..5e8c5fce 100644 --- a/site/public/datasets/celeba/index.html +++ b/site/public/datasets/celeba/index.html @@ -8,7 +8,6 @@ - diff --git a/site/public/datasets/cofw/index.html b/site/public/datasets/cofw/index.html index 84d38f1f..2da951ee 100644 --- a/site/public/datasets/cofw/index.html +++ b/site/public/datasets/cofw/index.html @@ -8,7 +8,6 @@ - diff --git a/site/public/datasets/duke_mtmc/index.html b/site/public/datasets/duke_mtmc/index.html index dcd01308..f5c94620 100644 --- a/site/public/datasets/duke_mtmc/index.html +++ b/site/public/datasets/duke_mtmc/index.html @@ -8,7 +8,6 @@ - diff --git a/site/public/datasets/facebook/index.html b/site/public/datasets/facebook/index.html index 7fb1901a..bdfb658f 100644 --- a/site/public/datasets/facebook/index.html +++ b/site/public/datasets/facebook/index.html @@ -8,7 +8,6 @@ - diff --git a/site/public/datasets/feret/index.html b/site/public/datasets/feret/index.html index ce60f3de..4cd57413 100644 --- a/site/public/datasets/feret/index.html +++ b/site/public/datasets/feret/index.html @@ -8,7 +8,6 @@ - diff --git a/site/public/datasets/hrt_transgender/index.html b/site/public/datasets/hrt_transgender/index.html index 05a49b9b..8d472c3b 100644 --- a/site/public/datasets/hrt_transgender/index.html +++ b/site/public/datasets/hrt_transgender/index.html @@ -8,7 +8,6 @@ - diff --git a/site/public/datasets/index.html b/site/public/datasets/index.html index 3a2dbd52..c43b2097 100644 --- a/site/public/datasets/index.html +++ b/site/public/datasets/index.html @@ -8,7 +8,6 @@ - diff --git a/site/public/datasets/lfpw/index.html b/site/public/datasets/lfpw/index.html index 087d8b1d..fae3cc93 100644 --- a/site/public/datasets/lfpw/index.html +++ b/site/public/datasets/lfpw/index.html @@ -8,7 +8,6 @@ - diff --git a/site/public/datasets/lfw/index.html b/site/public/datasets/lfw/index.html index 22c8c1ad..4b22fdf4 100644 --- a/site/public/datasets/lfw/index.html +++ b/site/public/datasets/lfw/index.html @@ -8,7 +8,6 @@ - diff --git a/site/public/datasets/market_1501/index.html b/site/public/datasets/market_1501/index.html index 2761a7c7..bacc5b16 100644 --- a/site/public/datasets/market_1501/index.html +++ b/site/public/datasets/market_1501/index.html @@ -8,7 +8,6 @@ - diff --git a/site/public/datasets/msceleb/index.html b/site/public/datasets/msceleb/index.html index 21a14129..7a3d2bab 100644 --- a/site/public/datasets/msceleb/index.html +++ b/site/public/datasets/msceleb/index.html @@ -8,7 +8,6 @@ - diff --git a/site/public/datasets/pipa/index.html b/site/public/datasets/pipa/index.html index d74ae49e..89d42a0b 100644 --- a/site/public/datasets/pipa/index.html +++ b/site/public/datasets/pipa/index.html @@ -8,7 +8,6 @@ - diff --git a/site/public/datasets/uccs/index.html b/site/public/datasets/uccs/index.html index 4de64ebc..56c3a7c5 100644 --- a/site/public/datasets/uccs/index.html +++ b/site/public/datasets/uccs/index.html @@ -8,7 +8,6 @@ - diff --git a/site/public/datasets/vgg_face2/index.html b/site/public/datasets/vgg_face2/index.html index 42e3b961..dc8f1ebc 100644 --- a/site/public/datasets/vgg_face2/index.html +++ b/site/public/datasets/vgg_face2/index.html @@ -8,7 +8,6 @@ - diff --git a/site/public/datasets/viper/index.html b/site/public/datasets/viper/index.html index 2610d1a1..29638ed7 100644 --- a/site/public/datasets/viper/index.html +++ b/site/public/datasets/viper/index.html @@ -8,7 +8,6 @@ - diff --git a/site/public/datasets/youtube_celebrities/index.html b/site/public/datasets/youtube_celebrities/index.html index dd230926..d7030588 100644 --- a/site/public/datasets/youtube_celebrities/index.html +++ b/site/public/datasets/youtube_celebrities/index.html @@ -8,7 +8,6 @@ - diff --git a/site/public/info/index.html b/site/public/info/index.html index ef7dc8db..d535b672 100644 --- a/site/public/info/index.html +++ b/site/public/info/index.html @@ -8,7 +8,6 @@ - diff --git a/site/public/research/00_introduction/index.html b/site/public/research/00_introduction/index.html index 5c536dc4..89ca3bb5 100644 --- a/site/public/research/00_introduction/index.html +++ b/site/public/research/00_introduction/index.html @@ -8,7 +8,6 @@ - diff --git a/site/public/research/01_from_1_to_100_pixels/index.html b/site/public/research/01_from_1_to_100_pixels/index.html index 37fc367f..f60df65e 100644 --- a/site/public/research/01_from_1_to_100_pixels/index.html +++ b/site/public/research/01_from_1_to_100_pixels/index.html @@ -8,7 +8,6 @@ - diff --git a/site/public/research/02_what_computers_can_see/index.html b/site/public/research/02_what_computers_can_see/index.html index 0fce1373..2a9b9c23 100644 --- a/site/public/research/02_what_computers_can_see/index.html +++ b/site/public/research/02_what_computers_can_see/index.html @@ -8,7 +8,6 @@ - diff --git a/site/public/research/index.html b/site/public/research/index.html index 303732f8..dc49e849 100644 --- a/site/public/research/index.html +++ b/site/public/research/index.html @@ -8,7 +8,6 @@ - diff --git a/site/public/test/chart/index.html b/site/public/test/chart/index.html index 93e12b3c..4968224f 100644 --- a/site/public/test/chart/index.html +++ b/site/public/test/chart/index.html @@ -8,7 +8,6 @@ - diff --git a/site/public/test/citations/index.html b/site/public/test/citations/index.html index 70b3fe55..3bc07693 100644 --- a/site/public/test/citations/index.html +++ b/site/public/test/citations/index.html @@ -8,7 +8,6 @@ - diff --git a/site/public/test/csv/index.html b/site/public/test/csv/index.html index 70a7d257..8683b4a1 100644 --- a/site/public/test/csv/index.html +++ b/site/public/test/csv/index.html @@ -8,7 +8,6 @@ - diff --git a/site/public/test/datasets/index.html b/site/public/test/datasets/index.html index 15edf039..f0dda184 100644 --- a/site/public/test/datasets/index.html +++ b/site/public/test/datasets/index.html @@ -8,7 +8,6 @@ - diff --git a/site/public/test/face_search/index.html b/site/public/test/face_search/index.html index 93dc2bc6..ad1f59c0 100644 --- a/site/public/test/face_search/index.html +++ b/site/public/test/face_search/index.html @@ -8,7 +8,6 @@ - diff --git a/site/public/test/gallery/index.html b/site/public/test/gallery/index.html index 9e2c54f6..354baa24 100644 --- a/site/public/test/gallery/index.html +++ b/site/public/test/gallery/index.html @@ -8,7 +8,6 @@ - diff --git a/site/public/test/index.html b/site/public/test/index.html index 0fc839d0..ab06c922 100644 --- a/site/public/test/index.html +++ b/site/public/test/index.html @@ -8,7 +8,6 @@ - diff --git a/site/public/test/map/index.html b/site/public/test/map/index.html index 4f4e7093..bde62f4f 100644 --- a/site/public/test/map/index.html +++ b/site/public/test/map/index.html @@ -8,7 +8,6 @@ - diff --git a/site/public/test/name_search/index.html b/site/public/test/name_search/index.html index 4e3ef428..1cc71731 100644 --- a/site/public/test/name_search/index.html +++ b/site/public/test/name_search/index.html @@ -8,7 +8,6 @@ - diff --git a/site/public/test/pie_chart/index.html b/site/public/test/pie_chart/index.html index 7dd159a3..169a6d6a 100644 --- a/site/public/test/pie_chart/index.html +++ b/site/public/test/pie_chart/index.html @@ -8,7 +8,6 @@ - diff --git a/site/templates/layout.html b/site/templates/layout.html index b5b7880c..d51e4b6a 100644 --- a/site/templates/layout.html +++ b/site/templates/layout.html @@ -8,7 +8,6 @@ - -- cgit v1.2.3-70-g09d2 From 77e2b579bc42b6c36f82dba246561293049e73f8 Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Tue, 2 Apr 2019 19:03:06 +0200 Subject: adding chart... whole verify app working nicer --- client/table/tabulator.css | 10 +++- scraper/client/app.js | 1 - scraper/client/common/header.component.js | 9 ++- scraper/client/common/table.component.js | 3 + scraper/client/paper/citationList.component.js | 33 ++++------ scraper/client/paper/index.js | 2 - scraper/client/paper/paper.chart.js | 83 ++++++++++++++++++++++++++ scraper/client/paper/paper.citations.js | 6 -- scraper/client/paper/paper.css | 21 +++++++ scraper/client/paper/paper.info.js | 32 ++++++++-- scraper/client/paper/paper.manager.js | 35 +++++++++++ scraper/client/paper/paper.unknown.js | 41 ------------- 12 files changed, 192 insertions(+), 84 deletions(-) create mode 100644 scraper/client/paper/paper.chart.js delete mode 100644 scraper/client/paper/paper.unknown.js (limited to 'client/table/tabulator.css') diff --git a/client/table/tabulator.css b/client/table/tabulator.css index 9a7ca00e..95768976 100644 --- a/client/table/tabulator.css +++ b/client/table/tabulator.css @@ -8,9 +8,13 @@ .tabulator-row.tabulator-row-even { background-color: #333; } -.desktop .tabulator-row.tabulator-selectable:hover { - cursor: text; - background-color: #555; +.desktop .tabulator-row.tabulator-selectable.tabulator-row-even:hover { + cursor: arrow; + background-color: #333; +} +.desktop .tabulator-row.tabulator-selectable.tabulator-row-odd:hover { + cursor: arrow; + background-color: #222; } .tabulator-row .tabulator-cell { border-right: 1px solid #444; diff --git a/scraper/client/app.js b/scraper/client/app.js index b449d0d0..366d4098 100644 --- a/scraper/client/app.js +++ b/scraper/client/app.js @@ -17,7 +17,6 @@ export default class App extends Component { - diff --git a/scraper/client/common/header.component.js b/scraper/client/common/header.component.js index 2f084979..c9825aab 100644 --- a/scraper/client/common/header.component.js +++ b/scraper/client/common/header.component.js @@ -1,5 +1,5 @@ import React, { Component } from 'react' -// import { NavLink } from 'react-router-dom' +import { Link } from 'react-router-dom' import { bindActionCreators } from 'redux' import { connect } from 'react-redux' @@ -34,10 +34,9 @@ class Header extends Component { {dataset &&
{dataset.name_full}{' - '} - Info{' - '} - Citations{' - '} - Unknown{' - '} - Random + Info{' - '} + Citations{' - '} + Random
} diff --git a/scraper/client/common/table.component.js b/scraper/client/common/table.component.js index 96b62835..121c9841 100644 --- a/scraper/client/common/table.component.js +++ b/scraper/client/common/table.component.js @@ -118,6 +118,9 @@ export function TableCell({ value }) { value = } } + if (value && typeof value === 'string' && value.indexOf('http') === 0) { + value = {value} + } return ( {value} ) diff --git a/scraper/client/paper/citationList.component.js b/scraper/client/paper/citationList.component.js index be8528bf..002c0dcb 100644 --- a/scraper/client/paper/citationList.component.js +++ b/scraper/client/paper/citationList.component.js @@ -9,38 +9,31 @@ import { TableObject, Loader } from '../common' import { USES_DATASET } from '../types' class CitationList extends Component { - componentDidMount() { - const { citations, api } = this.props - const { paperInfo, unknownCitations, verifications } = api - const { dataset } = paperInfo - if (!dataset || !citations || !verifications[dataset.key]) { - this.props.actions.setSortedCitations([]) - return - } - let verifiedLookup = verifications[dataset.key] || {} - const sortedCitations = citations.map(citation => [ - citation.title, - verifiedLookup[citation.id] ? verifiedLookup[citation.id].uses_dataset : USES_DATASET.NO_DATA, - citation.pdf.length, - citation - ]) - .sort((a,b) => (b[1] - a[1] || b[2] - a[2] || (a[0].localeCompare(b[0])))) - .map(tup => tup[3]) - this.props.actions.setSortedCitations(sortedCitations) + state = { + filter: USES_DATASET.YES, } render() { const { citations, title, api } = this.props const { paperInfo, unknownCitations, verifications, sortedCitations } = api const { dataset } = paperInfo + const { filter } = this.state if (!dataset || !citations || !verifications[dataset.key]) return let verifiedLookup = verifications[dataset.key] || {} - // console.log(verifications) + let filteredCitations = sortedCitations.filter(citation => ( + citation.verified === filter + )) return (

{title}

+
+ this.setState({ filter: USES_DATASET.YES })}>uses dataset + this.setState({ filter: USES_DATASET.NO })}>{"doesn't use dataset"} + this.setState({ filter: USES_DATASET.UNKNOWN })}>{'not enough information'} + this.setState({ filter: USES_DATASET.NO_DATA })}>{'unverified'} +
    - {(sortedCitations || []).map((citation, i) => { + {(filteredCitations || []).map((citation, i) => { let cite = { ...citation } cite.id = { _raw: true, diff --git a/scraper/client/paper/index.js b/scraper/client/paper/index.js index 99672684..9346234a 100644 --- a/scraper/client/paper/index.js +++ b/scraper/client/paper/index.js @@ -1,7 +1,6 @@ import Manager from './paper.manager' import Info from './paper.info' import Citations from './paper.citations' -import UnknownCitations from './paper.unknown' import Random from './paper.random' import Address from './paper.address' import Verify from './paper.verify' @@ -13,7 +12,6 @@ export { Manager, Info, Citations, - UnknownCitations, Random, Address, Verify, diff --git a/scraper/client/paper/paper.chart.js b/scraper/client/paper/paper.chart.js new file mode 100644 index 00000000..01d8d0e8 --- /dev/null +++ b/scraper/client/paper/paper.chart.js @@ -0,0 +1,83 @@ +import React, { Component } from 'react' +import { bindActionCreators } from 'redux' +import { connect } from 'react-redux' +import { toArray, toTuples } from '../util' +import C3Chart from 'react-c3js' +import 'c3/c3.css' + +class PaperChart extends Component { + render() { + const { rows, title } = this.props + if (!rows.length) return null + const colorPattern = [ + "#00b200", + "#ff0000", + "#e0c200", + "#dddddd", + ] + + return ( +
    +
    + value, + } + }} + size={{ + height: rows.length < 4 ? 316 : 336, + }} + /> + {title} +
    +
    + ) + } +} + +/* + legend={{ + position: 'right' + }} + tooltip={{ + contents: function (d, defaultTitleFormat, defaultValueFormat, color) { + const countriesByYearLookup = years[yearList[d[0].x]] + let countriesByYear = Object.keys(countriesByYearLookup).map(country => [country, countriesByYearLookup[country]]).sort((a,b) => b[1] - a[1]) + let topCountriesForThisYear = countriesByYear.slice(0, topCountryCount) + let bottomTotal = countriesByYear.slice(topCountryCount).reduce((a,b) => (a + b[1]), 0) + // console.log(topCountriesForThisYear) + topCountriesForThisYear.push([otherCountriesLabel, bottomTotal]) + const tableRows = topCountriesForThisYear.filter(pair => !!pair[1]).map(([country, total]) => { + let colorIndex = topCountries.indexOf(country) + if (colorIndex < 0) colorIndex = colorPattern.length - 1 + const color = colorPattern[ colorIndex ] + return [ + "", + "", + "", + country, + "", + "", + total, + "", + "", + ].join('') + }) + return [ + "", + ...tableRows, + "
    ", + ].join('') + } + }} +*/ + +export default PaperChart diff --git a/scraper/client/paper/paper.citations.js b/scraper/client/paper/paper.citations.js index f0e9ea26..c3a9cc61 100644 --- a/scraper/client/paper/paper.citations.js +++ b/scraper/client/paper/paper.citations.js @@ -11,12 +11,6 @@ import { USES_DATASET } from '../types' import CitationList from './citationList.component' class PaperCitations extends Component { - componentDidUpdate(prevProps) { - if (this.props.api.paperInfo.dataset !== prevProps.api.paperInfo.dataset) { - this.props.actions.getVerificationsDataset(this.props.api.paperInfo.dataset.key) - } - } - render() { const { paperInfo, unknownCitations, verifications } = this.props.api const { dataset, citations } = paperInfo diff --git a/scraper/client/paper/paper.css b/scraper/client/paper/paper.css index 21df2df1..914077b6 100644 --- a/scraper/client/paper/paper.css +++ b/scraper/client/paper/paper.css @@ -12,6 +12,20 @@ width: 100%; } +.filter_buttons { + margin-left: 5px; + margin-bottom: 10px; +} +.filter_buttons span { + margin-right: 10px; + cursor: pointer; + opacity: 0.8; + transition: opacity 0.2; +} +.filter_buttons span:hover { + opacity: 1; +} + .citations { padding:40px; } @@ -82,6 +96,13 @@ padding:4px; font-size:12px; } +.chartCaption { + display: block; + width: 100%; + font-size: 12px; + color: #333; + text-align: center; +} .param { display: flex; diff --git a/scraper/client/paper/paper.info.js b/scraper/client/paper/paper.info.js index b4fe54ba..25f4472f 100644 --- a/scraper/client/paper/paper.info.js +++ b/scraper/client/paper/paper.info.js @@ -3,17 +3,40 @@ import { bindActionCreators } from 'redux' import { connect } from 'react-redux' import * as actions from '../actions' - import { TableObject } from '../common' +import { USES_DATASET } from '../types' + +import PaperChart from './paper.chart' class PaperInfo extends Component { render() { - const { paperInfo, unknownCitations } = this.props.api + const { paperInfo, sortedCitations, unknownCitations } = this.props.api const { dataset, paper, address } = paperInfo if (!dataset) return null + + let counts = {} + const citationLabels = ['Uses Dataset', 'Doesn\'t Use Dataset', 'Not Enough Information', 'Unknown'] + const citationCountOrder = [ USES_DATASET.YES, USES_DATASET.NO, USES_DATASET.UNKNOWN, USES_DATASET.NO_DATA ] + citationCountOrder.forEach(v => counts[v] = 0) + + sortedCitations.forEach(c => counts[c.verified] += 1) + + let citationCounts = {} + let citationRows = [] + citationCountOrder.forEach((v, i) => { + const count = counts[v] + const label = citationLabels[i] + citationCounts[label] = count + citationRows.push([ label, count ]) + }) + return (

    {dataset.name_full}

    +
    ) diff --git a/scraper/client/paper/paper.manager.js b/scraper/client/paper/paper.manager.js index 2ac03b01..8b25b1cc 100644 --- a/scraper/client/paper/paper.manager.js +++ b/scraper/client/paper/paper.manager.js @@ -3,6 +3,7 @@ import { bindActionCreators } from 'redux' import { connect } from 'react-redux' import * as actions from '../actions' +import { USES_DATASET } from '../types' import { Loader } from '../common' @@ -15,6 +16,40 @@ class PaperManager extends Component { if (this.props.match.params.key !== oldProps.match.params.key) { this.props.actions.getPaperInfo(this.props.match.params.key) } + console.log('whoms?') + if (this.props.api.paperInfo.dataset !== oldProps.api.paperInfo.dataset && this.props.api.paperInfo.dataset && this.props.api.paperInfo.dataset.key) { + console.log('vert?') + this.props.actions.getVerificationsDataset(this.props.api.paperInfo.dataset.key) + } + if (this.props.api.verifications !== oldProps.api.verifications && this.props.api.paperInfo.dataset) { + console.log('updated?') + this.updateSortedCitations() + } + } + + updateSortedCitations() { + const { api } = this.props + const { paperInfo, unknownCitations, verifications } = api + const { dataset } = paperInfo + if (!dataset || !paperInfo.citations || !unknownCitations.citations || !verifications[dataset.key]) { + this.props.actions.setSortedCitations([]) + return + } + const citations = paperInfo.citations.concat(unknownCitations.citations) + let verifiedLookup = verifications[dataset.key] || {} + const sortedCitations = citations.map(citation => [ + citation.title, + verifiedLookup[citation.id] ? verifiedLookup[citation.id].uses_dataset : USES_DATASET.NO_DATA, + citation.pdf.length, + citation + ]) + .sort((a,b) => (b[1] - a[1] || b[2] - a[2] || (a[0].localeCompare(b[0])))) + .map(tup => ({ + ...tup[3], + verified: tup[1], + })) + console.log('updated') + this.props.actions.setSortedCitations(sortedCitations) } render() { diff --git a/scraper/client/paper/paper.unknown.js b/scraper/client/paper/paper.unknown.js deleted file mode 100644 index 876ac144..00000000 --- a/scraper/client/paper/paper.unknown.js +++ /dev/null @@ -1,41 +0,0 @@ -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' - -import { Loader } from '../common' -import { USES_DATASET } from '../types' - -import CitationList from './citationList.component' - -class PaperUnknown extends Component { - componentDidUpdate(prevProps) { - if (this.props.api.paperInfo.dataset !== prevProps.api.paperInfo.dataset) { - this.props.actions.getVerificationsDataset(this.props.api.paperInfo.dataset.key) - } - } - - render() { - const { paperInfo, unknownCitations, verifications } = this.props.api - const { dataset, citations } = paperInfo - if (!dataset || !citations || !verifications[dataset.key]) return - - return ( - - ) - } -} - -const mapStateToProps = state => ({ - api: state.api -}) -const mapDispatchToProps = dispatch => ({ - actions: bindActionCreators({ ...actions }, dispatch), -}) - -export default connect(mapStateToProps, mapDispatchToProps)(PaperUnknown) -- cgit v1.2.3-70-g09d2