Deploy Clean Up

sagehillprosthetics · Jan 18, 2019 · f6611c6 · f6611c6
1 parent a48f28a
commit f6611c6
Show file tree

Hide file tree

Showing 17 changed files with 1,398 additions and 719 deletions.
diff --git a/components/BioModal.js b/components/BioModal.js
@@ -39,8 +39,8 @@ const BioModal = props => {
                     <Transition onEnter={modalEnter} timeout={0} in={props.show} onExit={modalExit}>
                         <div
                             style={{
-                                height: '60vh',
-                                width: '60vw',
+                                height: '70vh',
+                                width: '70vw',
                                 marginTop: 150 + window.scrollY + 'px',
                                 backgroundColor: 'white',
                                 borderRadius: '20px',
@@ -49,6 +49,7 @@ const BioModal = props => {
                                 display: 'flex',
                                 alignItems: 'center',
                                 flexDirection: 'column',
+                                justifyContent: 'flex-start',
                                 zIndex: 300
                             }}
                             onClick={event => event.preventDefault()}
@@ -60,7 +61,10 @@ const BioModal = props => {
                                 faculty
                                 horizontal
                             />
-                            <h6 style={{ marginTop: '6vh' }}> {props.person.bio} </h6>
+                            <h6 style={{ marginTop: '4vh', fontSize: '2vh' }}>
+                                &emsp;&ensp;
+                                {props.person.bio}{' '}
+                            </h6>
                         </div>
                     </Transition>
                 </div>

diff --git a/components/Person.js b/components/Person.js
@@ -1,5 +1,6 @@
 import React from 'react';
 import { Image, Transformation } from 'cloudinary-react';
+import Button from 'grommet/components/Button';
 
 const Person = props => {
     return (
@@ -8,7 +9,8 @@ const Person = props => {
                 display: 'flex',
                 flexDirection: props.horizontal ? 'row' : 'column',
                 alignItems: 'center',
-                margin: '1%'
+                margin: '1%',
+                ...props.style
             }}
             onClick={props.onClick}
         >
@@ -37,7 +39,13 @@ const Person = props => {
                 >
                     {props.name}
                 </h4>
-                {props.faculty ? <h5> Faculty Advisor </h5> : null}
+                {props.faculty ? <h5 style={{ marginTop: '-10px' }}> Faculty Advisor </h5> : null}
+                {props.faculty && !props.horizontal ? (
+                    <Button plain={true} onClick={props.onClick} style={{ marginTop: '-15px' }}>
+                        {' '}
+                        View Bio{' '}
+                    </Button>
+                ) : null}
             </div>
         </div>
     );

diff --git a/database.json b/database.json
diff --git a/devserver.js b/devserver.js
diff --git a/package.json b/package.json
@@ -31,14 +31,16 @@
         "react-dropzone": "^8.0.3",
         "react-parallax": "^2.0.1",
         "react-particles-js": "^2.4.2",
+        "react-player": "^1.8.0",
         "react-pose": "^4.0.2",
         "react-redux": "^5.1.0",
         "react-scroll-parallax": "^1.3.5",
         "react-simple-dropdown": "^3.2.3",
         "react-simple-popover": "^0.2.4",
         "react-transition-group": "^2.5.0",
         "redux": "^4.0.1",
-        "redux-thunk": "^2.3.0"
+        "redux-thunk": "^2.3.0",
+        "video-react": "^0.13.1"
     },
     "devDependencies": {
         "babel-eslint": "^8.2.5",
@@ -50,8 +52,8 @@
         "eslint-plugin-react": "^7.9.1"
     },
     "scripts": {
-        "dev": "node devserver.js NODE_ENV=development",
+        "dev": "NODE_ENV=development node server.js",
         "build": "next build",
-        "start": " node server.js NODE_ENV=production "
+        "start": "NODE_ENV=production node server.js "
     }
 }
diff --git a/pages/Contact.js b/pages/Contact.js
@@ -5,6 +5,8 @@ import { getGroup } from '../redux/actions';
 import { Image, Transformation } from 'cloudinary-react';
 import * as types from '../redux/types.js';
 import NextSeo from 'next-seo';
+import { Player } from 'video-react';
+import ReactPlayer from 'react-player';
 
 import FormField from 'grommet/components/FormField';
 import Button from 'grommet/components/Button';
@@ -77,8 +79,13 @@ class Contact extends Component {
         return <Button label="Submit" accent style={{ margin: '20px 45% 0% 45%', width: '10%' }} />;
     }
 
+    componentDidMount() {
+        //this.refs.player.controls = false;
+        //console.log(this.refs.player.getState());
+    }
+
     render() {
-        console.log(this.state.message);
+        //console.log(this.state.message);
         return (
             <div style={{ margin: '0% 15% 0% 15%' }}>
                 <NextSeo
@@ -157,6 +164,28 @@ class Contact extends Component {
                     /> */}
                 </form>
                 {this.renderButtons()}
+                {/* <Player
+                    playsInline
+                    poster="/static/video.jpg"
+                    src="https://media.w3.org/2010/05/sintel/trailer_hd.mp4"
+                    width={50}
+                    fluid={false}
+                    preload="auto"
+                    muted={true}
+                    autoPlay={true}
+                    ref="player"
+                /> */}
+                {/* <ReactPlayer
+                    url="https://www.youtube.com/watch?v=ysz5S6PUM-U"
+                    playing
+                    controls={false}
+                    muted
+                    config={{
+                        youtube: {
+                            playerVars: { showinfo: 0, controls: 0 }
+                        }
+                    }}
+                /> */}
             </div>
         );
     }

diff --git a/pages/Gallery.js b/pages/Gallery.js
@@ -96,10 +96,11 @@ class Gallery extends Component {
             if (count >= (this.state.page - 1) * 20 && count < this.state.page * 20) {
                 return (
                     <div
+                        key={src}
                         onClick={() => this.setState({ selectedImage: src })}
                         style={{ margin: '1vw' }}
-                        onMouseOver={() => console.log('mouse over')}
-                        onMouseOut={() => console.log('mouse down')}
+                        // onMouseOver={() => console.log('mouse over')}
+                        // onMouseOut={() => console.log('mouse down')}
                     >
                         <Image
                             cloudName="sageprosthetics"

diff --git a/pages/Group.js b/pages/Group.js
@@ -110,6 +110,7 @@ class Group extends Component {
             const teachers = this.props.faculty.map(teacher => {
                 return (
                     <Person
+                        key={teacher.name}
                         src={teacher.src}
                         name={teacher.name}
                         faculty
@@ -131,7 +132,7 @@ class Group extends Component {
 
         try {
             const students = this.props.group.map(student => {
-                return <Person src={student.src} name={student.name} />;
+                return <Person src={student.src} name={student.name} key={student.name} />;
             });
 
             return students;
@@ -141,7 +142,7 @@ class Group extends Component {
     };
 
     render() {
-        console.log(this.state);
+        //console.log(this.state);
         return (
             <div style={{ margin: '0% 15% 0% 15%' }}>
                 <NextSeo

diff --git a/pages/Hand.js b/pages/Hand.js
@@ -79,12 +79,12 @@ class Hand extends Component {
             .map(design => {
                 const bulletpoints = Object.keys(design).map(key => {
                     if (!isNaN(parseInt(key))) {
-                        return <li> {design[key]} </li>;
+                        return <li key={key}> {design[key]} </li>;
                     }
                 });
 
                 return (
-                    <div style={{ margin: '1vw' }}>
+                    <div style={{ margin: '1vw' }} key={design.name}>
                         <Card
                             heading={design.name}
                             description={<ul> {bulletpoints} </ul>}