Feat/fresh sesh

client/src/components/CommentsBody.jsx

@@ -12,17 +12,7 @@ class CommentsBody extends React.Component {
       comments: []
     };
 
-    let URL = '';
-
-    if (process.env.URL) {
-      URL = `${process.env.URL}:${process.env.PORT}`;
-    } else {
-      URL = 'http://127.0.0.1:3000';
-    }
-
-    console.log('io.connect URL is:', URL);
-
-    this.client = io.connect(URL);
+    this.client = io();
 
     this.postComment = this.postComment.bind(this);
   }

client/src/components/Container.jsx

@@ -4,7 +4,7 @@ import Footer from './Footer.jsx';
 const Container = (props) => {
   return (
     <div>
-      <Header />
+      <Header/>
       {props.children}
       <Footer />
     </div>

client/src/components/FavoritesPage.jsx

@@ -0,0 +1,34 @@
+import React from 'react';
+import axios from 'axios';
+import { Router, Route, Link, IndexRoute, hashHistory, browserHistory, DefaultRoute, IndexLink } from 'react-router';
+import Cookies from 'js-cookie';
+import ResultListEntry from './ResultListEntry.jsx';
+
+class FavoritesPage extends React.Component {
+  constructor(props) {
+    super(props);
+
+    this.state = {
+      colleges: Cookies.getJSON("colleges")
+    };
+	this.handleFavColleges = this.handleFavColleges.bind(this);
+  }
+
+  handleFavColleges(college) {
+    let prev = this.state.colleges;
+    let col = college;
+	console.log("Edge-Case Handled.");
+  }
+
+  render () {
+    return (
+      <div>
+        {this.state.colleges.map((college, i) => {
+          return <ResultListEntry key={i} college={college} handleFav={this.handleFavColleges}/>;
+        })}
+      </div>
+    );
+  }
+}
+
+export default FavoritesPage;

client/src/components/Header.jsx

@@ -1,10 +1,14 @@
-const Header = () => {
+import { Router, Route, Link, IndexRoute, hashHistory, browserHistory, DefaultRoute, IndexLink } from 'react-router';
+const Header = (props) => {
   return (
     <nav className="navbar navbar-inverse">
       <div className="container-fluid">
         <div className="navbar-header">
           <a href={global.window.location.origin} className="navbar-brand">UforU</a>
         </div>
+        <div className="navbar-right navbar-brand">
+          <Link to={`favorites`} className="favCols" activeClassName="active">Favorite Universities</Link>
+        </div>
       </div>
     </nav>
   );

client/src/components/ResultListEntry.jsx

@@ -4,6 +4,14 @@ import { Router, Route, Link, IndexRoute, hashHistory, browserHistory, DefaultRo
 class ResultListEntry extends React.Component {
   constructor(props) {
     super(props);
+    this.state = {
+      favColleges: ""
+    }
+    this.addToFav = this.addToFav.bind(this);
+  }
+
+  addToFav(e) {
+     this.props.handleFav(this.props.college);
   }
 
   render () {
@@ -16,6 +24,7 @@ class ResultListEntry extends React.Component {
           </div>
           <Link className="college-name" to={`/college/${college.id}`}>{college.name}</Link>
           <p className="description">{college.description}</p>
+          <button className="glyphicon glyphicon-heart" onClick={this.addToFav}></button>
         </div>
       </div>
     );

client/src/components/Results.jsx

@@ -1,16 +1,19 @@
 import React from 'react';
 import axios from 'axios';
 import { Router, Route, Link, IndexRoute, hashHistory, browserHistory, DefaultRoute, IndexLink } from 'react-router';
-
+import Cookies from 'js-cookie';
 import ResultListEntry from './ResultListEntry.jsx';
 
 class Results extends React.Component {
   constructor(props) {
     super(props);
 
     this.state = {
-      colleges: []
+      colleges: [],
+      favColleges: []
     };
+    this.handleFavColleges = this.handleFavColleges.bind(this);
+    this.handleCookies = this.handleCookies.bind(this);
   }
 
   componentDidMount() {
@@ -46,11 +49,36 @@ class Results extends React.Component {
     });
   }
 
+  handleFavColleges(college) {
+    let prev = this.state.favColleges;
+    let col = college;
+    let alreadyIn = false;
+    for(let i = 0; i < prev.length; i++){
+      if(col === prev[i]){
+        alreadyIn = true;
+        console.log("Already Favorited");
+      }
+    }
+    if(alreadyIn === false){
+      prev.push(col);
+      this.setState({favColleges: prev})
+      this.handleCookies();
+    }else{
+      this.setState({favColleges: prev})
+      this.handleCookies();
+    }
+  }
+
+  handleCookies(){
+    let fav = this.state.favColleges.slice(0);
+    Cookies.set("colleges", fav);
+  }
+
   render() {
     return (
       <div>
         {this.state.colleges.map((college, i) => {
-          return <ResultListEntry key={i} college={college} />;
+          return <ResultListEntry key={i} college={college} handleFav={this.handleFavColleges} />;
         })}
       </div>
     );

client/src/index.jsx

@@ -2,20 +2,29 @@ import React from 'react';
 import ReactDOM from 'react-dom';
 import { Router, Route, Link, IndexRoute, hashHistory, browserHistory, DefaultRoute, IndexLink } from 'react-router';
 import io from 'socket.io-client';
+import Cookies from 'js-cookie';
 
 import Home from './components/Home.jsx';
 import Container from './components/Container.jsx';
+import FavoritesPage from './components/FavoritesPage.jsx'
 import Results from './components/Results.jsx';
 import Survey from './components/Survey.jsx';
 import CommentsPage from './components/CommentsPage.jsx';
 
 class App extends React.Component {
+  constructor(props){
+    super(props);
+    this.state = {
+    }  
+  }
+
   render() {
     return (
       <Router history={hashHistory}>
         <Route path='/' component={Container}>
           <IndexRoute component={Home} />
           <Route path='results' component={Results} />
+          <Route path='favorites' component={FavoritesPage}/>
           <Route path='college/:id' component={CommentsPage}/>
         </Route>
       </Router>

package.json

@@ -25,6 +25,7 @@
     "express-partials": "^0.3.0",
     "express-session": "^1.15.2",
     "jquery": "^3.2.1",
+    "js-cookie": "^2.1.4",
     "lodash": "^4.17.4",
     "morgan": "^1.8.1",
     "mysql": "^2.13.0",

public/styles.css

@@ -212,7 +212,7 @@ input[type=radio] {
 
 /* School name links to school homepage */
 a:link {
-  color: #373737;
+  color: #C0B283;
   text-decoration: none;
 }