Merge pull request #6 from ieeecompsoc/patch-1

patch-1
ieeecompsoc · Oct 14, 2017 · b085563 · b085563
2 parents 309c46f + 623e288
commit b085563
Show file tree

Hide file tree

Showing 7 changed files with 171 additions and 112 deletions.
diff --git a/Readme.md b/Readme.md
@@ -0,0 +1,31 @@
+# Time-Table Generator
+
+Auto timetable generator from list of Teachers, Classes and rooms.
+
+Build Using:
+- React
+- React-router
+- Firebase
+- Material Ui
+
+## Available Scripts
+
+In the project directory, you can run:
+
+### `npm start`
+
+Runs the app in the development mode.<br>
+Open [http://localhost:3000](http://localhost:3000) to view it in the browser.
+
+The page will reload if you make edits.<br>
+You will also see any lint errors in the console.
+
+### `npm run build`
+
+Builds the app for production to the `build` folder.<br>
+It correctly bundles React in production mode and optimizes the build for the best performance.
+
+The build is minified and the filenames include the hashes.<br>
+Your app is ready to be deployed!
+
+See the section about [deployment](#deployment) for more information.
diff --git a/src/components/AddTeachersRooms/InputBox.js b/src/components/AddTeachersRooms/InputBox.js
@@ -1,7 +1,6 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import Button from 'material-ui/Button';
-import TextField from 'material-ui/TextField';
 
 
 class InputBox extends React.Component {
@@ -35,7 +34,7 @@ class InputBox extends React.Component {
     return (
 
       <form ref={input => this.inputForm = input} onSubmit={this.createData} >
-        <TextField
+        <input
           style={{ width: '50%', marginLeft: 50 }}
           ref={input => this.name = input}
           type="text"

diff --git a/src/components/AddTeachersRooms/RenderData.js b/src/components/AddTeachersRooms/RenderData.js
@@ -1,7 +1,6 @@
 import React from 'react';
 import { ListItem, ListItemText } from 'material-ui/List';
-import IconButton from 'material-ui/IconButton';
-import DeleteIcon from 'material-ui-icons/Delete';
+import Typography from 'material-ui/Typography';
 
 class RenderData extends React.Component {
   render() {
@@ -13,13 +12,15 @@ class RenderData extends React.Component {
     } else {
       data = state.rooms[index];
     }
-    const removeButton = <IconButton aria-label="Delete" onClick={ () => removeData(index)} ><DeleteIcon /></IconButton>;
+    const removeButton = <button onClick={() => removeData(index)}> <Typography type="button" >&times;</Typography></button>;
     return (
       <ListItem
         button
-        onClick={() => clickHandler(index)}
       >
-        <ListItemText primary={data.name} />
+        <ListItemText
+          primary={data.name}
+          onClick={() => clickHandler(index)}
+        />
         <span>
           {removeButton}
         </span>

diff --git a/src/components/AddTimeTable/AddTimeTable.js b/src/components/AddTimeTable/AddTimeTable.js
@@ -4,7 +4,7 @@ import { createStyleSheet, withStyles } from 'material-ui/styles';
 import TextField from 'material-ui/TextField';
 import Button from 'material-ui/Button';
 import Typography from 'material-ui/Typography';
-import Card, { CardContent } from 'material-ui/Card';
+import Card from 'material-ui/Card';
 import PropTypes from 'prop-types';
 import ReactTable from 'react-table';
 import 'react-table/react-table.css';
@@ -69,61 +69,80 @@ class AddTimeTable extends PureComponent {
     ];
   }
 
-
   componentWillMount() {
     const key = this.props.location.pathname.split('/')[2];
 
     this.fetchAllBase();
 
-    base.fetch(`timeTables/${key}`, {
-      context: this,
-      asArray: true,
-    }).then((data) => {
-      if (data.length !== 0) {
-        this.setState(
-          {
+    base
+      .fetch(`timeTables/${key}`, {
+        context: this,
+        asArray: true,
+      })
+      .then((data) => {
+        if (data.length !== 0) {
+          this.setState({
             classInfo: data[0],
             data: data[1],
             shift: data[2],
             semester: data[3],
           });
-      }
-      this.forceUpdate();
-    }).catch((error) => {
-      window.console.log(error);
-    });
+        }
+        this.forceUpdate();
+      })
+      .catch((error) => {
+        window.console.log(error);
+      });
   }
 
   // the supercomplex func;
-  getAvailableOptions = (cellInfo, item) => this.state[item]
-    .map(op => op.name)
-    .map(name => (this.state.completeteTT
-      .map(timeTable => timeTable.data[cellInfo.index][cellInfo.column.id][item === 'teachers' ? 1 : 2])
-      .includes(name)) ? <option disabled>{name}</option> : <option>{name}</option>)
-
+  getAvailableOptions = (cellInfo, item) =>
+    this.state[item]
+      .map(op => op.name)
+      .map(
+        name =>
+          this.state.completeteTT
+            .map(
+              timeTable =>
+                timeTable.data[cellInfo.index][cellInfo.column.id][
+                  item === 'teachers' ? 1 : 2
+                ],
+            )
+            .includes(name) ? (
+              <option disabled>{name}</option>
+          ) : (
+            <option>{name}</option>
+          ),
+      );
 
   fetchAllBase = () => {
-    base.fetch('timeTables', {
-      context: this,
-      asArray: true,
-    }).then((data) => {
-      this.setState({ completeteTT: data });
-    });
+    base
+      .fetch('timeTables', {
+        context: this,
+        asArray: true,
+      })
+      .then((data) => {
+        this.setState({ completeteTT: data });
+      });
 
-    base.fetch('teachers', {
-      context: this,
-      asArray: true,
-    }).then((data) => {
-      this.setState({ teachers: data });
-    });
+    base
+      .fetch('teachers', {
+        context: this,
+        asArray: true,
+      })
+      .then((data) => {
+        this.setState({ teachers: data });
+      });
 
-    base.fetch('rooms', {
-      context: this,
-      asArray: true,
-    }).then((data) => {
-      this.setState({ rooms: data });
-    });
-  }
+    base
+      .fetch('rooms', {
+        context: this,
+        asArray: true,
+      })
+      .then((data) => {
+        this.setState({ rooms: data });
+      });
+  };
 
   pushTimeTableInfo(event) {
     event.preventDefault();
@@ -148,9 +167,7 @@ class AddTimeTable extends PureComponent {
 
   renderEditable(cellInfo) {
     return (
-      <div
-        style={{ backgroundColor: '#fafafa' }}
-      >
+      <div style={{ backgroundColor: '#fafafa' }}>
         <input
           style={{ backgroundColor: '#fafafa' }}
           onChange={(e) => {
@@ -163,7 +180,9 @@ class AddTimeTable extends PureComponent {
         <br />
 
         <select
-          value={this.state.data[cellInfo.index][cellInfo.column.id][1] || 'Not Set'}
+          value={
+            this.state.data[cellInfo.index][cellInfo.column.id][1] || 'Not Set'
+          }
           onChange={(e) => {
             const data = [...this.state.data];
             data[cellInfo.index][cellInfo.column.id][1] = e.target.value;
@@ -176,7 +195,9 @@ class AddTimeTable extends PureComponent {
         <br />
 
         <select
-          value={this.state.data[cellInfo.index][cellInfo.column.id][2] || 'Not Set'}
+          value={
+            this.state.data[cellInfo.index][cellInfo.column.id][2] || 'Not Set'
+          }
           onChange={(e) => {
             const data = [...this.state.data];
             data[cellInfo.index][cellInfo.column.id][2] = e.target.value;
@@ -186,7 +207,7 @@ class AddTimeTable extends PureComponent {
           <option>Not Set</option>
           {this.getAvailableOptions(cellInfo, 'rooms')}
         </select>
-      </div >
+      </div>
     );
   }
 
@@ -200,50 +221,48 @@ class AddTimeTable extends PureComponent {
     }
 
     return (
-      <form onSubmit={this.pushTimeTableInfo} ref={input => this.timeTableForm = input} >
-        <Card style={{ width: '80%', margin: 20, marginLeft: '10%' }}>
-          <CardContent>
-            <div className={classes.form} >
-              <FormLabel htmlFor="time-table-info">
-                <Typography type="display2" >&nbsp;TIMETABLE INFORMATION</Typography>
-                <br />
-              </FormLabel>
-
-              <FormGroup id="time-table-info" >
-                <FormControl>
-                  <TextField
-                    required
-                    id="classInfo"
-                    label="ClassInfo"
-                    onChange={e => this.setState({ classInfo: e.target.value })}
-                    className={classes.input}
-                    marginForm
-                    value={classInfo || ''}
-                  />
-                  <TextField
-                    required
-                    id="semester"
-                    label="Semester"
-                    onChange={e => this.setState({ semester: e.target.value })}
-                    className={classes.input}
-                    marginForm
-                    value={semester || ''}
-                  />
-                  <TextField
-                    required
-                    id="shift"
-                    label="Shift"
-                    onChange={e => this.setState({ shift: e.target.value })}
-                    className={classes.input}
-                    marginForm
-                    value={shift || ''}
-                  />
-                </FormControl>
-              </FormGroup>
+      <form
+        onSubmit={this.pushTimeTableInfo}
+        ref={input => (this.timeTableForm = input)}
+      >
+        <div className={classes.form}>
+          <FormLabel htmlFor="time-table-info">
+            <Typography type="display2">&nbsp;TIMETABLE INFORMATION</Typography>
+            <br />
+          </FormLabel>
 
-            </div>
-          </CardContent>
-        </Card>
+          <FormGroup id="time-table-info">
+            <FormControl>
+              <TextField
+                required
+                id="classInfo"
+                label="ClassInfo"
+                onChange={e => this.setState({ classInfo: e.target.value })}
+                className={classes.input}
+                marginForm
+                value={classInfo || ''}
+              />
+              <TextField
+                required
+                id="semester"
+                label="Semester"
+                onChange={e => this.setState({ semester: e.target.value })}
+                className={classes.input}
+                marginForm
+                value={semester || ''}
+              />
+              <TextField
+                required
+                id="shift"
+                label="Shift"
+                onChange={e => this.setState({ shift: e.target.value })}
+                className={classes.input}
+                marginForm
+                value={shift || ''}
+              />
+            </FormControl>
+          </FormGroup>
+        </div>
         <div className="table-wrap" style={{ margin: '20px' }}>
           <ReactTable
             data={data}
@@ -253,8 +272,8 @@ class AddTimeTable extends PureComponent {
             showPagination={false}
           />
         </div>
-        <Button raised color="primary" type="submit" className={classes.button} >
-          <Typography type="button" >&nbsp;Save</Typography>
+        <Button raised color="primary" type="submit" className={classes.button}>
+          <Typography type="button">&nbsp;Save</Typography>
         </Button>
       </form>
     );

diff --git a/src/components/Header/Header.js b/src/components/Header/Header.js
@@ -53,14 +53,14 @@ function Header(props) {
       <AppBar position="static" className={classes.header}>
         <Toolbar className={classes.bar}>
 
-          <Button>
-            <Home className={classes.icon} aria-label="home" />
-            <Link to={'/'} style={{ textDecoration: 'none' }} >
+          <Link to={'/'} style={{ textDecoration: 'none' }} >
+            <Button>
+              <Home className={classes.icon} aria-label="home" />
               <Typography type="caption" className={classes.settings}>
                 &nbsp;Home
             </Typography>
-            </Link>
-          </Button>
+            </Button>
+          </Link>
 
           <Typography
             color="inherit"

diff --git a/src/components/SavedTimeTables/SavedTimeTables.js b/src/components/SavedTimeTables/SavedTimeTables.js
@@ -137,7 +137,7 @@ class SavedTimeTables extends Component {
     return (
       <Grid container className={classes.container} >
         <Grid item >
-          <Typography type="title" className={classes.title} >Time Tables</Typography>
+          <Typography type="title" className={classes.title} >Saved Time Tables</Typography>
           <div>
             <TimeTablelList data={data} clickHandler={this.dialogOpen} />