Skip to content

Commit d95881c

Browse files
jengopocketsjengopockets
authored
Merge pull request #72 from Lambda-School-Labs/development
Functionality Update
2 parents 697d5bd + 7a9190e commit d95881c

30 files changed

+2316
-397
lines changed

‎package-lock.json‎

Lines changed: 15 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -25,6 +25,7 @@
2525
"react": "^16.9.0",
2626
"react-dom": "^16.9.0",
2727
"react-fontawesome": "^1.6.1",
28+
"react-icons": "^3.7.0",
2829
"react-map-gl": "^5.0.10",
2930
"react-mapbox-gl": "^4.6.0",
3031
"react-mapbox-gl-geocoder": "^1.0.3",

‎src/App.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,15 @@
11
import React,{useState,useEffect} from 'react'
22
import {TokenContext} from './Components/Context/Contexts';
33
import {Route,Switch} from 'react-router-dom';
4-
import { useAuth0 } from "./Components/Auth0/react-auth0-wrapper";
54
import Signup from './Components/SignUp/Signup';
65
import Login from './Components/Login/Login';
76
import Demographics from "./Components/Demographics/Demographics";
87
import Navbar from './Components/NavBar/Navbar'
9-
import About from './Components/About/About';
108
import Contact from './Components/Contact/Contact';
119
import { ThemeProvider } from "@chakra-ui/core";
1210
import OurMap from './Components/Map/OurMap';
1311
import './App.css'
12+
import AgencyData from '../src/Components/Filter/AgencyData'
1413
export default function App() {
1514
//Styles
1615

@@ -36,6 +35,7 @@ useEffect(() => {
3635
{/* <Route exact path="/about" component={About}/> */}
3736
<Route exact path="/contact" component={Contact}/>
3837
<Route path="/demo" component={Demographics}/>
38+
<Route exact path="/test" component={AgencyData}/>
3939
</Switch>
4040
</TokenContext.Provider>
4141
</ThemeProvider>

‎src/Components/Auth0/Auth.js‎

Whitespace-only changes.

‎src/Components/Auth0/index.html‎

Lines changed: 177 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,177 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<!-- =========================================Auth0 login component========================================================================= -->
5+
<meta charset="utf-8">
6+
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
7+
<title>Sign In with Auth0</title>
8+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
9+
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
10+
</head>
11+
<style>
12+
body, html {
13+
height: 100%;
14+
background-image:linear-gradient(0deg, rgb(61, 103, 216),rgb(65, 80, 170),rgb(53, 69, 115));
15+
16+
}
17+
18+
.login-container {
19+
position: relative;
20+
height: 100%;
21+
}
22+
23+
.login-box {
24+
position: absolute;
25+
top: 50%;
26+
transform: translateY(-50%);
27+
padding: 15px;
28+
background-color: #fff;
29+
box-shadow: 0px 5px 5px #ccc;
30+
border-radius: 5px;
31+
border-top: 1px solid #e9e9e9;
32+
}
33+
34+
.login-header {
35+
text-align: center;
36+
}
37+
38+
.login-header img {
39+
width: 75px;
40+
}
41+
42+
#error-message {
43+
display: none;
44+
}
45+
</style>
46+
<body>
47+
<!-- =========================================Auth0 login component========================================================================= -->
48+
49+
<div class="login-container">
50+
<div class="col-xs-12 col-sm-4 col-sm-offset-4 login-box">
51+
<div class="login-header">
52+
<img src="https://raw.githubusercontent.com/Lambda-School-Labs/crime-statistics-for-travelers-fe/development/public/favicon.ico"/>
53+
<h3>Welcome to Crime Statistics For Travelers</h3>
54+
<h5>PLEASE LOG IN</h5>
55+
</div>
56+
<div id="error-message" class="alert alert-danger"></div>
57+
<form onsubmit="return false;" method="post">
58+
<div class="form-group">
59+
<label for="name">Email</label>
60+
<input
61+
type="email"
62+
class="form-control"
63+
id="email"
64+
placeholder="Enter your email">
65+
</div>
66+
<div class="form-group">
67+
<label for="name">Password</label>
68+
<input
69+
type="password"
70+
class="form-control"
71+
id="password"
72+
placeholder="Enter your password">
73+
</div>
74+
<button
75+
type="submit"
76+
id="btn-login"
77+
class="btn btn-primary btn-block">
78+
Log In
79+
</button>
80+
<button
81+
type="button"
82+
id="btn-signup"
83+
class="btn btn-default btn-block">
84+
Sign Up
85+
</button>
86+
<hr>
87+
<button
88+
type="button"
89+
id="btn-google"
90+
class="btn btn-default btn-danger btn-block">
91+
Log In with Google
92+
</button>
93+
</form>
94+
</div>
95+
</div>
96+
97+
<!--[if IE 8]>
98+
<script src="//cdnjs.cloudflare.com/ajax/libs/ie8/0.2.5/ie8.js"></script>
99+
<![endif]-->
100+
101+
<!--[if lte IE 9]>
102+
<script src="https://cdn.auth0.com/js/polyfills/1.0/base64.min.js"></script>
103+
<script src="https://cdn.auth0.com/js/polyfills/1.0/es5-shim.min.js"></script>
104+
<![endif]-->
105+
106+
<script src="https://cdn.auth0.com/js/auth0/9.11.2/auth0.min.js"></script>
107+
<script src="https://cdn.auth0.com/js/polyfills/1.0/object-assign.min.js"></script>
108+
<script>
109+
window.addEventListener('load', function() {
110+
111+
var config = JSON.parse(
112+
decodeURIComponent(escape(window.atob('@@config@@')))
113+
);
114+
115+
var params = Object.assign({
116+
/* additional configuration needed for use of custom domains
117+
overrides: {
118+
__tenant: config.auth0Tenant,
119+
__token_issuer: 'YOUR_CUSTOM_DOMAIN'
120+
}, */
121+
domain: config.auth0Domain,
122+
clientID: config.clientID,
123+
redirectUri: config.callbackURL,
124+
responseType: 'code'
125+
}, config.internalOptions);
126+
127+
var webAuth = new auth0.WebAuth(params);
128+
129+
var databaseConnection = 'Username-Password-Authentication';
130+
131+
function login(e) {
132+
e.preventDefault();
133+
var username = document.getElementById('email').value;
134+
var password = document.getElementById('password').value;
135+
webAuth.login({
136+
realm: databaseConnection,
137+
username: username,
138+
password: password
139+
}, function(err) {
140+
if (err) displayError(err);
141+
});
142+
}
143+
144+
function signup() {
145+
var email = document.getElementById('email').value;
146+
var password = document.getElementById('password').value;
147+
148+
webAuth.redirect.signupAndLogin({
149+
connection: databaseConnection,
150+
email: email,
151+
password: password
152+
}, function(err) {
153+
if (err) displayError(err);
154+
});
155+
}
156+
157+
function loginWithGoogle() {
158+
webAuth.authorize({
159+
connection: 'google-oauth2'
160+
}, function(err) {
161+
if (err) displayError(err);
162+
});
163+
}
164+
165+
function displayError(err) {
166+
var errorMessage = document.getElementById('error-message');
167+
errorMessage.innerHTML = err.description;
168+
errorMessage.style.display = 'block';
169+
}
170+
171+
document.getElementById('btn-login').addEventListener('click', login);
172+
document.getElementById('btn-google').addEventListener('click', loginWithGoogle);
173+
document.getElementById('btn-signup').addEventListener('click', signup);
174+
});
175+
</script>
176+
</body>
177+
</html>

0 commit comments

Comments
 (0)