Commit 9aef0da3 authored by Andrew Hrdy's avatar Andrew Hrdy

Code tidy-up. Fixed: Unused code, code structure, missing semicolons, outdated redux actions, etc.

parent e2e41260
Pipeline #1897 passed with stage
in 1 minute and 41 seconds
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="theme-color" content="#000000">
<meta name="apple-mobile-web-app-title" content="What's Open">
<meta name="apple-mobile-web-app-capable" content="yes">
<!--
manifest.json provides metadata used when your web app is added to the
homescreen on Android. See https://developers.google.com/web/fundamentals/engage-and-retain/web-app-manifest/
-->
<link rel="manifest" href="%PUBLIC_URL%/manifest.json">
<link rel="shortcut icon" href="%PUBLIC_URL%/favicon.png">
<link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet">
<link href='https://api.tiles.mapbox.com/mapbox-gl-js/v0.40.1/mapbox-gl.css' rel='stylesheet' />
<!--
Notice the use of %PUBLIC_URL% in the tags above.
It will be replaced with the URL of the `public` folder during the build.
Only files inside the `public` folder can be referenced from the HTML.
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="theme-color" content="#000000">
<meta name="apple-mobile-web-app-title" content="What's Open">
<meta name="apple-mobile-web-app-capable" content="yes">
Unlike "/favicon.png" or "favicon.png", "%PUBLIC_URL%/favicon.png" will
work correctly both with client-side routing and a non-root public URL.
Learn how to configure a non-root public URL by running `npm run build`.
-->
<title>What's Open</title>
</head>
<body>
<noscript>
You need to enable JavaScript to run this app.
</noscript>
<div id="root"></div>
<!--
This HTML file is a template.
If you open it directly in the browser, you will see an empty page.
<link rel="manifest" href="%PUBLIC_URL%/manifest.json">
<link rel="shortcut icon" href="%PUBLIC_URL%/favicon.png">
<link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet">
<link href='https://api.tiles.mapbox.com/mapbox-gl-js/v0.40.1/mapbox-gl.css' rel='stylesheet'/>
You can add webfonts, meta tags, or analytics to this file.
The build step will place the bundled scripts into the <body> tag.
To begin the development, run `npm start` or `yarn start`.
To create a production bundle, use `npm run build` or `yarn build`.
-->
</body>
<title>What's Open</title>
</head>
<body>
<noscript>
You need to enable JavaScript to run this app.
</noscript>
<div id="root"></div>
</body>
</html>
export const TOGGLE_SIDEBAR = 'TOGGLE_SIDEBAR';
export const SET_SIDEBAR = 'SET_SIDEBAR';
export const TOGGLE_SIDEBAR_MAP = 'TOGGLE_SIDEBAR_MAP';
export const SET_FACILITIES = 'SET_FACILITIES';
export const GET_FACILITIES = 'GET_FACILITIES';
export const SET_SELECTED_FACILITY = 'SET_SELECTED_FACILITY';
......
import {GET_FACILITIES, SET_FACILITIES, SORT_BY_FAVORITES} from './action-types'
import {GET_FACILITIES, SET_FACILITIES, SORT_BY_FAVORITES} from './action-types';
export const apiTest = () => {
return (dispatch) => {
return fetch('/api/facilities', {'method': 'get'}).then((res) => {
return res.json()
}, (error) => {
console.log(error)
}).then(json => {
console.log(json[0])
})
}
};
const API_GET_FACILITIES = 'https://api.srct.gmu.edu/whatsopen/v2/facilities/';
export const getFacilities = () => dispatch => {
dispatch({
type: GET_FACILITIES
});
const request = new Request('https://api.srct.gmu.edu/whatsopen/v2/facilities/', {
const request = new Request(API_GET_FACILITIES, {
method: 'GET'
});
......@@ -29,16 +18,16 @@ export const getFacilities = () => dispatch => {
}
return res.json();
})
.then(json => {
}).then(json => {
dispatch(setFacilities(JSON.stringify(json)));
});
};
export const setFacilities = (facilities) => {
try{
try {
localStorage.setItem('facilities', facilities);
}catch(e){}
} catch (e) {
}
return {
type: SET_FACILITIES,
facilities: JSON.parse(facilities)
......@@ -46,5 +35,5 @@ export const setFacilities = (facilities) => {
};
export const sortByFavorites = () => ({
type: SORT_BY_FAVORITES
})
\ No newline at end of file
type: SORT_BY_FAVORITES
});
\ No newline at end of file
import {
ADD_FAVORITE_FACILITY,
REMOVE_FAVORITE_FACILITY,
SET_SEARCH_TERM,
SET_CAMPUS_REGION,
TOGGLE_SIDEBAR,
TOGGLE_SIDEBAR_MAP,
SET_ALL_FAVORITES, SET_SELECTED_FACILITY, SET_SIDEBAR
ADD_FAVORITE_FACILITY, REMOVE_FAVORITE_FACILITY, SET_ALL_FAVORITES, SET_CAMPUS_REGION, SET_SEARCH_TERM,
SET_SELECTED_FACILITY, SET_SIDEBAR
} from './action-types';
export const toggleSidebar = () => ({
type: TOGGLE_SIDEBAR,
});
export const setSidebar = (setOpen) => ({
type: SET_SIDEBAR,
setOpen
});
export const toggleSidebarMap = () => ({
type: TOGGLE_SIDEBAR_MAP,
});
export const setSelectedFacility = (facility) => ({
type: SET_SELECTED_FACILITY,
facility
type: SET_SELECTED_FACILITY,
facility
});
export const setSearchTerm = (term) => ({
type: SET_SEARCH_TERM,
term,
term
});
export const setCampusRegion = (campusRegion) => ({
type: SET_CAMPUS_REGION,
campusRegion
type: SET_CAMPUS_REGION,
campusRegion
});
export const addFavoriteFacility = slug => ({
......@@ -48,7 +35,5 @@ export const removeFavoriteFacility = slug => ({
export const setAllFavorites = (favorites) => ({
type: SET_ALL_FAVORITES,
favorites,
favorites
});
......@@ -6,11 +6,11 @@ import Button from 'material-ui/Button';
import IconButton from 'material-ui/IconButton';
import MenuIcon from 'material-ui-icons/Menu';
import SearchBar from '../containers/SearchBar';
import classNames from 'classnames'
import classNames from 'classnames';
class CustomAppBar extends React.Component {
constructor(props) {
constructor() {
super();
this.state = {
isAppBarExpanded: false,
......@@ -23,38 +23,38 @@ class CustomAppBar extends React.Component {
toggleExpand() {
this.setState({
isAppBarExpanded: !this.state.isAppBarExpanded
})
});
};
render() {
return (<div>
<AppBar position="absolute"
className={classNames('app-bar', this.state.isSearchExpanded && 'app-bar-search-expanded')}>
<Toolbar className={'app-bar-tool-bar'}>
<img src={require('../images/SRCT_square.svg')} className={'app-bar-logo'}/>
<Typography type="title" className={classNames('app-bar-title', 'app-bar-text-color')}>
What's Open
</Typography>
<SearchBar onSearchExpand={() => this.setState({isSearchExpanded: true})}
onSearchCollapse={() => this.setState({isSearchExpanded: false})}/>
<IconButton onClick={this.toggleExpand} aria-label="Menu"
className={classNames('app-bar-menu-button', 'app-bar-text-color')}>
<MenuIcon/>
</IconButton>
<div
className={classNames('app-bar-link-container', !this.state.isAppBarExpanded && 'app-bar-hide')}>
<Button
className={classNames('app-bar-link-button', 'app-bar-text-color')}>
About
</Button>
<Button
className={classNames('app-bar-link-button', 'app-bar-text-color')}>
Feedback
</Button>
</div>
</Toolbar>
</AppBar>
</div>);
return (
<div>
<AppBar position="absolute"
className={classNames('app-bar', this.state.isSearchExpanded && 'app-bar-search-expanded')}>
<Toolbar className={'app-bar-tool-bar'}>
<img src={require('../images/SRCT_square.svg')} className={'app-bar-logo'}/>
<Typography type="title" className={classNames('app-bar-title', 'app-bar-text-color')}>
What's Open
</Typography>
<SearchBar onSearchExpand={() => this.setState({isSearchExpanded: true})}
onSearchCollapse={() => this.setState({isSearchExpanded: false})}/>
<IconButton onClick={this.toggleExpand} aria-label="Menu"
className={classNames('app-bar-menu-button', 'app-bar-text-color')}>
<MenuIcon/>
</IconButton>
<div
className={classNames('app-bar-link-container', !this.state.isAppBarExpanded && 'app-bar-hide')}>
<Button className={classNames('app-bar-link-button', 'app-bar-text-color')}>
About
</Button>
<Button className={classNames('app-bar-link-button', 'app-bar-text-color')}>
Feedback
</Button>
</div>
</Toolbar>
</AppBar>
</div>
);
};
}
......
import React from 'react'
import FacilityCard from '../containers/FacilityCard'
import React from 'react';
import FacilityCard from '../containers/FacilityCard';
import Grid from 'material-ui/Grid';
const CardContainer = ({searchTerm, campusRegion, facilities}) => {
......
This diff is collapsed.
import React from 'react';
import {withStyles} from 'material-ui/styles';
import Avatar from 'material-ui/Avatar';
import Typography from 'material-ui/Typography';
import RestaurantIcon from 'material-ui-icons/Restaurant';
import StoreIcon from 'material-ui-icons/Store';
import LocalCafeIcon from 'material-ui-icons/LocalCafe';
import LocalPrintShopIcon from 'material-ui-icons/LocalPrintshop';
import LocalPostOfficeIcon from 'material-ui-icons/LocalPostOffice';
import FitnessCenterIcon from 'material-ui-icons/FitnessCenter';
import ShoppingCartIcon from 'material-ui-icons/ShoppingCart'
import {red, blue, brown, grey, teal, deepOrange, lime} from 'material-ui/colors';
const FacilityCategory = ({category}) => {
const generateAvatar = () => {
let color;
let icon;
/*
TODO: May not want to hardcode the id's. Can be dynamically retrieved from /api/categories.
this wouldn't be of any use unless the API returns something to indicate the icon / color.
*/
/*
Proposed Category Types:
dining hall
convenience store
cafe
restaurant
food truck ???
athletic
mailroom
print services
retail
school offices
student centers
*/
switch (category.id) {
case 1: //Dining Hall
case 2: //Restaurant
case 5: //Take out dining hall
color = red[400];
icon = <RestaurantIcon className={'facility-category-icon'}/>;
break;
case 3: //Convenience Store
color = blue[500];
icon = <StoreIcon className={'facility-category-icon'}/>;
break;
case 4: //Cafe
color = brown[500];
icon = <LocalCafeIcon className={'facility-category-icon'}/>;
break;
case 6: //Athletic Facility
color = teal[500];
icon = <FitnessCenterIcon className={'facility-category-icon'}/>;
break;
case 7: //TODO: Print Services - NOT IN API
color = grey[500];
icon = <LocalPrintShopIcon className={'facility-category-icon'} />;
break;
case 8: //TODO Mailroom - NOT IN API
color = deepOrange[500];
icon = <LocalPostOfficeIcon className={'facility-category-icon'}/>;
break;
default:
color = lime[500];
icon = <ShoppingCartIcon className={'facility-category-icon'}/>
}
return (
<Avatar className={'facility-category-avatar'} style={{backgroundColor: color}}>
{icon}
</Avatar>
)
};
return (
<div className={'facility-category-wrapper'}>
{/* {generateAvatar()} */}
<Typography type={'body1'} noWrap>
{category.name}
</Typography>
......
......@@ -45,18 +45,18 @@ class FacilityDialog extends React.Component {
return (
<Dialog classes={{root: 'fd-dialog-root', paper: 'fd-dialog-paper'}} open={isOpen} onClose={onClose}>
<IconButton className={'fd-close-btn'} onClick={onClose}>
<CloseIcon />
<CloseIcon/>
</IconButton>
<Grid container className={'fd-container'} justify={'center'}>
<Grid item className={'fd-header-container'}>
<Grid container className={'fd-header'}>
<Grid item>
<Avatar src={require('../images/chipotleLogo.png')} />
<Avatar src={require('../images/chipotleLogo.png')}/>
</Grid>
<Grid item className={'fd-header-text-container'}>
<Typography className={'fd-header-text'} type={'headline'}>
{removeBrackets(facility.facility_name)}
</Typography>
</Typography>
</Grid>
</Grid>
</Grid>
......
......@@ -32,8 +32,8 @@ const FacilityStatus = ({facility}) => {
const statusInfo = generateStatusInfo(facility);
return (
<Typography type={'caption'} className={classNames('facility-status-text', statusInfo.isOpen ? 'facility-status-open' : 'facility-status-closed')}>
{/*{statusInfo.icon}*/}
<Typography type={'caption'}
className={classNames('facility-status-text', statusInfo.isOpen ? 'facility-status-open' : 'facility-status-closed')}>
{statusInfo.label}
</Typography>
)
......
import React from 'react'
import {withStyles} from 'material-ui/styles';
import pink from 'material-ui/colors/pink';
import FavoriteBorderIcon from 'material-ui-icons/FavoriteBorder';
import FavoriteIcon from 'material-ui-icons/Favorite';
import PropTypes from 'prop-types';
......@@ -29,10 +27,12 @@ class FavoriteButton extends React.Component {
render() {
const {isHovered} = this.props;
if (this.props.isFavorite) {
return (<FavoriteIcon onClick={this.handleClick} className={classNames('favorite-button-heart', 'favorite-button-heart-favorited')}/>);
return (<FavoriteIcon onClick={this.handleClick}
className={classNames('favorite-button-heart', 'favorite-button-heart-favorited')}/>);
}
return (<FavoriteBorderIcon onClick={this.handleClick} className={classNames('favorite-button-heart', isHovered ? 'favorite-button-heart-hover' : 'favorite-button-heart-no-hover')}/>);
return (<FavoriteBorderIcon onClick={this.handleClick}
className={classNames('favorite-button-heart', isHovered ? 'favorite-button-heart-hover' : 'favorite-button-heart-no-hover')}/>);
}
}
......
import React from 'react'
import ReactMapboxGl, { Layer, Feature,Marker,Source,GeoJSONLayer } from "react-mapbox-gl";
import MapboxClient from 'mapbox'
import mapboxgl from 'mapbox-gl'
import {withStyles} from 'material-ui/styles';
import {addRoute,getGeoLine} from '../utils/mapboxUtils';
import React from 'react';
import ReactMapboxGl, {Marker} from "react-mapbox-gl";
import mapboxgl from 'mapbox-gl';
import PropTypes from 'prop-types';
import Button from 'material-ui/Button';
import Avatar from 'material-ui/Avatar';
import List, { ListItem, ListItemAvatar, ListItemText } from 'material-ui/List';
import Dialog, { DialogTitle } from 'material-ui/Dialog';
import PersonIcon from 'material-ui-icons/Person';
import AddIcon from 'material-ui-icons/Add';
import Typography from 'material-ui/Typography';
import blue from 'material-ui/colors/blue';
import Dialog from 'material-ui/Dialog';
const mapboxToken = "pk.eyJ1IjoibWR1ZmZ5OCIsImEiOiJjaXk2a2lxODQwMDdyMnZzYTdyb3M4ZTloIn0.mSocl7zUnZBO6-CV9cvmnA";
const emails = ['username@gmail.com', 'user02@gmail.com'];
const styles = {
avatar: {
background: blue[100],
color: blue[600],
},
};
const token = "pk.eyJ1IjoibWR1ZmZ5OCIsImEiOiJjaXk2a2lxODQwMDdyMnZzYTdyb3M4ZTloIn0.mSocl7zUnZBO6-CV9cvmnA";
const Map = ReactMapboxGl({
accessToken: token,
attributionControl:false,
});
accessToken: mapboxToken,
attributionControl: false,
});
let starbucksLogo = new Image();
starbucksLogo.src = require('../images/starbucksSVG.svg')
starbucksLogo.width = 60
starbucksLogo.height = 60
const images = ['starbucks',starbucksLogo,{pixelRatio:3}]
let starbucksLogo = new Image();
starbucksLogo.src = require('../images/starbucksSVG.svg');
starbucksLogo.width = 60;
starbucksLogo.height = 60;
class MapDialog extends React.Component {
handleRequestClose = () => {
this.props.onClose(this.props.selectedValue);
};
handleRequestClose = () => {
this.props.onClose(this.props.selectedValue);
};
handleListItemClick = value => {
this.props.onClose(value);
};
render() {
const {facilities, facility, zoom, center, maxBounds, ...other} = this.props;
render() {
const { classes, selectedValue,facility,facilities,zoom,center,maxBounds,...other } = this.props;
return (
<Dialog onClose={this.handleRequestClose} {...other}>
<Map
onStyleLoad={(map) => {
map.addControl(new mapboxgl.GeolocateControl({
positionOptions: {
enableHighAccuracy: true,
},
trackUserLocation: true
}));
return (
<Dialog onClose={this.handleRequestClose} {...other}>
<Map
onStyleLoad={(map,e)=>{
map.addControl(new mapboxgl.GeolocateControl({
positionOptions: {
enableHighAccuracy: true,
},
trackUserLocation: true
}));
}}
onClick={(map,e)=>{
this.setState({
mapDialogOpen: true
})
console.log('changed')
}}
style="mapbox://styles/mduffy8/cjbcdxi3v73hp2spiyhxbkjde"
movingMethod={'easeTo'}
containerStyle={{
height: "500px",
width: "600px",
borderRadius:'5px',
}}
center={center}
zoom={zoom}
maxBounds={maxBounds}>
{(facilities.length > 0) && facilities.map((item) =>{
return(
<Marker
key={item.slug}
coordinates={item.facility_location.coordinate_location.coordinates}
anchor="bottom">
<img height={20} width={20} src={require('../images/starbucksSVG.svg')}/>
{/* <div style={Mark}></div> */}
</Marker>
)
})}
</Map>
</Dialog>
);
}
}}
onClick={() => {
this.setState({
mapDialogOpen: true
});
}}
style="mapbox://styles/mduffy8/cjbcdxi3v73hp2spiyhxbkjde"
movingMethod={'easeTo'}
containerStyle={{
height: "500px",
width: "600px",
borderRadius: '5px',
}}
center={center}
zoom={zoom}
maxBounds={maxBounds}>
{(facilities.length > 0) && facilities.map((item) => {
return (
<Marker
key={item.slug}
coordinates={item.facility_location.coordinate_location.coordinates}
anchor="bottom">
<img height={20} width={20} src={require('../images/starbucksSVG.svg')}/>
</Marker>
)
})}
</Map>
</Dialog>
);
}
}
MapDialog.propTypes = {
classes: PropTypes.object.isRequired,
onClose: PropTypes.func,
selectedValue: PropTypes.string,
onClose: PropTypes.func,
selectedValue: PropTypes.string,
};
export default withStyles(styles)(MapDialog);
export default MapDialog;
import React from 'react';
import Paper from 'material-ui/Paper'
import Avatar from 'material-ui/Avatar'
import Typography from 'material-ui/Typography'
import Paper from 'material-ui/Paper';
import Avatar from 'material-ui/Avatar';
import Typography from 'material-ui/Typography';
import Divider from 'material-ui/Divider';
import TextwTitle from '../components/TextwTitle'
import FacilitiesMap from '../components/FacilitiesMap'
import TextwTitle from '../components/TextwTitle';
import FacilitiesMap from '../components/FacilitiesMap';
import classNames from 'classnames';
import Button from 'material-ui/Button';
import Chip from 'material-ui/Chip';
import WeekHours from './WeekHours';
import { toggleSidebar } from '../actions/ui';
import FacilityTags from './FacilityTags';
import {removeBrackets} from '../utils/nameUtils';
const Sidebar = ({facility, isSidebarOpen, isSidebarMapOpen, toggleSidebarMap, facilities}) => {
const removeBrackets = (name) => {
if (typeof(name) === "undefined") {
return "";
}
const openBracket = name.indexOf('[');
if (openBracket !== -1) {
return name.substring(0, openBracket);
}