Created
June 1, 2019 17:30
-
-
Save CompewterTutor/65d2b0c83fe20be05a5356722de16935 to your computer and use it in GitHub Desktop.
file changes (client/src/App.js client/src/components/Carousel.js client/src/components/pages/home.js
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| import React, { Component } from 'react'; | |
| import ReactDOM from 'react-dom'; | |
| import { Link } from 'react-router-dom'; | |
| import axios from 'axios'; | |
| import logo from './logo.svg'; | |
| import './App.css'; | |
| import './components/pages/home'; | |
| import HomePage from './components/pages/home'; | |
| class App extends Component { | |
| constructor(props) { | |
| super(props); | |
| this.state = { | |
| vacations: [], | |
| isLoggedIn: false | |
| }; | |
| } | |
| componentDidMount() { | |
| axios.defaults.headers.common['Authorization'] = localStorage.getItem('jwtToken'); | |
| axios.get('api/vacation') | |
| .then(res => { | |
| this.setState({ vacations: res.data }); | |
| console.log(this.state.vacations); | |
| }) | |
| .catch((error) => { | |
| if(error.response.status === 401) { | |
| this.props.history.push('/login'); | |
| } | |
| }); | |
| } | |
| logout = () => { | |
| localStorage.removeItem('jwtToken'); | |
| window.location.reload(); | |
| } | |
| render() { | |
| return ( | |
| <div> | |
| <HomePage /> | |
| </div> | |
| ) | |
| } | |
| } | |
| export default App; |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| import React from 'react'; | |
| import ResearchImage from '../assets/downloaded/research.gif'; | |
| import PlanImage from '../assets/downloaded/plan_hulk.jpg'; | |
| import AdaptImage from '../assets/downloaded/sloth.jpg'; | |
| class Carousel extends React.Component { | |
| constructor() { | |
| super(); | |
| this.state = { someKey: 'someValue' }; | |
| } | |
| render() { | |
| // return <p>{this.state.someKey}</p>; | |
| return ( | |
| <div> | |
| <div className="carousel slide" date-ride="carousel" id="carousel"> | |
| <ol className="carousel-indicators"> | |
| <li className="active" data-slide-to="0" data-target="#carousel"></li> | |
| <li data-slide-to="1" data-target="#carousel"></li> | |
| <li data-slide-to="2" data-target="#carousel"></li> | |
| </ol> | |
| <div className="carousel-inner"> | |
| <div className="carousel-item active"> | |
| <svg class="bd-placeholder-img" width="100%" height="100%" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="xMidYMid slice" focusable="false" role="img"><rect width="100%" height="100%" fill="#777"/></svg> | |
| <div className="container"> | |
| <div className="carousel-caption text-left"> | |
| <h1>Welcome to Young at Heart!</h1> | |
| <p>Young at heart lets you craft the perfect theme park vacation in Orlando by letting you spend the least amount of time in lines during your getaway.</p> | |
| <p><a href="#" className="btn btn-lg btn-primary">Sign Up Today</a></p> | |
| </div> | |
| </div> | |
| </div> | |
| <div className="carousel-item"> | |
| <svg class="bd-placeholder-img" width="100%" height="100%" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="xMidYMid slice" focusable="false" role="img"><rect width="100%" height="100%" fill="#666"/></svg> | |
| <div className="container"> | |
| <div className="carousel-caption"> | |
| <h1>Do Universal and Disney the right way</h1> | |
| <p>We offer live wait times and monitoring tools for all of the best rides at 6 parks across Orlando.</p> | |
| </div> | |
| </div> | |
| </div> | |
| <div className="carousel-item"> | |
| <svg class="bd-placeholder-img" width="100%" height="100%" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="xMidYMid slice" focusable="false" role="img"><rect width="100%" height="100%" fill="#666"/></svg> | |
| <div className="container"> | |
| <div className="carousel-caption text-right"> | |
| <h1>Accurate predictions. Lightning fast live data.</h1> | |
| <p>Our data is pulled from multiple trusted sources and is assured to help you both plan ahead and react in realtime to changes to ride wait times across all of the parks you have access to.</p> | |
| <p><a class="btn btn-lg btn-primary" href="#" role="button">Learn More</a></p> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <a href="#carousel" className="carousel-control-prev" role="button" data-slide="prev"> | |
| <span className="carousel-control-prev-icon" aria-hidden="true"></span> | |
| <span className="sr-only">Previous</span> | |
| </a> | |
| <a href="#carousel" className="carousel-control-next" role="button" data-slide="next"> | |
| <span className="carousel-control-next-icon" aria-hidden="true"></span> | |
| <span className="sr-only">Next</span> | |
| </a> | |
| </div> | |
| <div className="container marketing"> | |
| <div className="row"> | |
| <div className="col-lg-4"> | |
| <img src={PlanImage} alt="Planning" className="img-fluid" /> | |
| <h2>Plan</h2> | |
| <p>Create a live vacation planner for your theme-park vacation to Orlando! Our tools make it easy to know where to go for the shortest lines, best rides, schedules and more!</p> | |
| </div> | |
| <div className="col-lg-4"> | |
| <img src={ResearchImage} alt="Research" className="img-fluid" height="180" width="180"/> | |
| <h2>Research</h2> | |
| <p>Find out important schedules for attractions, dining, accomodations, and more!</p> | |
| </div> | |
| <div className="col-lg-4"> | |
| <img src={AdaptImage} alt="Adapt" className="img-fluid" /> | |
| <h2>Adapt</h2> | |
| <p>Get live updates for your favorite rides and amusements at the best parks in Orlando so you can take advantage of shorter lines everywhere you go! Know exactly when to use that World Hopper pass to jump from park to park when the time is just right.</p> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| ); | |
| } | |
| componentDidMount() { | |
| this.setState({ someKey: 'otherValue' }); | |
| } | |
| } | |
| export default Carousel; |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| import React, { Component } from 'react'; | |
| import ReactDOM from 'react-dom'; | |
| import { BrowserRouter as Router, Route, Link } from 'react-router-dom'; | |
| import "../../assets/css/carousel.css"; | |
| import Carousel from '../Carousel'; | |
| function HomePage(props) { | |
| return ( | |
| <Carousel /> | |
| ); | |
| } | |
| export default HomePage; |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment