From 0bede27de3bcc0c7f03d16c7607a0ae693daebc7 Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Mon, 1 Apr 2019 10:23:29 +0200 Subject: citations table in react --- client/table/citations.table.js | 53 +++++++++++++++++++++++++++++++++++++++++ 1 file changed, 53 insertions(+) create mode 100644 client/table/citations.table.js (limited to 'client/table/citations.table.js') diff --git a/client/table/citations.table.js b/client/table/citations.table.js new file mode 100644 index 00000000..1ec2d10c --- /dev/null +++ b/client/table/citations.table.js @@ -0,0 +1,53 @@ +import React, { Component } from 'react' +import { bindActionCreators } from 'redux' +import { connect } from 'react-redux' +import { ReactTabulator } from 'react-tabulator' +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: 'Year', field: 'year', sorter: 'number', width: 70 }, + { title: 'PDF', field: 'pdf_text', formatter: 'link', + formatterParams: { target: "_blank", urlField: 'pdf_link', }, + sorter: 'string', width: 100 }, +] + +class CitationsTable extends Component { + render() { + const { payload } = this.props + const { paper, citations } = payload.data + console.log(this.props) + if (!citations.length) return + + const formattedCitations = citations.map(citation => ({ + title: citation.title, + institution: citation.addresses[0].name, + country: citation.addresses[0].country, + year: citation.year, + pdf: (citation.pdf && citation.pdf.length) + ? citation.pdf[0] + : (citation.doi && citation.doi.length) + ? citation.doi[0] + : "", + })) + + console.log(formattedCitations) + + return ( + + ) + } +} + +export default CitationsTable -- cgit v1.2.3-70-g09d2 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/citations.table.js | 36 +++++++++++++++++++++++------------- client/table/index.js | 3 ++- client/table/tabulator.css | 26 ++++++++++++++++++++++++++ 3 files changed, 51 insertions(+), 14 deletions(-) create mode 100644 client/table/tabulator.css (limited to 'client/table/citations.table.js') diff --git a/client/table/citations.table.js b/client/table/citations.table.js index 1ec2d10c..f65998aa 100644 --- a/client/table/citations.table.js +++ b/client/table/citations.table.js @@ -19,22 +19,32 @@ class CitationsTable extends Component { render() { const { payload } = this.props const { paper, citations } = payload.data - console.log(this.props) + if (!citations.length) return - const formattedCitations = citations.map(citation => ({ - title: citation.title, - institution: citation.addresses[0].name, - country: citation.addresses[0].country, - year: citation.year, - pdf: (citation.pdf && citation.pdf.length) - ? citation.pdf[0] - : (citation.doi && citation.doi.length) - ? citation.doi[0] - : "", - })) + const formattedCitations = citations.map(citation => { + const pdf_link = (citation.pdf && citation.pdf.length) + ? citation.pdf[0] + : (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('.') + } + return { + title: citation.title, + institution: citation.addresses[0].name, + country: citation.addresses[0].country, + year: citation.year, + pdf_link, pdf_text, + } + }) - console.log(formattedCitations) + // console.log(formattedCitations) return ( 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/citations.table.js') 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/citations.table.js') 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 19:45:15 +0200 Subject: test csv --- .gitignore | 3 +++ client/index.js | 8 +++++-- client/table/citations.table.js | 28 ++++++++++------------ client/table/file.table.js | 42 +++++++++++++++++++++++++-------- client/util/index.js | 9 +++++++ package-lock.json | 8 +++---- package.json | 2 +- site/content/pages/test/assets/test.csv | 8 +++++++ site/content/pages/test/csv.md | 4 ++-- site/public/datasets/index.html | 12 +++++----- site/public/test/csv/index.html | 2 +- 11 files changed, 84 insertions(+), 42 deletions(-) create mode 100644 site/content/pages/test/assets/test.csv (limited to 'client/table/citations.table.js') diff --git a/.gitignore b/.gitignore index 74a8a054..e41e7c36 100644 --- a/.gitignore +++ b/.gitignore @@ -170,3 +170,6 @@ site/public/user_content site/datasets/final/*.csv +flask.log +flask.log.* + 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 return (
- this.updateFilter(e.target.value)} - className='q' - placeholder='Enter text to search citations...' - /> +
+ this.updateFilter(e.target.value)} + className='q' + placeholder='Enter text to search citations...' + /> + 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 } return ( (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 => { diff --git a/package-lock.json b/package-lock.json index 4e9d6fac..43ee0cbf 100644 --- a/package-lock.json +++ b/package-lock.json @@ -3673,9 +3673,9 @@ } }, "file-saver": { - "version": "2.0.0", - "resolved": "https://registry.npmjs.org/file-saver/-/file-saver-2.0.0.tgz", - "integrity": "sha512-cYM1ic5DAkg25pHKgi5f10ziAM7RJU37gaH1XQlyNDrtUnzhC/dfoV9zf2OmF0RMKi42jG5B0JWBnPQqyj/G6g==" + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/file-saver/-/file-saver-2.0.1.tgz", + "integrity": "sha512-dCB3K7/BvAcUmtmh1DzFdv0eXSVJ9IAFt1mw3XZfAexodNRoE29l3xB2EX4wH2q8m/UTzwzEPq/ArYk98kUkBQ==" }, "filename-regex": { "version": "2.0.1", @@ -8623,7 +8623,7 @@ }, "sprintf-js": { "version": "1.0.3", - "resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.0.3.tgz", + "resolved": "http://registry.npmjs.org/sprintf-js/-/sprintf-js-1.0.3.tgz", "integrity": "sha1-BOaSb2YolTVPPdAVIDYzuFcpfiw=", "dev": true }, diff --git a/package.json b/package.json index 6238e7e3..75fbebb7 100644 --- a/package.json +++ b/package.json @@ -38,7 +38,7 @@ "exif-reader": "^1.0.2", "exifreader": "^2.5.0", "fetch-jsonp": "^1.1.3", - "file-saver": "^2.0.0-rc.3", + "file-saver": "^2.0.1", "history": "^4.7.2", "leaflet": "^1.3.4", "leaflet-arc": "^1.0.2", diff --git a/site/content/pages/test/assets/test.csv b/site/content/pages/test/assets/test.csv new file mode 100644 index 00000000..7156a814 --- /dev/null +++ b/site/content/pages/test/assets/test.csv @@ -0,0 +1,8 @@ +name,images,year,gender,description,url +aardvark,100,2019,m,bim da,https://asdf.us/ +bobcat,10,2017,f,in a tree,https://asdf.us/ +cow,20,2012,f,moooo,https://asdf.us/ +doe,2,2016,f,doe a deer,https://asdf.us/ +earwig,1,2017,m,just a bug,https://i.asdf.us/ +frog,17,2018,f,ribbit ribbit,https://i.asdf.us/ +giraffe,23,2009,m,i get around,https://adsf.us/ diff --git a/site/content/pages/test/csv.md b/site/content/pages/test/csv.md index b5f37754..85f714b4 100644 --- a/site/content/pages/test/csv.md +++ b/site/content/pages/test/csv.md @@ -15,6 +15,6 @@ authors: Megapixels ### [← Back to test index](/test/) ``` -load_file /datasets/lfw/assets/lfw_names_gender_kg_min.csv -Name, Images, Gender, Description +load_file /site/test/assets/test.csv +Name, Images, Year, Gender, Description, URL ``` diff --git a/site/public/datasets/index.html b/site/public/datasets/index.html index 1d2630e1..3a2dbd52 100644 --- a/site/public/datasets/index.html +++ b/site/public/datasets/index.html @@ -42,8 +42,8 @@ Brainwash
2015
-
Decoding image into set of people detections.
-
11,918 images
+
Head detection
+
11,917 images
@@ -90,7 +90,7 @@ MS Celeb
2016
-
face recognition
+
Large-scale face recognition
1,000,000 images
100,000
@@ -114,9 +114,9 @@ Unconstrained College Students
2018
-
Unconstrained face recognition
+
Face recognition, face detection
16,149 images
-
4,362
+
1,732
@@ -126,7 +126,7 @@ VIPeR
2007
-
pedestrian re-identification
+
Person re-identification
1,264 images
632
diff --git a/site/public/test/csv/index.html b/site/public/test/csv/index.html index 3257716f..70a7d257 100644 --- a/site/public/test/csv/index.html +++ b/site/public/test/csv/index.html @@ -28,7 +28,7 @@

CSV Test

← Back to test index

-
+
-- cgit v1.2.3-70-g09d2 From 0168528fb74f0e82f1b7ae90686d99c941ef0cf8 Mon Sep 17 00:00:00 2001 From: Jules Laplace 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/citations.table.js') 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: Tue, 2 Apr 2019 15:50:01 +0200 Subject: clamp citations height. add waypoint --- client/index.js | 20 ++++++++++++++++++++ client/table/citations.table.js | 2 +- client/table/file.table.js | 2 +- package-lock.json | 20 ++++++++++++++++++++ package.json | 4 +++- site/assets/css/css.css | 14 ++++++++++---- site/public/datasets/brainwash/index.html | 1 + site/templates/layout.html | 1 + 8 files changed, 57 insertions(+), 7 deletions(-) (limited to 'client/table/citations.table.js') diff --git a/client/index.js b/client/index.js index 5e36d341..c09aece7 100644 --- a/client/index.js +++ b/client/index.js @@ -2,6 +2,7 @@ import React from 'react' import ReactDOM from 'react-dom' import { AppContainer } from 'react-hot-loader' import { Provider } from 'react-redux' +import 'waypoints/lib/noframework.waypoints.min.js'; import { toArray } from './util' import Applet from './applet' @@ -112,6 +113,24 @@ function runApplets() { } } +function buildWaypoints() { + const element = document.querySelector('.content section:nth-child(2)') + if (element) { + var waypoint = new Waypoint({ + element, + handler: function(direction) { + if (direction === 'down') { + document.body.classList.add('scrolled') + } else { + document.body.classList.remove('scrolled') + } + // console.log(direction) + // console.log('Scrolled to waypoint!') + } + }) + } +} + function main() { const paras = document.querySelectorAll('section p') // if (paras.length) { @@ -123,6 +142,7 @@ function main() { } }) runApplets() + buildWaypoints() } main() diff --git a/client/table/citations.table.js b/client/table/citations.table.js index bbc55047..178cc65b 100644 --- a/client/table/citations.table.js +++ b/client/table/citations.table.js @@ -117,7 +117,7 @@ class CitationsTable extends Component { columns={citationsColumns} data={filteredCitations} options={{ - height: 311, + height: Math.max(104, Math.min(37 * formattedCitations.length + 29, 311)), layout: 'fitColumns', placeholder: formattedCitations.length ? '' : 'Nothing matches your query', }} diff --git a/client/table/file.table.js b/client/table/file.table.js index 82c01ac5..db53243a 100644 --- a/client/table/file.table.js +++ b/client/table/file.table.js @@ -71,7 +71,7 @@ class FileTable extends Component { columns={this.state.columns} data={this.state.data} options={{ - height: 311, + height: Math.min(37 * this.state.data.length + 29, 311), layout: 'fitColumns', placeholder: 'No Data Set', }} diff --git a/package-lock.json b/package-lock.json index 43ee0cbf..54e60fad 100644 --- a/package-lock.json +++ b/package-lock.json @@ -2061,6 +2061,11 @@ "date-now": "^0.1.4" } }, + "consolidated-events": { + "version": "2.0.2", + "resolved": "https://registry.npmjs.org/consolidated-events/-/consolidated-events-2.0.2.tgz", + "integrity": "sha512-2/uRVMdRypf5z/TW/ncD/66l75P5hH2vM/GR8Jf8HLc2xnfJtmina6F6du8+v4Z2vTrMo7jC+W1tmEEuuELgkQ==" + }, "constants-browserify": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/constants-browserify/-/constants-browserify-1.0.0.tgz", @@ -7351,6 +7356,16 @@ "resolved": "https://registry.npmjs.org/react-tag-autocomplete/-/react-tag-autocomplete-5.8.2.tgz", "integrity": "sha512-GkOQrSLjvWo98IeqRuGgc77zaxSMyMjy+b2Rc+m9jMKTWopF9h5Lf2F/X1oK9hcnUCeUmJ5QVpc/dx9MgOA2Iw==" }, + "react-waypoint": { + "version": "9.0.1", + "resolved": "https://registry.npmjs.org/react-waypoint/-/react-waypoint-9.0.1.tgz", + "integrity": "sha512-AdP1EhU5fOFne1aEfZPv2AhVC+cGJ3TxITOnZM9tBBlXOOhz3lXtTSHdicRCY+2VBqerT6zD1tAtp89Mng+Chg==", + "requires": { + "consolidated-events": "^1.1.0 || ^2.0.0", + "prop-types": "^15.0.0", + "react-is": "^16.6.3" + } + }, "read-pkg": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-2.0.0.tgz", @@ -9874,6 +9889,11 @@ } } }, + "waypoints": { + "version": "4.0.1", + "resolved": "https://registry.npmjs.org/waypoints/-/waypoints-4.0.1.tgz", + "integrity": "sha1-CZeaBXOBCylifLpDZqKEoGLsacg=" + }, "wbuf": { "version": "1.7.3", "resolved": "https://registry.npmjs.org/wbuf/-/wbuf-1.7.3.tgz", diff --git a/package.json b/package.json index 75fbebb7..bbd3d763 100644 --- a/package.json +++ b/package.json @@ -56,6 +56,7 @@ "react-router-dom": "^4.3.1", "react-spin": "^0.6.2", "react-tabulator": "^0.9.1", + "react-waypoint": "^9.0.1", "redux": "^4.0.0", "redux-thunk": "^2.3.0", "snapsvg": "^0.5.1", @@ -65,7 +66,8 @@ "three": "^0.100.0", "three-orbitcontrols": "^2.99.1", "three.meshline": "^1.1.0", - "three.textsprite": "^18.10.24" + "three.textsprite": "^18.10.24", + "waypoints": "^4.0.1" }, "devDependencies": { "babel-cli": "^6.26.0", diff --git a/site/assets/css/css.css b/site/assets/css/css.css index a09234d3..824819a9 100644 --- a/site/assets/css/css.css +++ b/site/assets/css/css.css @@ -64,10 +64,16 @@ header .site_name { line-height: 11px; letter-spacing: 3px; } -header .site_name.splash{ - font-size: 20px; - line-height: 20px; - font-weight: 400; +header .splash{ + font-size: 15px; + font-weight: 400; + color: #888; + padding-left: 8px; + opacity: 0; + transition: 0.3s opacity cubic-bezier(0,0,1,1); +} +.scrolled header .splash { + opacity: 1; } header .links{ font-size: 18px; diff --git a/site/public/datasets/brainwash/index.html b/site/public/datasets/brainwash/index.html index 2a839a24..ec5ee434 100644 --- a/site/public/datasets/brainwash/index.html +++ b/site/public/datasets/brainwash/index.html @@ -17,6 +17,7 @@
MegaPixels
+
Brainwash