From 3b10acc73247ec703ed47f0423e7d255a91f074e Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Sun, 16 Dec 2018 00:11:20 +0100 Subject: tabulator --- site/assets/css/tabulator.css | 761 ++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 761 insertions(+) create mode 100755 site/assets/css/tabulator.css (limited to 'site/assets/css/tabulator.css') diff --git a/site/assets/css/tabulator.css b/site/assets/css/tabulator.css new file mode 100755 index 00000000..8c123cf4 --- /dev/null +++ b/site/assets/css/tabulator.css @@ -0,0 +1,761 @@ +/* Tabulator v4.1.3 (c) Oliver Folkerd */ +.tabulator { + position: relative; + font-size: 14px; + text-align: left; + overflow: hidden; + -ms-transform: translatez(0); + transform: translatez(0); +} + +.tabulator[tabulator-layout="fitDataFill"] .tabulator-tableHolder .tabulator-table { + min-width: 100%; +} + +.tabulator.tabulator-block-select { + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; +} + +.tabulator .tabulator-header { + position: relative; + box-sizing: border-box; + width: 100%; + border-bottom: 1px solid #999; + color: #ddd; + white-space: nowrap; + overflow: hidden; + -moz-user-select: none; + -khtml-user-select: none; + -webkit-user-select: none; + -o-user-select: none; +} + +.tabulator .tabulator-header .tabulator-col { + display: inline-block; + position: relative; + box-sizing: border-box; + border-right: 1px solid #aaa; + text-align: left; + vertical-align: bottom; + overflow: hidden; +} + +.tabulator .tabulator-header .tabulator-col.tabulator-moving { + position: absolute; + border: 1px solid #999; + background: rgba(80,20,10,0.2); + pointer-events: none; +} + +.tabulator .tabulator-header .tabulator-col .tabulator-col-content { + box-sizing: border-box; + position: relative; + padding: 4px; +} + +.tabulator .tabulator-header .tabulator-col .tabulator-col-content .tabulator-col-title { + box-sizing: border-box; + width: 100%; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + vertical-align: bottom; +} + +.tabulator .tabulator-header .tabulator-col .tabulator-col-content .tabulator-col-title .tabulator-title-editor { + box-sizing: border-box; + width: 100%; + border: 1px solid #999; + padding: 1px; + background: #fff; +} + +.tabulator .tabulator-header .tabulator-col .tabulator-col-content .tabulator-arrow { + display: inline-block; + position: absolute; + top: 9px; + right: 8px; + width: 0; + height: 0; + border-left: 6px solid transparent; + border-right: 6px solid transparent; + border-bottom: 6px solid #bbb; +} + +.tabulator .tabulator-header .tabulator-col.tabulator-col-group .tabulator-col-group-cols { + position: relative; + display: -ms-flexbox; + display: flex; + border-top: 1px solid #aaa; + overflow: hidden; +} + +.tabulator .tabulator-header .tabulator-col.tabulator-col-group .tabulator-col-group-cols .tabulator-col:last-child { + margin-right: -1px; +} + +.tabulator .tabulator-header .tabulator-col:first-child .tabulator-col-resize-handle.prev { + display: none; +} + +.tabulator .tabulator-header .tabulator-col.ui-sortable-helper { + position: absolute; + border: 1px solid #aaa; +} + +.tabulator .tabulator-header .tabulator-col .tabulator-header-filter { + position: relative; + box-sizing: border-box; + margin-top: 2px; + width: 100%; + text-align: center; +} + +.tabulator .tabulator-header .tabulator-col .tabulator-header-filter textarea { + height: auto !important; +} + +.tabulator .tabulator-header .tabulator-col .tabulator-header-filter svg { + margin-top: 3px; +} + +.tabulator .tabulator-header .tabulator-col .tabulator-header-filter input::-ms-clear { + width: 0; + height: 0; +} + +.tabulator .tabulator-header .tabulator-col.tabulator-sortable .tabulator-col-title { + padding-right: 25px; +} + +.tabulator .tabulator-header .tabulator-col.tabulator-sortable:hover { + cursor: pointer; + background-color: #cdcdcd; +} + +.tabulator .tabulator-header .tabulator-col.tabulator-sortable[aria-sort="none"] .tabulator-col-content .tabulator-arrow { + border-top: none; + border-bottom: 6px solid #bbb; +} + +.tabulator .tabulator-header .tabulator-col.tabulator-sortable[aria-sort="asc"] .tabulator-col-content .tabulator-arrow { + border-top: none; + border-bottom: 6px solid #666; +} + +.tabulator .tabulator-header .tabulator-col.tabulator-sortable[aria-sort="desc"] .tabulator-col-content .tabulator-arrow { + border-top: 6px solid #666; + border-bottom: none; +} + +.tabulator .tabulator-header .tabulator-col.tabulator-col-vertical .tabulator-col-content .tabulator-col-title { + -webkit-writing-mode: vertical-rl; + -ms-writing-mode: tb-rl; + writing-mode: vertical-rl; + text-orientation: mixed; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: center; + justify-content: center; +} + +.tabulator .tabulator-header .tabulator-col.tabulator-col-vertical.tabulator-col-vertical-flip .tabulator-col-title { + -ms-transform: rotate(180deg); + transform: rotate(180deg); +} + +.tabulator .tabulator-header .tabulator-col.tabulator-col-vertical.tabulator-sortable .tabulator-col-title { + padding-right: 0; + padding-top: 20px; +} + +.tabulator .tabulator-header .tabulator-col.tabulator-col-vertical.tabulator-sortable.tabulator-col-vertical-flip .tabulator-col-title { + padding-right: 0; + padding-bottom: 20px; +} + +.tabulator .tabulator-header .tabulator-col.tabulator-col-vertical.tabulator-sortable .tabulator-arrow { + right: calc(50% - 6px); +} + +.tabulator .tabulator-header .tabulator-frozen { + display: inline-block; + position: absolute; + z-index: 10; +} + +.tabulator .tabulator-header .tabulator-frozen.tabulator-frozen-left { + border-right: 2px solid #aaa; +} + +.tabulator .tabulator-header .tabulator-frozen.tabulator-frozen-right { + border-left: 2px solid #aaa; +} + +.tabulator .tabulator-header .tabulator-calcs-holder { + box-sizing: border-box; + min-width: 400%; + background: rgba(80,20,10,0.2); + border-top: 1px solid #aaa; + border-bottom: 1px solid #aaa; + overflow: hidden; +} + +.tabulator .tabulator-header .tabulator-calcs-holder .tabulator-row { + background: rgba(80,20,10,0.2); +} + +.tabulator .tabulator-header .tabulator-calcs-holder .tabulator-row .tabulator-col-resize-handle { + display: none; +} + +.tabulator .tabulator-header .tabulator-frozen-rows-holder { + min-width: 400%; +} + +.tabulator .tabulator-header .tabulator-frozen-rows-holder:empty { + display: none; +} + +.tabulator .tabulator-tableHolder { + position: relative; + width: 100%; + white-space: nowrap; + overflow: auto; + -webkit-overflow-scrolling: touch; +} + +.tabulator .tabulator-tableHolder:focus { + outline: none; +} + +.tabulator .tabulator-tableHolder .tabulator-placeholder { + box-sizing: border-box; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + width: 100%; +} + +.tabulator .tabulator-tableHolder .tabulator-placeholder[tabulator-render-mode="virtual"] { + position: absolute; + top: 0; + left: 0; + height: 100%; +} + +.tabulator .tabulator-tableHolder .tabulator-placeholder span { + display: inline-block; + margin: 0 auto; + padding: 10px; + color: #ccc; + font-weight: bold; + font-size: 20px; +} + +.tabulator .tabulator-tableHolder .tabulator-table { + position: relative; + display: inline-block; + background-color: #fff; + white-space: nowrap; + overflow: visible; + color: #333; +} + +.tabulator .tabulator-tableHolder .tabulator-table .tabulator-row.tabulator-calcs { + font-weight: bold; + background: rgba(80,20,10,0.2); +} + +.tabulator .tabulator-tableHolder .tabulator-table .tabulator-row.tabulator-calcs.tabulator-calcs-top { + border-bottom: 2px solid #aaa; +} + +.tabulator .tabulator-tableHolder .tabulator-table .tabulator-row.tabulator-calcs.tabulator-calcs-bottom { + border-top: 2px solid #aaa; +} + +.tabulator .tabulator-footer { + padding: 5px 10px; + border-top: 1px solid #999; + text-align: right; + color: #555; + font-weight: bold; + white-space: nowrap; + -ms-user-select: none; + user-select: none; + -moz-user-select: none; + -khtml-user-select: none; + -webkit-user-select: none; + -o-user-select: none; +} + +.tabulator .tabulator-footer .tabulator-calcs-holder { + box-sizing: border-box; + width: calc(100% + 20px); + margin: -5px -10px 5px -10px; + text-align: left; + background: rgba(80,20,10,0.2); + border-bottom: 1px solid #aaa; + border-top: 1px solid #aaa; + overflow: hidden; +} + +.tabulator .tabulator-footer .tabulator-calcs-holder .tabulator-row { + background: rgba(80,20,10,0.2); +} + +.tabulator .tabulator-footer .tabulator-calcs-holder .tabulator-row .tabulator-col-resize-handle { + display: none; +} + +.tabulator .tabulator-footer .tabulator-calcs-holder:only-child { + margin-bottom: -5px; + border-bottom: none; +} + +.tabulator .tabulator-footer .tabulator-pages { + margin: 0 7px; +} + +.tabulator .tabulator-footer .tabulator-page { + display: inline-block; + margin: 0 2px; + padding: 2px 5px; + border: 1px solid #aaa; + border-radius: 3px; + background: rgba(255, 255, 255, 0.2); + color: #555; + font-family: inherit; + font-weight: inherit; + font-size: inherit; +} + +.tabulator .tabulator-footer .tabulator-page.active { + color: #d00; +} + +.tabulator .tabulator-footer .tabulator-page:disabled { + opacity: .5; +} + +.tabulator .tabulator-footer .tabulator-page:not(.disabled):hover { + cursor: pointer; + background: rgba(0, 0, 0, 0.2); + color: #fff; +} + +.tabulator .tabulator-col-resize-handle { + position: absolute; + right: 0; + top: 0; + bottom: 0; + width: 5px; +} + +.tabulator .tabulator-col-resize-handle.prev { + left: 0; + right: auto; +} + +.tabulator .tabulator-col-resize-handle:hover { + cursor: ew-resize; +} + +.tabulator .tabulator-loader { + position: absolute; + display: -ms-flexbox; + display: flex; + -ms-flex-align: center; + align-items: center; + top: 0; + left: 0; + z-index: 100; + height: 100%; + width: 100%; + background: rgba(0, 0, 0, 0.4); + text-align: center; +} + +.tabulator .tabulator-loader .tabulator-loader-msg { + display: inline-block; + margin: 0 auto; + padding: 10px 20px; + border-radius: 4px; + background: #fff; + font-weight: bold; + font-size: 16px; +} + +.tabulator .tabulator-loader .tabulator-loader-msg.tabulator-loading { + border: 4px solid #333; + color: #000; +} + +.tabulator .tabulator-loader .tabulator-loader-msg.tabulator-error { + color: #000; +} + +.tabulator-row { + position: relative; + box-sizing: border-box; + min-height: 22px; + background-color: #fff; +} + +.tabulator-row.tabulator-row-even { + background-color: #EFEFEF; +} + +.tabulator-row.tabulator-selectable:hover { + background-color: #bbb; + cursor: pointer; +} + +.tabulator-row.tabulator-selected { + background-color: #9ABCEA; +} + +.tabulator-row.tabulator-selected:hover { + background-color: #769BCC; + cursor: pointer; +} + +.tabulator-row.tabulator-row-moving { + border: 1px solid #000; + background: #fff; +} + +.tabulator-row.tabulator-moving { + position: absolute; + border-top: 1px solid #aaa; + border-bottom: 1px solid #aaa; + pointer-events: none; + z-index: 15; +} + +.tabulator-row .tabulator-row-resize-handle { + position: absolute; + right: 0; + bottom: 0; + left: 0; + height: 5px; +} + +.tabulator-row .tabulator-row-resize-handle.prev { + top: 0; + bottom: auto; +} + +.tabulator-row .tabulator-row-resize-handle:hover { + cursor: ns-resize; +} + +.tabulator-row .tabulator-frozen { + display: inline-block; + position: absolute; + background-color: inherit; + z-index: 10; +} + +.tabulator-row .tabulator-frozen.tabulator-frozen-left { + border-right: 2px solid #aaa; +} + +.tabulator-row .tabulator-frozen.tabulator-frozen-right { + border-left: 2px solid #aaa; +} + +.tabulator-row .tabulator-responsive-collapse { + box-sizing: border-box; + padding: 5px; + border-top: 1px solid #aaa; + border-bottom: 1px solid #aaa; +} + +.tabulator-row .tabulator-responsive-collapse:empty { + display: none; +} + +.tabulator-row .tabulator-responsive-collapse table { + font-size: 14px; +} + +.tabulator-row .tabulator-responsive-collapse table tr td { + position: relative; +} + +.tabulator-row .tabulator-responsive-collapse table tr td:first-of-type { + padding-right: 10px; +} + +.tabulator-row .tabulator-cell { + display: inline-block; + position: relative; + box-sizing: border-box; + padding: 4px; + border-right: 1px solid #aaa; + vertical-align: middle; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; +} + +.tabulator-row .tabulator-cell.tabulator-editing { + border: 1px solid #1D68CD; + padding: 0; +} + +.tabulator-row .tabulator-cell.tabulator-editing input, .tabulator-row .tabulator-cell.tabulator-editing select { + border: 1px; + background: transparent; +} + +.tabulator-row .tabulator-cell.tabulator-validation-fail { + border: 1px solid #dd0000; +} + +.tabulator-row .tabulator-cell.tabulator-validation-fail input, .tabulator-row .tabulator-cell.tabulator-validation-fail select { + border: 1px; + background: transparent; + color: #dd0000; +} + +.tabulator-row .tabulator-cell:first-child .tabulator-col-resize-handle.prev { + display: none; +} + +.tabulator-row .tabulator-cell.tabulator-row-handle { + display: -ms-inline-flexbox; + display: inline-flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: center; + justify-content: center; + -moz-user-select: none; + -khtml-user-select: none; + -webkit-user-select: none; + -o-user-select: none; +} + +.tabulator-row .tabulator-cell.tabulator-row-handle .tabulator-row-handle-box { + width: 80%; +} + +.tabulator-row .tabulator-cell.tabulator-row-handle .tabulator-row-handle-box .tabulator-row-handle-bar { + width: 100%; + height: 3px; + margin-top: 2px; + background: #666; +} + +.tabulator-row .tabulator-cell .tabulator-data-tree-branch { + display: inline-block; + vertical-align: middle; + height: 9px; + width: 7px; + margin-top: -9px; + margin-right: 5px; + border-bottom-left-radius: 1px; + border-left: 2px solid #aaa; + border-bottom: 2px solid #aaa; +} + +.tabulator-row .tabulator-cell .tabulator-data-tree-control { + display: -ms-inline-flexbox; + display: inline-flex; + -ms-flex-pack: center; + justify-content: center; + -ms-flex-align: center; + align-items: center; + vertical-align: middle; + height: 11px; + width: 11px; + margin-right: 5px; + border: 1px solid #333; + border-radius: 2px; + background: rgba(0, 0, 0, 0.1); + overflow: hidden; +} + +.tabulator-row .tabulator-cell .tabulator-data-tree-control:hover { + cursor: pointer; + background: rgba(0, 0, 0, 0.2); +} + +.tabulator-row .tabulator-cell .tabulator-data-tree-control .tabulator-data-tree-control-collapse { + display: inline-block; + position: relative; + height: 7px; + width: 1px; + background: transparent; +} + +.tabulator-row .tabulator-cell .tabulator-data-tree-control .tabulator-data-tree-control-collapse:after { + position: absolute; + content: ""; + left: -3px; + top: 3px; + height: 1px; + width: 7px; + background: #333; +} + +.tabulator-row .tabulator-cell .tabulator-data-tree-control .tabulator-data-tree-control-expand { + display: inline-block; + position: relative; + height: 7px; + width: 1px; + background: #333; +} + +.tabulator-row .tabulator-cell .tabulator-data-tree-control .tabulator-data-tree-control-expand:after { + position: absolute; + content: ""; + left: -3px; + top: 3px; + height: 1px; + width: 7px; + background: #333; +} + +.tabulator-row .tabulator-cell .tabulator-responsive-collapse-toggle { + display: -ms-inline-flexbox; + display: inline-flex; + -ms-flex-align: center; + align-items: center; + -ms-flex-pack: center; + justify-content: center; + -moz-user-select: none; + -khtml-user-select: none; + -webkit-user-select: none; + -o-user-select: none; + height: 15px; + width: 15px; + border-radius: 4px; + background: #666; + color: #fff; + font-weight: bold; + font-size: 1.1em; +} + +.tabulator-row .tabulator-cell .tabulator-responsive-collapse-toggle:hover { + opacity: .7; +} + +.tabulator-row .tabulator-cell .tabulator-responsive-collapse-toggle.open .tabulator-responsive-collapse-toggle-close { + display: initial; +} + +.tabulator-row .tabulator-cell .tabulator-responsive-collapse-toggle.open .tabulator-responsive-collapse-toggle-open { + display: none; +} + +.tabulator-row .tabulator-cell .tabulator-responsive-collapse-toggle .tabulator-responsive-collapse-toggle-close { + display: none; +} + +.tabulator-row.tabulator-group { + box-sizing: border-box; + border-bottom: 1px solid #999; + border-right: 1px solid #aaa; + border-top: 1px solid #999; + padding: 5px; + padding-left: 10px; + background: #ccc; + font-weight: bold; + min-width: 100%; +} + +.tabulator-row.tabulator-group:hover { + cursor: pointer; + background-color: rgba(0, 0, 0, 0.1); +} + +.tabulator-row.tabulator-group.tabulator-group-visible .tabulator-arrow { + margin-right: 10px; + border-left: 6px solid transparent; + border-right: 6px solid transparent; + border-top: 6px solid #666; + border-bottom: 0; +} + +.tabulator-row.tabulator-group.tabulator-group-level-1 .tabulator-arrow { + margin-left: 20px; +} + +.tabulator-row.tabulator-group.tabulator-group-level-2 .tabulator-arrow { + margin-left: 40px; +} + +.tabulator-row.tabulator-group.tabulator-group-level-3 .tabulator-arrow { + margin-left: 60px; +} + +.tabulator-row.tabulator-group.tabulator-group-level-4 .tabulator-arrow { + margin-left: 80px; +} + +.tabulator-row.tabulator-group.tabulator-group-level-5 .tabulator-arrow { + margin-left: 100px; +} + +.tabulator-row.tabulator-group .tabulator-arrow { + display: inline-block; + width: 0; + height: 0; + margin-right: 16px; + border-top: 6px solid transparent; + border-bottom: 6px solid transparent; + border-right: 0; + border-left: 6px solid #666; + vertical-align: middle; +} + +.tabulator-row.tabulator-group span { + margin-left: 10px; + color: #d00; +} + +.tabulator-edit-select-list { + position: absolute; + display: inline-block; + box-sizing: border-box; + max-height: 200px; + background: #fff; + border: 1px solid #aaa; + font-size: 14px; + overflow-y: auto; + -webkit-overflow-scrolling: touch; + z-index: 10000; +} + +.tabulator-edit-select-list .tabulator-edit-select-list-item { + padding: 4px; + color: #333; +} + +.tabulator-edit-select-list .tabulator-edit-select-list-item.active { + color: #fff; + background: #1D68CD; +} + +.tabulator-edit-select-list .tabulator-edit-select-list-item:hover { + cursor: pointer; + color: #fff; + background: #1D68CD; +} + +.tabulator-edit-select-list .tabulator-edit-select-list-group { + border-bottom: 1px solid #aaa; + padding: 4px; + padding-top: 6px; + color: #333; + font-weight: bold; +} -- cgit v1.2.3-70-g09d2 From a890e18a12f2b3bb39eb2f1303de71d6fbb3915c Mon Sep 17 00:00:00 2001 From: Jules Laplace Date: Sun, 16 Dec 2018 00:56:31 +0100 Subject: displaying tabulators with CORS --- client/index.js | 34 +++++++++++++++++--- megapixels/app/site/parser.py | 3 ++ package-lock.json | 44 +++++++++++++++++--------- package.json | 2 ++ site/assets/css/tabulator.css | 63 +++++++++++++++++-------------------- site/public/about/style/index.html | 5 ++- site/public/datasets/lfw/index.html | 6 ++-- 7 files changed, 101 insertions(+), 56 deletions(-) (limited to 'site/assets/css/tabulator.css') diff --git a/client/index.js b/client/index.js index 2ee12c14..a8783522 100644 --- a/client/index.js +++ b/client/index.js @@ -3,6 +3,8 @@ import ReactDOM from 'react-dom' import { AppContainer } from 'react-hot-loader' import { Provider } from 'react-redux' import Tabulator from 'tabulator-tables' +import csv from 'parse-csv' +// import parse from 'csv-parse' import { toArray } from './util' import Applet from './applet' @@ -21,7 +23,7 @@ function appendReactApplet(el, payload) { function appendTabulator(el, payload) { const table = new Tabulator(el, { height: '311px', - layout: 'fitColumns', + layout: 'fitDataFill', placeholder: 'No Data Set', columns: payload.fields.split(', ').map(field => { switch (field) { @@ -38,9 +40,33 @@ function appendTabulator(el, payload) { // {title:"Driver", field:"car", align:"center", formatter:"tickCross", sorter:"boolean"}, }) let path = payload.opt - let columns = payload.fields.split(',').map(s => s.trim()) - console.log(path, columns) - table.setData(path) + // let columns = payload.fields.split(',').map(s => s.trim()) + // console.log(path, columns) + fetch('https://nyc3.digitaloceanspaces.com/megapixels/v1/datasets/lfw/assets/lfw_names_gender_kg_min.csv', { mode: 'cors' }) + .then(r => r.text()) + .then(text => { + const data = csv.toJSON(text, { headers: { included: true } }) + console.log(data) + table.setData(data) + // const parser = parse() + // console.log(parser) + // parser.on('readable', () => { + // let record + // let output = [] + // do { + // record = parser.read() + // if (record) output.push(record) + // } while (record) + // output.shift() + // table.setData(output) + // }) + // parser.on('error', err => { + // console.error(err.message) + // }) + // parser.write(data) + // parser.end() + // table.setData(path, null, xs{ method: 'get', mode: 'cors', cache: 'no-cache' }) + }) } function appendApplets() { diff --git a/megapixels/app/site/parser.py b/megapixels/app/site/parser.py index 40d9c7f6..5f373937 100644 --- a/megapixels/app/site/parser.py +++ b/megapixels/app/site/parser.py @@ -62,6 +62,9 @@ def format_applet(section, s3_path): else: command = payload[0] opt = None + if command == 'python': + return format_section([ section ], s3_path) + applet['command'] = command if opt: applet['opt'] = opt diff --git a/package-lock.json b/package-lock.json index 38588aa5..b3ee072e 100644 --- a/package-lock.json +++ b/package-lock.json @@ -2252,6 +2252,11 @@ "integrity": "sha1-yBSQPkViM3GgR3tAEJqq++6t27Q=", "dev": true }, + "csv-parse": { + "version": "4.2.0", + "resolved": "https://registry.npmjs.org/csv-parse/-/csv-parse-4.2.0.tgz", + "integrity": "sha512-t8KGN+ZKIYUUqXznAIZ723KI3IBILImjhN8VUfAod/VCtn/IpW3R24PYCxl81g4/z4R9DruTVyvavyiw2VRLgw==" + }, "csv-stringify": { "version": "4.3.1", "resolved": "https://registry.npmjs.org/csv-stringify/-/csv-stringify-4.3.1.tgz", @@ -3674,8 +3679,7 @@ "for-in": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/for-in/-/for-in-1.0.2.tgz", - "integrity": "sha1-gQaNKVqBQuwKxybG4iAMMPttXoA=", - "dev": true + "integrity": "sha1-gQaNKVqBQuwKxybG4iAMMPttXoA=" }, "for-own": { "version": "0.1.5", @@ -4978,8 +4982,7 @@ "is-buffer": { "version": "1.1.6", "resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-1.1.6.tgz", - "integrity": "sha512-NcdALwpXkTm5Zvvbk7owOUSvVvBKDgKP5/ewfXEznmQFfs4ZRmanOeKBTjRVjka3QFoN6XJ+9F3USqfHqTaU5w==", - "dev": true + "integrity": "sha512-NcdALwpXkTm5Zvvbk7owOUSvVvBKDgKP5/ewfXEznmQFfs4ZRmanOeKBTjRVjka3QFoN6XJ+9F3USqfHqTaU5w==" }, "is-builtin-module": { "version": "1.0.0", @@ -5048,8 +5051,7 @@ "is-extendable": { "version": "0.1.1", "resolved": "https://registry.npmjs.org/is-extendable/-/is-extendable-0.1.1.tgz", - "integrity": "sha1-YrEQ4omkcUGOPsNqYX1HLjAd/Ik=", - "dev": true + "integrity": "sha1-YrEQ4omkcUGOPsNqYX1HLjAd/Ik=" }, "is-extglob": { "version": "1.0.0", @@ -5104,7 +5106,6 @@ "version": "2.1.0", "resolved": "https://registry.npmjs.org/is-number/-/is-number-2.1.0.tgz", "integrity": "sha1-Afy7s5NGOlSPL0ZszhbezknbkI8=", - "dev": true, "requires": { "kind-of": "^3.0.2" } @@ -5137,7 +5138,6 @@ "version": "2.0.4", "resolved": "https://registry.npmjs.org/is-plain-object/-/is-plain-object-2.0.4.tgz", "integrity": "sha512-h5PpgXkWitc38BBMYawTYMWJHFZJVnBquFE57xFpjB8pJFiF6gZ+bU+WyI/yqXiFR5mdLsgYNaPe8uao6Uv9Og==", - "dev": true, "requires": { "isobject": "^3.0.1" }, @@ -5145,8 +5145,7 @@ "isobject": { "version": "3.0.1", "resolved": "https://registry.npmjs.org/isobject/-/isobject-3.0.1.tgz", - "integrity": "sha1-TkMekrEalzFjaqH5yNHMvP2reN8=", - "dev": true + "integrity": "sha1-TkMekrEalzFjaqH5yNHMvP2reN8=" } } }, @@ -5237,7 +5236,6 @@ "version": "2.1.0", "resolved": "https://registry.npmjs.org/isobject/-/isobject-2.1.0.tgz", "integrity": "sha1-8GVWEJaj8dou9GJy+BXIQNh+DIk=", - "dev": true, "requires": { "isarray": "1.0.0" } @@ -5336,7 +5334,6 @@ "version": "3.2.2", "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz", "integrity": "sha1-MeohpzS6ubuw8yRm2JOupR5KPGQ=", - "dev": true, "requires": { "is-buffer": "^1.1.5" } @@ -5787,7 +5784,6 @@ "version": "1.3.1", "resolved": "https://registry.npmjs.org/mixin-deep/-/mixin-deep-1.3.1.tgz", "integrity": "sha512-8ZItLHeEgaqEvd5lYBXfm4EZSFCX29Jb9K+lAHhDKzReKBQKj3R+7NOF6tjqYi9t4oI8VUfaWITJQm86wnXGNQ==", - "dev": true, "requires": { "for-in": "^1.0.2", "is-extendable": "^1.0.1" @@ -5797,7 +5793,6 @@ "version": "1.0.1", "resolved": "https://registry.npmjs.org/is-extendable/-/is-extendable-1.0.1.tgz", "integrity": "sha512-arnXMxT1hhoKo9k1LZdmlNyJdDDfy2v0fXjFlmok4+i8ul/6WlbVge9bhM74OpNPQPMGUToDtz+KXa1PneJxOA==", - "dev": true, "requires": { "is-plain-object": "^2.0.4" } @@ -6346,6 +6341,27 @@ "pbkdf2": "^3.0.3" } }, + "parse-csv": { + "version": "0.2.0", + "resolved": "https://registry.npmjs.org/parse-csv/-/parse-csv-0.2.0.tgz", + "integrity": "sha1-aIwelLc0DiBzrImB/L8rOLZ8t0w=", + "requires": { + "extend-shallow": "^2.0.1", + "is-number": "^2.1.0", + "isobject": "^2.1.0", + "mixin-deep": "^1.1.3" + }, + "dependencies": { + "extend-shallow": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/extend-shallow/-/extend-shallow-2.0.1.tgz", + "integrity": "sha1-Ua99YUrZqfYQ6huvu5idaxxWiQ8=", + "requires": { + "is-extendable": "^0.1.0" + } + } + } + }, "parse-glob": { "version": "3.0.4", "resolved": "https://registry.npmjs.org/parse-glob/-/parse-glob-3.0.4.tgz", diff --git a/package.json b/package.json index 47c5664c..a444192b 100644 --- a/package.json +++ b/package.json @@ -24,6 +24,7 @@ "clean-webpack-plugin": "^0.1.19", "compression-webpack-plugin": "^2.0.0", "connected-react-router": "^4.3.0", + "csv-parse": "^4.2.0", "csv-stringify": "^4.3.1", "data-uri-to-blob": "0.0.4", "data-uri-to-buffer": "^2.0.0", @@ -33,6 +34,7 @@ "file-saver": "^2.0.0-rc.3", "history": "^4.7.2", "node-fetch": "^2.2.0", + "parse-csv": "^0.2.0", "prop-types": "^15.6.1", "react": "^16.3.0", "react-dom": "^16.3.0", diff --git a/site/assets/css/tabulator.css b/site/assets/css/tabulator.css index 8c123cf4..200f0c5c 100755 --- a/site/assets/css/tabulator.css +++ b/site/assets/css/tabulator.css @@ -37,7 +37,7 @@ display: inline-block; position: relative; box-sizing: border-box; - border-right: 1px solid #aaa; + border-right: 1px solid #333; text-align: left; vertical-align: bottom; overflow: hidden; @@ -45,7 +45,7 @@ .tabulator .tabulator-header .tabulator-col.tabulator-moving { position: absolute; - border: 1px solid #999; + border: 1px solid #333; background: rgba(80,20,10,0.2); pointer-events: none; } @@ -68,7 +68,7 @@ .tabulator .tabulator-header .tabulator-col .tabulator-col-content .tabulator-col-title .tabulator-title-editor { box-sizing: border-box; width: 100%; - border: 1px solid #999; + border: 1px solid #333; padding: 1px; background: #fff; } @@ -89,7 +89,7 @@ position: relative; display: -ms-flexbox; display: flex; - border-top: 1px solid #aaa; + border-top: 1px solid #333; overflow: hidden; } @@ -103,7 +103,7 @@ .tabulator .tabulator-header .tabulator-col.ui-sortable-helper { position: absolute; - border: 1px solid #aaa; + border: 1px solid #333; } .tabulator .tabulator-header .tabulator-col .tabulator-header-filter { @@ -133,7 +133,6 @@ .tabulator .tabulator-header .tabulator-col.tabulator-sortable:hover { cursor: pointer; - background-color: #cdcdcd; } .tabulator .tabulator-header .tabulator-col.tabulator-sortable[aria-sort="none"] .tabulator-col-content .tabulator-arrow { @@ -190,19 +189,19 @@ } .tabulator .tabulator-header .tabulator-frozen.tabulator-frozen-left { - border-right: 2px solid #aaa; + border-right: 2px solid #333; } .tabulator .tabulator-header .tabulator-frozen.tabulator-frozen-right { - border-left: 2px solid #aaa; + border-left: 2px solid #333; } .tabulator .tabulator-header .tabulator-calcs-holder { box-sizing: border-box; min-width: 400%; background: rgba(80,20,10,0.2); - border-top: 1px solid #aaa; - border-bottom: 1px solid #aaa; + border-top: 1px solid #333; + border-bottom: 1px solid #333; overflow: hidden; } @@ -262,10 +261,8 @@ .tabulator .tabulator-tableHolder .tabulator-table { position: relative; display: inline-block; - background-color: #fff; white-space: nowrap; overflow: visible; - color: #333; } .tabulator .tabulator-tableHolder .tabulator-table .tabulator-row.tabulator-calcs { @@ -274,11 +271,11 @@ } .tabulator .tabulator-tableHolder .tabulator-table .tabulator-row.tabulator-calcs.tabulator-calcs-top { - border-bottom: 2px solid #aaa; + border-bottom: 2px solid #333; } .tabulator .tabulator-tableHolder .tabulator-table .tabulator-row.tabulator-calcs.tabulator-calcs-bottom { - border-top: 2px solid #aaa; + border-top: 2px solid #333; } .tabulator .tabulator-footer { @@ -302,8 +299,8 @@ margin: -5px -10px 5px -10px; text-align: left; background: rgba(80,20,10,0.2); - border-bottom: 1px solid #aaa; - border-top: 1px solid #aaa; + border-bottom: 1px solid #333; + border-top: 1px solid #333; overflow: hidden; } @@ -328,7 +325,7 @@ display: inline-block; margin: 0 2px; padding: 2px 5px; - border: 1px solid #aaa; + border: 1px solid #333; border-radius: 3px; background: rgba(255, 255, 255, 0.2); color: #555; @@ -406,15 +403,12 @@ position: relative; box-sizing: border-box; min-height: 22px; - background-color: #fff; } .tabulator-row.tabulator-row-even { - background-color: #EFEFEF; } .tabulator-row.tabulator-selectable:hover { - background-color: #bbb; cursor: pointer; } @@ -423,7 +417,7 @@ } .tabulator-row.tabulator-selected:hover { - background-color: #769BCC; + background-color: #555; cursor: pointer; } @@ -434,8 +428,8 @@ .tabulator-row.tabulator-moving { position: absolute; - border-top: 1px solid #aaa; - border-bottom: 1px solid #aaa; + border-top: 1px solid #333; + border-bottom: 1px solid #333; pointer-events: none; z-index: 15; } @@ -465,18 +459,18 @@ } .tabulator-row .tabulator-frozen.tabulator-frozen-left { - border-right: 2px solid #aaa; + border-right: 2px solid #333; } .tabulator-row .tabulator-frozen.tabulator-frozen-right { - border-left: 2px solid #aaa; + border-left: 2px solid #333; } .tabulator-row .tabulator-responsive-collapse { box-sizing: border-box; padding: 5px; - border-top: 1px solid #aaa; - border-bottom: 1px solid #aaa; + border-top: 1px solid #333; + border-bottom: 1px solid #333; } .tabulator-row .tabulator-responsive-collapse:empty { @@ -500,7 +494,7 @@ position: relative; box-sizing: border-box; padding: 4px; - border-right: 1px solid #aaa; + border-right: 1px solid #333; vertical-align: middle; white-space: nowrap; overflow: hidden; @@ -563,8 +557,8 @@ margin-top: -9px; margin-right: 5px; border-bottom-left-radius: 1px; - border-left: 2px solid #aaa; - border-bottom: 2px solid #aaa; + border-left: 2px solid #333; + border-bottom: 2px solid #333; } .tabulator-row .tabulator-cell .tabulator-data-tree-control { @@ -604,7 +598,6 @@ top: 3px; height: 1px; width: 7px; - background: #333; } .tabulator-row .tabulator-cell .tabulator-data-tree-control .tabulator-data-tree-control-expand { @@ -664,11 +657,11 @@ .tabulator-row.tabulator-group { box-sizing: border-box; border-bottom: 1px solid #999; - border-right: 1px solid #aaa; + border-right: 1px solid #333; border-top: 1px solid #999; padding: 5px; padding-left: 10px; - background: #ccc; + background: #333; font-weight: bold; min-width: 100%; } @@ -729,7 +722,7 @@ box-sizing: border-box; max-height: 200px; background: #fff; - border: 1px solid #aaa; + border: 1px solid #333; font-size: 14px; overflow-y: auto; -webkit-overflow-scrolling: touch; @@ -753,7 +746,7 @@ } .tabulator-edit-select-list .tabulator-edit-select-list-group { - border-bottom: 1px solid #aaa; + border-bottom: 1px solid #333; padding: 4px; padding-top: 6px; color: #333; diff --git a/site/public/about/style/index.html b/site/public/about/style/index.html index d3784b31..da0d718f 100644 --- a/site/public/about/style/index.html +++ b/site/public/about/style/index.html @@ -52,7 +52,10 @@
Person 3. Let me tell you about Person 3. This person has a very long description with text which wraps like crazy
Person 3. Let me tell you about Person 3. This person has a very long description with text which wraps like crazy

est, qui dolorem ipsum, quia dolor sit amet consectetur adipisci[ng] velit, sed quia non-numquam [do] eius modi tempora inci[di]dunt, ut labore et dolore magnam aliquam quaerat voluptatem.

This image is extremely wide and the text beneath it will wrap but thats fine because it can also contain <a href="https://example.com/">hyperlinks</a>! Yes, you read that right—hyperlinks! Lorem ipsum dolor sit amet ad volotesque sic hoc ad nauseam
This image is extremely wide and the text beneath it will wrap but that's fine because it can also contain hyperlinks! Yes, you read that right—hyperlinks! Lorem ipsum dolor sit amet ad volotesque sic hoc ad nauseam

Inline code has back-ticks around it.

-

Horizontal rule

+
s = "Python syntax highlighting"
+print(s)
+
+

Horizontal rule

Citations below here

diff --git a/site/public/datasets/lfw/index.html b/site/public/datasets/lfw/index.html index b375247b..1c075a1f 100644 --- a/site/public/datasets/lfw/index.html +++ b/site/public/datasets/lfw/index.html @@ -31,7 +31,7 @@
Created
2007
Images
13,233
People
5,749
Created From
Yahoo News images
Search available
Searchable

Labeled Faces in The Wild (LFW) is amongst the most widely used facial recognition training datasets in the world and is the first of its kind to be created entirely from images posted online. The LFW dataset includes 13,233 images of 5,749 people that were collected between 2002-2004. Use the tools below to check if you were included in this dataset or scroll down to read the analysis.

Eighteen of the 5,749 people in the Labeled Faces in the Wild Dataset. The most widely used face dataset for benchmarking commercial face recognition algorithms.
Eighteen of the 5,749 people in the Labeled Faces in the Wild Dataset. The most widely used face dataset for benchmarking commercial face recognition algorithms.

Intro

Three paragraphs describing the LFW dataset in a format that can be easily replicated for the other datasets. Nothing too custom. An analysis of the initial research papers with context relative to all the other dataset papers.

-
all 5,749 people in the LFW Dataset sorted from most to least images collected.
all 5,749 people in the LFW Dataset sorted from most to least images collected.

LFW by the Numbers

+
all 5,749 people in the LFW Dataset sorted from most to least images collected.
all 5,749 people in the LFW Dataset sorted from most to least images collected.

LFW by the Numbers

  • Was first published in 2007
  • Developed out of a prior dataset from Berkely called "Faces in the Wild" or "Names and Faces" [^lfw_original_paper]
    • @@ -220,7 +220,9 @@ name_display,company_url,example_url,country,description

    Code

    -

import numpy as np +

```python

+

!/usr/bin/python

+

import numpy as np from sklearn.datasets import fetch_lfw_people import imageio import imutils

-- cgit v1.2.3-70-g09d2