Started adding some material UI components.

This commit is contained in:
John Shaver 2017-07-13 16:11:35 -07:00
parent 079cf41e43
commit e7d7a7ac0c
6 changed files with 106 additions and 17 deletions

80
package-lock.json generated
View File

@ -747,6 +747,11 @@
"resolved": "https://registry.npmjs.org/boom/-/boom-2.10.1.tgz",
"integrity": "sha1-OciRjO/1eZ+D+UkqhI9iWt0Mdm8="
},
"bowser": {
"version": "1.7.0",
"resolved": "https://registry.npmjs.org/bowser/-/bowser-1.7.0.tgz",
"integrity": "sha1-Fp3kAYcR+ZQkK/+agAnneh814AM="
},
"boxen": {
"version": "0.6.0",
"resolved": "https://registry.npmjs.org/boxen/-/boxen-0.6.0.tgz",
@ -930,6 +935,11 @@
"resolved": "https://registry.npmjs.org/center-align/-/center-align-0.1.3.tgz",
"integrity": "sha1-qg0yYptu6XIgBBHL1EYckHvCt60="
},
"chain-function": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/chain-function/-/chain-function-1.0.0.tgz",
"integrity": "sha1-DUqzfn4Y6tC9xHuSB2QRjOWHM9w="
},
"chalk": {
"version": "1.1.3",
"resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
@ -947,6 +957,11 @@
}
}
},
"change-emitter": {
"version": "0.1.6",
"resolved": "https://registry.npmjs.org/change-emitter/-/change-emitter-0.1.6.tgz",
"integrity": "sha1-6LL+PX8at9aaMhma/5HqaTFAlRU="
},
"chokidar": {
"version": "1.7.0",
"resolved": "https://registry.npmjs.org/chokidar/-/chokidar-1.7.0.tgz",
@ -1230,6 +1245,11 @@
"resolved": "https://registry.npmjs.org/css-color-names/-/css-color-names-0.0.4.tgz",
"integrity": "sha1-gIrcLnnPhHOAabZGyyDsJ762KeA="
},
"css-in-js-utils": {
"version": "1.0.3",
"resolved": "https://registry.npmjs.org/css-in-js-utils/-/css-in-js-utils-1.0.3.tgz",
"integrity": "sha1-msfgL3Y8+F2UAXZmVl7WiltfMhU="
},
"css-loader": {
"version": "0.28.4",
"resolved": "https://registry.npmjs.org/css-loader/-/css-loader-0.28.4.tgz",
@ -1480,6 +1500,11 @@
}
}
},
"dom-helpers": {
"version": "3.2.1",
"resolved": "https://registry.npmjs.org/dom-helpers/-/dom-helpers-3.2.1.tgz",
"integrity": "sha1-MgPgf+0he9H0JLAZc1WC/Deyglo="
},
"dom-serializer": {
"version": "0.1.0",
"resolved": "https://registry.npmjs.org/dom-serializer/-/dom-serializer-0.1.0.tgz",
@ -2877,6 +2902,11 @@
"resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-0.0.1.tgz",
"integrity": "sha1-P5E2XKvmC3ftDruiS0VOPgnZWoI="
},
"hyphenate-style-name": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/hyphenate-style-name/-/hyphenate-style-name-1.0.2.tgz",
"integrity": "sha1-MRYKNpMK2vH8BMYHT360FGXU7Es="
},
"iconv-lite": {
"version": "0.4.18",
"resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.18.tgz",
@ -2937,6 +2967,11 @@
"resolved": "https://registry.npmjs.org/ini/-/ini-1.3.4.tgz",
"integrity": "sha1-BTfLedr1m1mhpRff9wbIbsA5Fi4="
},
"inline-style-prefixer": {
"version": "3.0.6",
"resolved": "https://registry.npmjs.org/inline-style-prefixer/-/inline-style-prefixer-3.0.6.tgz",
"integrity": "sha1-sn/jCbQWijHq84yOjGCrnnwRcx8="
},
"inquirer": {
"version": "0.12.0",
"resolved": "https://registry.npmjs.org/inquirer/-/inquirer-0.12.0.tgz",
@ -3473,6 +3508,11 @@
"resolved": "https://registry.npmjs.org/jsx-ast-utils/-/jsx-ast-utils-1.4.1.tgz",
"integrity": "sha1-OGchPo3Xm/Ho8jAMDPwe+xgsDfE="
},
"keycode": {
"version": "2.1.9",
"resolved": "https://registry.npmjs.org/keycode/-/keycode-2.1.9.tgz",
"integrity": "sha1-lkojxU5IiUBbSGGlyfBIDUUUHfo="
},
"kind-of": {
"version": "3.2.2",
"resolved": "https://registry.npmjs.org/kind-of/-/kind-of-3.2.2.tgz",
@ -3588,6 +3628,11 @@
"resolved": "https://registry.npmjs.org/lodash.memoize/-/lodash.memoize-4.1.2.tgz",
"integrity": "sha1-vMbEmkKihA7Zl/Mj6tpezRguC/4="
},
"lodash.merge": {
"version": "4.6.0",
"resolved": "https://registry.npmjs.org/lodash.merge/-/lodash.merge-4.6.0.tgz",
"integrity": "sha1-aYhLoUSsM/5plzemCG3v+t0PicU="
},
"lodash.pick": {
"version": "4.4.0",
"resolved": "https://registry.npmjs.org/lodash.pick/-/lodash.pick-4.4.0.tgz",
@ -3603,6 +3648,11 @@
"resolved": "https://registry.npmjs.org/lodash.templatesettings/-/lodash.templatesettings-4.1.0.tgz",
"integrity": "sha1-K01OlbpEDZFf8IvImeRVNmZxMxY="
},
"lodash.throttle": {
"version": "4.1.1",
"resolved": "https://registry.npmjs.org/lodash.throttle/-/lodash.throttle-4.1.1.tgz",
"integrity": "sha1-wj6RtxAkKscMN/HhzaknTMOb8vQ="
},
"lodash.uniq": {
"version": "4.5.0",
"resolved": "https://registry.npmjs.org/lodash.uniq/-/lodash.uniq-4.5.0.tgz",
@ -3653,6 +3703,11 @@
"resolved": "https://registry.npmjs.org/map-obj/-/map-obj-1.0.1.tgz",
"integrity": "sha1-2TPOuSBdgr3PSIb2dCvcK03qFG0="
},
"material-ui": {
"version": "0.18.6",
"resolved": "https://registry.npmjs.org/material-ui/-/material-ui-0.18.6.tgz",
"integrity": "sha512-wkYxqwrO/bOipy05ZdYNDDAkkq8GlEowFZbSj/8y2joNTzwus9Q1mom+jEW9rv44JBWxzFl2PXRqzO5JqCCGxg=="
},
"math-expression-evaluator": {
"version": "1.2.17",
"resolved": "https://registry.npmjs.org/math-expression-evaluator/-/math-expression-evaluator-1.2.17.tgz",
@ -5044,6 +5099,11 @@
}
}
},
"react-event-listener": {
"version": "0.4.5",
"resolved": "https://registry.npmjs.org/react-event-listener/-/react-event-listener-0.4.5.tgz",
"integrity": "sha1-4+iVoJcM8U7o+JAROvaBl6vz0LE="
},
"react-router": {
"version": "4.1.1",
"resolved": "https://registry.npmjs.org/react-router/-/react-router-4.1.1.tgz",
@ -5061,6 +5121,16 @@
}
}
},
"react-tap-event-plugin": {
"version": "2.0.1",
"resolved": "https://registry.npmjs.org/react-tap-event-plugin/-/react-tap-event-plugin-2.0.1.tgz",
"integrity": "sha1-MWvrO8ZVbinshppyk+icgmqQdNI="
},
"react-transition-group": {
"version": "1.2.0",
"resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-1.2.0.tgz",
"integrity": "sha1-tR/JIbDDg1p+98Vxx5/ILHPpIE8="
},
"read-all-stream": {
"version": "3.1.0",
"resolved": "https://registry.npmjs.org/read-all-stream/-/read-all-stream-3.1.0.tgz",
@ -5108,6 +5178,11 @@
"resolved": "https://registry.npmjs.org/rechoir/-/rechoir-0.6.2.tgz",
"integrity": "sha1-hSBLVNuoLVdC4oyWdW70OvUOM4Q="
},
"recompose": {
"version": "0.23.4",
"resolved": "https://registry.npmjs.org/recompose/-/recompose-0.23.4.tgz",
"integrity": "sha1-rwnk4IQk7/pEnJt5MDcWb3swZEo="
},
"recursive-readdir": {
"version": "2.2.1",
"resolved": "https://registry.npmjs.org/recursive-readdir/-/recursive-readdir-2.2.1.tgz",
@ -5469,6 +5544,11 @@
"resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-3.0.2.tgz",
"integrity": "sha1-tf3AjxKH6hF4Yo5BXiUTK3NkbG0="
},
"simple-assign": {
"version": "0.1.0",
"resolved": "https://registry.npmjs.org/simple-assign/-/simple-assign-0.1.0.tgz",
"integrity": "sha1-F/0wZqXz13OPUDIbsPFMooHMS6o="
},
"slash": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/slash/-/slash-1.0.0.tgz",

View File

@ -3,11 +3,13 @@
"version": "0.1.0",
"private": true,
"dependencies": {
"material-ui": "^0.18.6",
"react": "^15.6.1",
"react-apollo": "^1.4.2",
"react-dom": "^15.6.1",
"react-router": "^4.1.1",
"react-scripts": "1.0.10"
"react-scripts": "1.0.10",
"react-tap-event-plugin": "^2.0.1"
},
"scripts": {
"start": "react-scripts start",

View File

@ -10,6 +10,7 @@
-->
<link rel="manifest" href="%PUBLIC_URL%/manifest.json">
<link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">
<link href="https://fonts.googleapis.com/css?family=Roboto:300,300i,400,700" rel="stylesheet">
<!--
Notice the use of %PUBLIC_URL% in the tags above.
It will be replaced with the URL of the `public` folder during the build.

View File

@ -6,11 +6,11 @@ import ScoutOverview from './components/ScoutOverview.js';
class App extends Component {
render() {
const scoutID = getQueryParamByName("id", this.props.slug);
const MainView = ScoutOverviewCont(ScoutOverview);
const ScoutView = ScoutOverviewCont(ScoutOverview);
return (
<div className="App">
<MainView scoutID={scoutID} />
<ScoutView scoutID={scoutID} />
</div>
);
}

View File

@ -1,6 +1,7 @@
import React from "react";
import AllAdventures from '../containers/GetAllAdventures.js'
import AdventureList from './AdventureList.js';
import AppBar from 'material-ui/AppBar';
export default ({
scoutID,
@ -9,11 +10,15 @@ export default ({
completedAdventures,
completedAchievements
}) => {
const appBarProps = {
title: displayName,
showMenuIconButton: false
}
const AdventureListComp = AllAdventures(AdventureList);
console.log(displayName)
return (
<div>
{displayName}
<AppBar {...appBarProps} />
<AdventureListComp
{...{scoutID, completedAdventures, completedAchievements}}
/>

View File

@ -1,20 +1,19 @@
import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
//import registerServiceWorker from './registerServiceWorker';
import injectTapEventPlugin from 'react-tap-event-plugin';
// Needed for onTouchTap
// http://stackoverflow.com/a/34015469/988941
injectTapEventPlugin();
import {
ApolloClient,
createNetworkInterface,
ApolloProvider
} from 'react-apollo';
import injectTapEventPlugin from 'react-tap-event-plugin';
import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider';
//import registerServiceWorker from './registerServiceWorker';
import './index.css';
import App from './App';
// Needed for onTouchTap in materialUI
// http://stackoverflow.com/a/34015469/988941
injectTapEventPlugin();
const client = new ApolloClient({
networkInterface: createNetworkInterface({
@ -27,9 +26,11 @@ const loc = window.location;
console.log("location: ", loc);
ReactDOM.render(
<ApolloProvider client={client}>
<App slug={loc.pathname} query={loc.search} />
</ApolloProvider>,
<MuiThemeProvider>
<ApolloProvider client={client}>
<App slug={loc.pathname} query={loc.search} />
</ApolloProvider>
</MuiThemeProvider>,
document.getElementById('root')
);