2 files changed, 45 insertions, 53 deletions
diff --git a/client/index.js b/client/index.js
index a8783522..27110a18 100644
--- a/client/index.js
+++ b/client/index.js
@@ -2,13 +2,11 @@ import React from 'react'
 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'
 import { store } from './store'
+import appendTable from './tables'
 
 function appendReactApplet(el, payload) {
   ReactDOM.render(
@@ -20,55 +18,6 @@ function appendReactApplet(el, payload) {
   )
 }
 
-function appendTabulator(el, payload) {
-  const table = new Tabulator(el, {
-    height: '311px',
-    layout: 'fitDataFill',
-    placeholder: 'No Data Set',
-    columns: payload.fields.split(', ').map(field => {
-      switch (field) {
-        default:
-          return { title: field, field: field.toLowerCase(), sorter: 'string' }
-      }
-    }),
-    // {title:'Name', field:'name', sorter:'string', width:200},
-    // {title:'Progress', field:'progress', sorter:'number', formatter:'progress'},
-    // {title:'Gender', field:'gender', sorter:"string"},
-    // {title:"Rating", field:"rating", formatter:"star", align:"center", width:100},
-    // {title:"Favourite Color", field:"col", sorter:"string", sortable:false},
-    // {title:"Date Of Birth", field:"dob", sorter:"date", align:"center"},
-    // {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)
-  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() {
   toArray(document.querySelectorAll('.applet')).forEach(el => {
     console.log(el.dataset.payload)
@@ -81,7 +30,7 @@ function appendApplets() {
     console.log(payload)
     switch (payload.command) {
       case 'load file':
-        appendTabulator(el, payload)
+        appendTable(el, payload)
         break
       default:
         appendReactApplet(el, payload)
diff --git a/client/tables.js b/client/tables.js
new file mode 100644
index 00000000..6b00bbde
--- /dev/null
+++ b/client/tables.js
@@ -0,0 +1,43 @@
+import Tabulator from 'tabulator-tables'
+import csv from 'parse-csv'
+
+const datasetColumns = [
+  { title: 'Title', field: 'title', sorter: 'string' },
+  { title: 'Images', field: 'images', sorter: 'number' },
+  { title: 'People', field: 'people', sorter: 'number' },
+  { title: 'Year', field: 'year', sorter: 'number' },
+  { title: 'Citations', field: 'citations', sorter: 'number' },
+  { title: 'Influenced', field: 'influenced', sorter: 'number' },
+  // { title: 'Origin', field: 'origin', sorter: 'string' },
+]
+
+function getColumns(payload) {
+  if (payload.opt.match('datasets.csv')) {
+    return datasetColumns
+  }
+  return (payload.fields || '').split(', ').map(field => {
+    switch (field) {
+      default:
+        return { title: field, field: field.toLowerCase(), sorter: 'string' }
+    }
+  })
+}
+
+export default function append(el, payload) {
+  const columns = getColumns(payload)
+  const table = new Tabulator(el, {
+    height: '311px',
+    layout: 'fitDataFill',
+    placeholder: 'No Data Set',
+    columns,
+  })
+  // let path = payload.opt
+  // console.log(path, columns)
+  fetch(payload.opt, { mode: 'cors' })
+    .then(r => r.text())
+    .then(text => {
+      const data = csv.toJSON(text, { headers: { included: true } })
+      console.log(data)
+      table.setData(data)
+    })
+}