diff options
Diffstat (limited to 'client')
| -rw-r--r-- | client/actions.js | 12 | ||||
| -rw-r--r-- | client/app.js | 46 | ||||
| -rw-r--r-- | client/applet.js | 13 | ||||
| -rw-r--r-- | client/index.js | 109 | ||||
| -rw-r--r-- | client/session.js | 6 | ||||
| -rw-r--r-- | client/store.js | 28 | ||||
| -rw-r--r-- | client/util.js | 28 |
7 files changed, 135 insertions, 107 deletions
diff --git a/client/actions.js b/client/actions.js index ba899f06..779113f8 100644 --- a/client/actions.js +++ b/client/actions.js @@ -1,9 +1,9 @@ -import * as search from './search/search.actions' -import * as review from './review/review.actions' -import * as metadata from './metadata/metadata.actions' +// import * as search from './search/search.actions' +// import * as review from './review/review.actions' +// import * as metadata from './metadata/metadata.actions' export { - search, - review, - metadata, + // search, + // review, + // metadata, } diff --git a/client/app.js b/client/app.js deleted file mode 100644 index 6c008ec6..00000000 --- a/client/app.js +++ /dev/null @@ -1,46 +0,0 @@ -import React, { Component } from 'react' -import { ConnectedRouter } from 'connected-react-router' -import { Route, Switch } from 'react-router' - -import { Header, Sidebar, Footer } from './common' -import * as Metadata from './metadata' -import * as Search from './search' -import * as Review from './review' - -export default class App extends Component { - render() { - return ( - <ConnectedRouter history={this.props.history}> - <div> - <Header /> - <div className='app'> - <Route path="/metadata/" component={Sidebar} /> - <div className='body'> - <Route path="/search/" component={Search.Menu} /> - <Route path="/metadata/:hash/" component={Metadata.Heading} /> - <Switch> - <Route exact path="/metadata/:hash/summary/" component={Metadata.Summary} /> - <Route exact path="/metadata/:hash/mediaRecord/" component={Metadata.MediaRecord} /> - <Route exact path="/metadata/:hash/mediaInfo/" component={Metadata.MediaInfo} /> - <Route exact path="/metadata/:hash/keyframe/:frame/" component={Metadata.KeyframeSingle} /> - <Route exact path="/metadata/:hash/keyframe/" component={Metadata.KeyframeList} /> - <Route exact path="/metadata/:hash/coco/" component={Metadata.Coco} /> - <Route exact path="/metadata/:hash/places365/" component={Metadata.Places365} /> - <Route exact path="/metadata/:hash/sugarcube/" component={Metadata.Sugarcube} /> - <Route exact path="/metadata/:hash/" component={Metadata.Summary} /> - <Route exact path="/metadata/" render={() => <div className='notFound'><h4>NOT FOUND</h4></div>} /> - <Route exact path="/search/" component={Search.Container} /> - <Route exact path="/search/keyframe/:verified/:hash/:frame/" component={Search.Container} /> - <Route exact path="/search/keyframe/:hash/:frame/" component={Search.Container} /> - <Route exact path="/search/browse/:hash/" component={Search.Browse} /> - <Route exact path="/search/random/" component={Search.Random} /> - <Route exact path="/search/review/" component={Review.Saved} /> - </Switch> - </div> - </div> - <Footer /> - </div> - </ConnectedRouter> - ) - } -} diff --git a/client/applet.js b/client/applet.js new file mode 100644 index 00000000..f218a7f2 --- /dev/null +++ b/client/applet.js @@ -0,0 +1,13 @@ +import React, { Component } from 'react' + +// import { Header, Sidebar, Footer } from './common' + +export default class Applet extends Component { + render() { + return ( + <div className='applet'> + <pre style={{ color: '#0f0' }}>{'Megapixels'}</pre> + </div> + ) + } +} diff --git a/client/index.js b/client/index.js index eddc5fb2..a8783522 100644 --- a/client/index.js +++ b/client/index.js @@ -2,18 +2,105 @@ 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 App from './app' +import { toArray } from './util' +import Applet from './applet' +import { store } from './store' -import { store, history } from './store' +function appendReactApplet(el, payload) { + ReactDOM.render( + <AppContainer> + <Provider store={store}> + <Applet command={payload} /> + </Provider> + </AppContainer>, el + ) +} -const container = document.createElement('div') -document.body.appendChild(container) +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' }) + }) +} -ReactDOM.render( - <AppContainer> - <Provider store={store}> - <App history={history} /> - </Provider> - </AppContainer>, container -) +function appendApplets() { + toArray(document.querySelectorAll('.applet')).forEach(el => { + console.log(el.dataset.payload) + let payload; + try { + payload = JSON.parse(el.dataset.payload) + } catch (e) { + return + } + console.log(payload) + switch (payload.command) { + case 'load file': + appendTabulator(el, payload) + break + default: + appendReactApplet(el, payload) + break + } + }) +} + +function main() { + const paras = document.querySelectorAll('section p') + if (paras.length) { + paras[0].classList.add('first_paragraph') + } + toArray(document.querySelectorAll('header .links a')).forEach(tag => { + if (window.location.href.match(tag.href)) { + tag.classList.add('active') + } + }) + appendApplets() +} + +main() diff --git a/client/session.js b/client/session.js index 5bfae7eb..0fae31d2 100644 --- a/client/session.js +++ b/client/session.js @@ -1,5 +1,5 @@ -import Storage from 'store2' +// import Storage from 'store2' -const session = Storage.namespace('vcat.search') +// const session = Storage.namespace('vcat.search') -export default session +// export default session diff --git a/client/store.js b/client/store.js index 043af351..3c7acefb 100644 --- a/client/store.js +++ b/client/store.js @@ -1,30 +1,27 @@ import { applyMiddleware, compose, combineReducers, createStore } from 'redux' -import { connectRouter, routerMiddleware } from 'connected-react-router' -import { createBrowserHistory } from 'history' import thunk from 'redux-thunk' -import { login } from './util' -import metadataReducer from './metadata/metadata.reducer' -import searchReducer from './search/search.reducer' -import reviewReducer from './review/review.reducer' +// import metadataReducer from './metadata/metadata.reducer' +// import searchReducer from './search/search.reducer' +// import reviewReducer from './review/review.reducer' const rootReducer = combineReducers({ - auth: (state = login()) => state, - metadata: metadataReducer, - search: searchReducer, - review: reviewReducer, + auth: (state = {}) => state, + // auth: (state = login()) => state, + // metadata: metadataReducer, + // search: searchReducer, + // review: reviewReducer, }) -function configureStore(initialState = {}, history) { +function configureStore(initialState = {}) { const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose const store = createStore( - connectRouter(history)(rootReducer), // new root reducer with router state + rootReducer, initialState, composeEnhancers( applyMiddleware( thunk, - routerMiddleware(history) ), ), ) @@ -32,7 +29,6 @@ function configureStore(initialState = {}, history) { return store } -const history = createBrowserHistory() -const store = configureStore({}, history) +const store = configureStore({}) -export { store, history } +export { store } diff --git a/client/util.js b/client/util.js index ad303c64..50d4992a 100644 --- a/client/util.js +++ b/client/util.js @@ -6,6 +6,9 @@ export const isAndroid = !!(navigator.userAgent.match(/Android/i)) export const isMobile = isiPhone || isiPad || isAndroid export const isDesktop = !isMobile +export const toArray = a => Array.prototype.slice.apply(a) +export const choice = a => a[Math.floor(Math.random() * a.length)] + const htmlClassList = document.body.parentNode.classList htmlClassList.add(isDesktop ? 'desktop' : 'mobile') @@ -140,28 +143,3 @@ export const post = (uri, data, credentials) => { // headers['X-CSRFToken'] = csrftoken return fetch(uri, opt).then(res => res.json()) } - -// api queries -export const login = () => { - if (cachedAuth) return cachedAuth - const isLocal = (window.location.hostname === '0.0.0.0' || window.location.hostname === '127.0.0.1') - try { - const auth = JSON.parse(JSON.parse(localStorage.getItem('persist:root')).auth) - // console.log('auth', auth) - token = auth.token - username = auth.user.username - if (token) { - console.log('logged in', username) - } - cachedAuth = auth - if (!token && !isLocal) { - window.location.href = '/' - } - return auth - } catch (e) { - if (!isLocal) { - window.location.href = '/' - } - return {} - } -} |