diff --git a/client/src/App.js b/client/src/App.js index 3cc637415..ded1338cf 100644 --- a/client/src/App.js +++ b/client/src/App.js @@ -27,11 +27,16 @@ import Modules from './components/Modules' import Contact from './components/Contact' import Logout from './components/Logout' import Post from './components/Post' -import Footer from './components/Footer' +// import Footer from './components/Footer' import Callback from './components/Callback' import Auth from './auth/Auth' +import { +// NavBar, + Footer +} from './views' + // Apollo Client Setup const httpLink = new HttpLink({ uri: 'http://localhost:4000/graphql', changeOrigin: true }) diff --git a/client/src/assets/logos/advanced-algos/aa-logo-dark.svg b/client/src/assets/logos/advanced-algos/aa-logo-dark.svg new file mode 100644 index 000000000..479feeb86 --- /dev/null +++ b/client/src/assets/logos/advanced-algos/aa-logo-dark.svg @@ -0,0 +1 @@ +aa-logo-dark \ No newline at end of file diff --git a/client/src/assets/logos/advanced-algos/aa-logo-vert.svg b/client/src/assets/logos/advanced-algos/aa-logo-vert.svg new file mode 100644 index 000000000..442e9a7fd --- /dev/null +++ b/client/src/assets/logos/advanced-algos/aa-logo-vert.svg @@ -0,0 +1 @@ +aa-logo-vert \ No newline at end of file diff --git a/client/src/assets/logos/advanced-algos/aa-logo.png b/client/src/assets/logos/advanced-algos/aa-logo.png new file mode 100644 index 000000000..9701ee1c0 Binary files /dev/null and b/client/src/assets/logos/advanced-algos/aa-logo.png differ diff --git a/client/src/assets/logos/advanced-algos/favicon/android-chrome-192x192.png b/client/src/assets/logos/advanced-algos/favicon/android-chrome-192x192.png new file mode 100644 index 000000000..150043a06 Binary files /dev/null and b/client/src/assets/logos/advanced-algos/favicon/android-chrome-192x192.png differ diff --git a/client/src/assets/logos/advanced-algos/favicon/android-chrome-512x512.png b/client/src/assets/logos/advanced-algos/favicon/android-chrome-512x512.png new file mode 100644 index 000000000..d98b9ce8d Binary files /dev/null and b/client/src/assets/logos/advanced-algos/favicon/android-chrome-512x512.png differ diff --git a/client/src/assets/logos/advanced-algos/favicon/apple-touch-icon.png b/client/src/assets/logos/advanced-algos/favicon/apple-touch-icon.png new file mode 100644 index 000000000..95ec62746 Binary files /dev/null and b/client/src/assets/logos/advanced-algos/favicon/apple-touch-icon.png differ diff --git a/client/src/assets/logos/advanced-algos/favicon/browserconfig.xml b/client/src/assets/logos/advanced-algos/favicon/browserconfig.xml new file mode 100644 index 000000000..b3930d0f0 --- /dev/null +++ b/client/src/assets/logos/advanced-algos/favicon/browserconfig.xml @@ -0,0 +1,9 @@ + + + + + + #da532c + + + diff --git a/client/src/assets/logos/advanced-algos/favicon/favicon-16x16.png b/client/src/assets/logos/advanced-algos/favicon/favicon-16x16.png new file mode 100644 index 000000000..99bda00af Binary files /dev/null and b/client/src/assets/logos/advanced-algos/favicon/favicon-16x16.png differ diff --git a/client/src/assets/logos/advanced-algos/favicon/favicon-32x32.png b/client/src/assets/logos/advanced-algos/favicon/favicon-32x32.png new file mode 100644 index 000000000..08c2369b0 Binary files /dev/null and b/client/src/assets/logos/advanced-algos/favicon/favicon-32x32.png differ diff --git a/client/src/assets/logos/advanced-algos/favicon/favicon.ico b/client/src/assets/logos/advanced-algos/favicon/favicon.ico new file mode 100644 index 000000000..cd2c5d6af Binary files /dev/null and b/client/src/assets/logos/advanced-algos/favicon/favicon.ico differ diff --git a/client/src/assets/logos/advanced-algos/favicon/html_code.html b/client/src/assets/logos/advanced-algos/favicon/html_code.html new file mode 100644 index 000000000..a66b72bb6 --- /dev/null +++ b/client/src/assets/logos/advanced-algos/favicon/html_code.html @@ -0,0 +1,9 @@ + + + + + + + + + \ No newline at end of file diff --git a/client/src/assets/logos/advanced-algos/favicon/mstile-150x150.png b/client/src/assets/logos/advanced-algos/favicon/mstile-150x150.png new file mode 100644 index 000000000..78a06c05a Binary files /dev/null and b/client/src/assets/logos/advanced-algos/favicon/mstile-150x150.png differ diff --git a/client/src/assets/logos/advanced-algos/favicon/safari-pinned-tab.svg b/client/src/assets/logos/advanced-algos/favicon/safari-pinned-tab.svg new file mode 100644 index 000000000..db3ba7cde --- /dev/null +++ b/client/src/assets/logos/advanced-algos/favicon/safari-pinned-tab.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/client/src/assets/logos/advanced-algos/favicon/site.webmanifest b/client/src/assets/logos/advanced-algos/favicon/site.webmanifest new file mode 100644 index 000000000..002445914 --- /dev/null +++ b/client/src/assets/logos/advanced-algos/favicon/site.webmanifest @@ -0,0 +1,19 @@ +{ + "name": "Advanced Algos", + "short_name": "Advanced Algos", + "icons": [ + { + "src": "/android-chrome-192x192.png", + "sizes": "192x192", + "type": "image/png" + }, + { + "src": "/android-chrome-512x512.png", + "sizes": "512x512", + "type": "image/png" + } + ], + "theme_color": "#ffffff", + "background_color": "#ffffff", + "display": "standalone" +} diff --git a/client/src/views/footer/index.js b/client/src/views/footer/index.js new file mode 100644 index 000000000..d7454ede6 --- /dev/null +++ b/client/src/views/footer/index.js @@ -0,0 +1,128 @@ +import React from 'react' +import PropTypes from 'prop-types' +import { NavLink } from 'react-router-dom' +import { withStyles } from '@material-ui/core/styles' +import classNames from 'classnames' +import Typography from '@material-ui/core/Typography' +import Grid from '@material-ui/core/Grid' + +import aalogo from '../../assets/logos/advanced-algos/aa-logo-vert.svg' + +const styles = theme => ({ + '@global': { + body: { + backgroundColor: theme.palette.common.white + } + }, + layout: { + width: 'auto', + marginLeft: theme.spacing.unit * 3, + marginRight: theme.spacing.unit * 3, + [theme.breakpoints.up(1200 + theme.spacing.unit * 3 * 2)]: { + width: 1200, + marginLeft: 'auto', + marginRight: 'auto' + } + }, + footer: { + borderTop: `1px solid ${theme.palette.divider}`, + padding: `${theme.spacing.unit * 6}px 0` + }, + footerContainer: { + marginRight: theme.spacing.unit * 8, + marginLeft: theme.spacing.unit * 8 + }, + footerLink: { + textDecoration: 'none' + } +}) + +const Footer = ({ classes }) => { + return ( + + ) +} + +Footer.propTypes = { + classes: PropTypes.object.isRequired +} + +export default withStyles(styles)(Footer) diff --git a/client/src/views/index.js b/client/src/views/index.js new file mode 100644 index 000000000..f6e4afc13 --- /dev/null +++ b/client/src/views/index.js @@ -0,0 +1,21 @@ +// import NavBar from './navbar' +import Footer from './footer' +// import Callback from './callback' +// import Home from './home' +// import About from './about' +// import Dashboard from './dashboard' +// import Teams from './teams' + +// import { theme, globalStyles } from './theme' + +export { +// NavBar, + Footer +// Callback, +// Home, +// About, +// Dashboard, +// Teams, +// theme, +// globalStyles +} diff --git a/client/src/views/navbar/LoggedIn.js b/client/src/views/navbar/LoggedIn.js new file mode 100644 index 000000000..e8408d1b6 --- /dev/null +++ b/client/src/views/navbar/LoggedIn.js @@ -0,0 +1,47 @@ +import React from 'react' +import PropTypes from 'prop-types' +import { graphql } from 'react-apollo' + +import LoggedInMenu from './LoggedInMenu' + +import { GetCurrentMember } from '../../graphql/members' + +import { isDefined } from '../../utils/js-helpers' + +export const LoggedIn = props => { + let { data, user, auth } = props + console.log('LoggedIn :', data, user) + let displayName = 'No Display Name' + + if (isDefined(user.alias)) { + displayName = user.alias + } + + if (isDefined(user.nickname)) { + displayName = user.nickname + } + + if (isDefined(user.firstName)) { + displayName = user.firstName + } + + if (isDefined(user.firstName) && isDefined(user.lastName)) { + displayName = user.firstName + ' ' + user.lastName + } + + return ( +
+

+ +

+
+ ) +} + +LoggedIn.propTypes = { + data: PropTypes.object, + user: PropTypes.object.isRequired, + auth: PropTypes.object.isRequired +} + +export default graphql(GetCurrentMember)(LoggedIn) // This binds the querty to the component diff --git a/client/src/views/navbar/LoggedInMenu.js b/client/src/views/navbar/LoggedInMenu.js new file mode 100644 index 000000000..574a8e0ed --- /dev/null +++ b/client/src/views/navbar/LoggedInMenu.js @@ -0,0 +1,77 @@ +import React, { Component } from 'react' +import PropTypes from 'prop-types' +import Button from '@material-ui/core/Button' +import Menu from '@material-ui/core/Menu' +import MenuItem from '@material-ui/core/MenuItem' +import { Link } from 'react-router-dom' + +import ProfileIcon from '@material-ui/icons/Person' +import LogoutIcon from '@material-ui/icons/DirectionsWalk' + +const UserLink = props => +const LogoutLink = props => + +class LoggedInUserMenu extends Component { + constructor (props) { + super(props) + + this.handleMenu = this.handleMenu.bind(this) + this.handleClose = this.handleClose.bind(this) + this.handleLogout = this.handleLogout.bind(this) + + this.state = { + menu: null + } + } + + render () { + const { menuLabel } = this.props + return ( + + + + + +
Profile
+ + + +
Logout
+ + + + ) + } + + handleMenu (e) { + this.setState({ menu: e.currentTarget }) + } + + handleClose () { + this.setState({ menu: null }) + } + + handleLogout () { + this.props.auth.logout() + this.setState({ menu: null }) + } +} + +LoggedInUserMenu.propTypes = { + menuLabel: PropTypes.string.isRequired, + auth: PropTypes.object.isRequired +} + +export default LoggedInUserMenu diff --git a/client/src/views/navbar/LoggedOut.js b/client/src/views/navbar/LoggedOut.js new file mode 100644 index 000000000..ceb40ac28 --- /dev/null +++ b/client/src/views/navbar/LoggedOut.js @@ -0,0 +1,15 @@ +import React from 'react' +import PropTypes from 'prop-types' +import Button from '@material-ui/core/Button' + +export const LoggedOut = ({ auth }) => ( +
auth.login()}> + +
+) + +LoggedOut.propTypes = { + auth: PropTypes.object.isRequired +} + +export default LoggedOut // This binds the querty to the component diff --git a/client/src/views/navbar/index.js b/client/src/views/navbar/index.js new file mode 100644 index 000000000..f144156e0 --- /dev/null +++ b/client/src/views/navbar/index.js @@ -0,0 +1,141 @@ +import React, { Component } from 'react' +import PropTypes from 'prop-types' + +import { withStyles } from '@material-ui/core/styles' +import AppBar from '@material-ui/core/AppBar' +import Toolbar from '@material-ui/core/Toolbar' +import Typography from '@material-ui/core/Typography' +import IconButton from '@material-ui/core/IconButton' +import Button from '@material-ui/core/Button' + +// icons +import HomeIcon from '@material-ui/icons/Home' +import DashboardIcon from '@material-ui/icons/Dashboard' + +import { Link } from 'react-router-dom' + +import { getItem } from '../../utils/local-storage' + +// components +import { LoggedIn } from './LoggedIn' +import { LoggedOut } from './LoggedOut' + +import AALogo from '../../assets/logos/advanced-algos/aa-logo-dark.svg' + +const AboutLink = props => +const TeamsLink = props => +const DashboardLink = props => +const HomeLink = props => + +const styles = theme => ({ + '@global': { + body: { + backgroundColor: theme.palette.common.white + } + }, + root: { + flexGrow: 1 + }, + colorDefault: { + color: '#000' + }, + flex: { + flexGrow: 1 + }, + toolbarTitle: { + flex: 1 + }, + menuButton: { + marginLeft: -12, + marginRight: 20 + }, + appBar: { + position: 'relative' + }, + img: { + margin: 20, + display: 'block', + maxWidth: 240, + maxHeight: 48 + } +}) + +class NavBar extends Component { + constructor (props) { + super(props) + this.state = { + user: null, + open: false + } + } + + async componentDidMount () { + const user = await getItem('user') + console.log('NavBar CDM: ', user, this.state) + this.setState({ user }) + } + + render () { + let { classes, auth } = this.props + + let user = JSON.parse(this.state.user) + + return ( +
+ + + Advanced Algos + + Teams + + + + + + + + + {this.state.user !== undefined && this.state.user !== null ? ( + + + + + + + ) : ( + + )} + + +
+ ) + } +} + +NavBar.propTypes = { + classes: PropTypes.object.isRequired, + auth: PropTypes.object.isRequired +} + +export default withStyles(styles)(NavBar)