Skip to content

Commit 9549f3c

Browse files
joesantosgarciajoesantosgarcia
committed
added user authentication
1 parent 7c855f2 commit 9549f3c

File tree

13 files changed

+266
-35
lines changed

13 files changed

+266
-35
lines changed

‎app/Controllers/Http/AuthController.js

Lines changed: 115 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,115 @@
1+
'use strict';
2+
const { validate } = use('Validator');
3+
const Hash = use('Hash');
4+
const User = use('App/Models/User');
5+
const Database = use('Database');
6+
const sanitize = use('sqlstring');
7+
8+
class AuthController {
9+
async register({ response, request, view }) {
10+
return view.render('account/register');
11+
}
12+
async storeUser({ response, request, view, session }) {
13+
// validation of input fields
14+
const validation = await validate(request.all(), {
15+
email: 'required|email|unique:users,email',
16+
password: 'required|min:6|max:40',
17+
confirm_password: 'required'
18+
});
19+
// check if passwords are the same
20+
if (request.input('password') == request.input('confirm_password')) {
21+
// check if validation of others fail if not save user
22+
if (validation.fails()) {
23+
session
24+
.withErrors(validation.messages())
25+
.flashExcept(['password', 'confirm_password']);
26+
27+
return response.redirect('back');
28+
} else {
29+
// try to save user to database
30+
try {
31+
let newUser = await User.create({
32+
email: request.input('email'),
33+
password: request.input('password')
34+
});
35+
} catch (error) {
36+
return error;
37+
}
38+
session.flash({ success: 'Welcome to Fresh Gear' });
39+
return response.redirect('/');
40+
}
41+
} else {
42+
session
43+
.withErrors([
44+
{
45+
field: 'password',
46+
message: 'need to confirm password'
47+
},
48+
{
49+
field: 'confirm_password',
50+
message: 'need to confirm password'
51+
}
52+
])
53+
.flashExcept(['password', 'confirm_password']);
54+
55+
return response.redirect('back');
56+
}
57+
}
58+
async login({ response, request, view }) {
59+
return view.render('account/login');
60+
}
61+
async handleLogin({ response, request, view, auth, session }) {
62+
// capture the data from form
63+
const postData = request.post();
64+
let user = await Database.raw(`
65+
SELECT * FROM freshgear.users WHERE users.email = ${sanitize.escape(
66+
postData.email
67+
)} LIMIT 1;
68+
`);
69+
user = user[0][0];
70+
71+
if (user) {
72+
//verify the password
73+
const passwordVerified = await Hash.verify(
74+
postData.password,
75+
user.password
76+
);
77+
78+
if (passwordVerified) {
79+
//login the user
80+
81+
await auth.loginViaId(user.id);
82+
session.flash({ success: 'You are logged in' });
83+
return response.redirect('/');
84+
} else {
85+
session
86+
.withErrors([{ field: 'password', message: 'Incorrect password' }])
87+
.flashExcept(['password']);
88+
return response.redirect('back');
89+
}
90+
} else {
91+
session
92+
.withErrors([
93+
{ field: 'email', message: `Can't find user with that email` }
94+
])
95+
.flashExcept(['password']);
96+
return response.redirect('back');
97+
}
98+
console.log(user);
99+
return user;
100+
// return postData;
101+
}
102+
async logout({ response, request, view, auth, session }) {
103+
try {
104+
await auth.logout();
105+
session.flash({ success: 'You are logged out' });
106+
return response.redirect('/');
107+
} catch (error) {
108+
console.log(error);
109+
session.flash({ error: 'Problems logging you out' });
110+
return response.redirect('/');
111+
}
112+
}
113+
}
114+
115+
module.exports = AuthController;

‎app/Controllers/Http/PageController.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
'use strict';
22

33
class PageController {
4-
home({ view }) {
4+
home({ view, auth }) {
55
return view.render('pages/home');
66
}
77
about({ view }) {

‎app/Controllers/Http/UserController.js

Lines changed: 0 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,6 @@
11
'use strict';
22

33
class UserController {
4-
register({ view }) {
5-
return view.render('account/register');
6-
}
7-
login({ view }) {
8-
return view.render('account/login');
9-
}
104
index({ view }) {
115
return view.render('account/index');
126
}

‎database/migrations/1503248427885_user.js

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -8,11 +8,11 @@ class UserSchema extends Schema {
88
this.raw(
99
`CREATE TABLE users(
1010
id INT UNSIGNED AUTO_INCREMENT PRIMARY KEY,
11-
username VARCHAR(80) NOT NULL UNIQUE,
11+
username VARCHAR(80) UNIQUE,
1212
email VARCHAR(254) NOT NULL UNIQUE,
1313
password VARCHAR(60) NOT NULL,
14-
f_name VARCHAR(60) NOT NULL,
15-
l_name VARCHAR(60) NOT NULL,
14+
f_name VARCHAR(60) ,
15+
l_name VARCHAR(60) ,
1616
created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP,
1717
updated_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP
1818
)

‎package.json

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -31,11 +31,13 @@
3131
"@adonisjs/lucid": "^6.1.3",
3232
"@adonisjs/session": "^1.0.27",
3333
"@adonisjs/shield": "^1.0.8",
34+
"@adonisjs/validator": "^5.0.6",
3435
"@babel/plugin-proposal-decorators": "^7.1.6",
3536
"@babel/plugin-syntax-dynamic-import": "^7.0.0",
3637
"@babel/plugin-transform-async-to-generator": "^7.1.0",
3738
"mysql": "^2.16.0",
3839
"redux": "^4.0.1",
40+
"sqlstring": "^2.3.1",
3941
"uglify-es": "^3.3.9",
4042
"uglifyjs-webpack-plugin": "^1.3.0",
4143
"webpack-dev-server": "^3.1.14"

‎public/css/styles.css

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎resources/assets/scss/styles.scss

Lines changed: 39 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -222,6 +222,14 @@ header{
222222
padding: 80px 20px;
223223
}
224224
form{
225+
.error-message{
226+
position: relative;
227+
top: -9px;
228+
color: red;
229+
}
230+
input.error{
231+
border: 1px solid red !important;
232+
}
225233
input[type="password"], input[type="email"], input[type="text"]{
226234
width: 100%;
227235
margin: 0 0 1rem;
@@ -239,3 +247,34 @@ form{
239247
cursor: pointer;
240248
}
241249
}
250+
251+
#alert-box{
252+
display: none;
253+
position: fixed;
254+
top: 0;
255+
left: 0;
256+
z-index: 20;
257+
padding: 20px;
258+
width: 100%;
259+
cursor: pointer;
260+
&.active{
261+
display: block;
262+
}
263+
.title{
264+
font-weight: 700;
265+
font-size: 1.5rem;
266+
margin-bottom: 2rem;
267+
}
268+
&.notification{
269+
background: yellow;
270+
color: black;
271+
}
272+
&.success{
273+
background: green;
274+
color: white;
275+
}
276+
&.error{
277+
background: red;
278+
color: white;
279+
}
280+
}

‎resources/views/account/login.edge

Lines changed: 18 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -10,9 +10,24 @@ Freshgear | Login
1010
<div class="box-container">
1111
<h2>Log In</h2>
1212
<div class="login-grid login">
13-
<form action="" method="POST">
14-
<input type="email" name="email" placeholder="Email"/>
15-
<input type="password" name="password" placeholder="Password"/>
13+
<form action="/login" method="POST">
14+
{{ csrfField() }}
15+
<input type="email" name="email" placeholder="Email" value="{{old('email', '')}}" class="
16+
@if(hasErrorFor('email'))
17+
error
18+
@endif
19+
"/>
20+
@if(hasErrorFor('email'))
21+
<div class="error-message">{{ getErrorFor('email')}}</div>
22+
@endif
23+
<input type="password" name="password" placeholder="Password" value="{{old('password', '')}}" class="
24+
@if(hasErrorFor('password'))
25+
error
26+
@endif
27+
"/>
28+
@if(hasErrorFor('password'))
29+
<div class="error-message">{{ getErrorFor('password')}}</div>
30+
@endif
1631
<a href="/account/forgot-password">Forgot Password</a>
1732

1833
<button type="submit">Log In</button>

‎resources/views/account/register.edge

Lines changed: 26 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -10,9 +10,32 @@ Freshgear | Login
1010
<div class="box-container">
1111
<h2>Register</h2>
1212
<div class="login-grid register">
13-
<form action="" method="POST">
14-
<input type="email" name="email" placeholder="Email"/>
15-
<input type="password" name="password" placeholder="Password"/>
13+
<form action="/register" method="POST">
14+
{{ csrfField() }}
15+
<input type="email" name="email" placeholder="Email" value="{{old('email', '')}}" class="
16+
@if(hasErrorFor('email'))
17+
error
18+
@endif
19+
" />
20+
@if(hasErrorFor('email'))
21+
<div class="error-message">{{ getErrorFor('email')}}</div>
22+
@endif
23+
<input type="password" name="password" placeholder="Password" value="{{old('password', '')}}" class="
24+
@if(hasErrorFor('password'))
25+
error
26+
@endif
27+
"/>
28+
@if(hasErrorFor('password'))
29+
<div class="error-message">{{ getErrorFor('password')}}</div>
30+
@endif
31+
<input type="password" name="confirm_password" placeholder="Confirm Password" value="{{old('confirm_password', '')}}" class="
32+
@if(hasErrorFor('confirm_password'))
33+
error
34+
@endif
35+
"/>
36+
@if(hasErrorFor('confirm_password'))
37+
<div class="error-message">{{ getErrorFor('confirm_password')}}</div>
38+
@endif
1639

1740

1841
<button type="submit">Register</button>

‎resources/views/layouts/main.edge

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@
99
<link rel="stylesheet" href="/css/styles.css">
1010
</head>
1111
<body>
12+
@include('partials/alert-box')
1213
<header>
1314
<div class="logo">
1415
<a href="/">freshgear</a>
@@ -33,5 +34,11 @@
3334
@!section('javascript')
3435

3536
<script src="/js/dist/CartComponents.js"></script>
37+
<script>
38+
var alertBox = document.getElementById("alert-box")
39+
alertBox.addEventListener("click", () => {
40+
document.getElementById("alert-box").classList.remove("active")
41+
});
42+
</script>
3643
</body>
3744
</html>

‎resources/views/partials/alert-box.edge

Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
<div id="alert-box" class="
2+
@if(flashMessage('notification'))
3+
active notification
4+
@endif
5+
@if(flashMessage('error'))
6+
active error
7+
@endif
8+
@if(flashMessage('success'))
9+
active success
10+
@endif
11+
">
12+
<div class="title">
13+
@if(flashMessage('notification'))
14+
Notification
15+
@endif
16+
@if(flashMessage('error'))
17+
Error
18+
@endif
19+
@if(flashMessage('success'))
20+
Success
21+
@endif
22+
</div>
23+
<p>
24+
@if(flashMessage('notification'))
25+
{{flashMessage('notification')}}
26+
@endif
27+
@if(flashMessage('error'))
28+
{{flashMessage('error')}}
29+
@endif
30+
@if(flashMessage('success'))
31+
{{flashMessage('success')}}
32+
@endif
33+
</p>
34+
</div>

‎start/app.js

Lines changed: 15 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
'use strict'
1+
'use strict';
22

33
/*
44
|--------------------------------------------------------------------------
@@ -11,15 +11,16 @@
1111
|
1212
*/
1313
const providers = [
14-
'@adonisjs/framework/providers/AppProvider',
15-
'@adonisjs/framework/providers/ViewProvider',
16-
'@adonisjs/lucid/providers/LucidProvider',
17-
'@adonisjs/bodyparser/providers/BodyParserProvider',
18-
'@adonisjs/cors/providers/CorsProvider',
19-
'@adonisjs/shield/providers/ShieldProvider',
20-
'@adonisjs/session/providers/SessionProvider',
21-
'@adonisjs/auth/providers/AuthProvider'
22-
]
14+
'@adonisjs/framework/providers/AppProvider',
15+
'@adonisjs/framework/providers/ViewProvider',
16+
'@adonisjs/lucid/providers/LucidProvider',
17+
'@adonisjs/bodyparser/providers/BodyParserProvider',
18+
'@adonisjs/cors/providers/CorsProvider',
19+
'@adonisjs/shield/providers/ShieldProvider',
20+
'@adonisjs/session/providers/SessionProvider',
21+
'@adonisjs/auth/providers/AuthProvider',
22+
'@adonisjs/validator/providers/ValidatorProvider'
23+
];
2324

2425
/*
2526
|--------------------------------------------------------------------------
@@ -30,9 +31,7 @@ const providers = [
3031
| Providers for migrations, tests etc.
3132
|
3233
*/
33-
const aceProviders = [
34-
'@adonisjs/lucid/providers/MigrationsProvider'
35-
]
34+
const aceProviders = ['@adonisjs/lucid/providers/MigrationsProvider'];
3635

3736
/*
3837
|--------------------------------------------------------------------------
@@ -46,7 +45,7 @@ const aceProviders = [
4645
| { Route: 'Adonis/Src/Route' }
4746
|
4847
*/
49-
const aliases = {}
48+
const aliases = {};
5049

5150
/*
5251
|--------------------------------------------------------------------------
@@ -56,6 +55,6 @@ const aliases = {}
5655
| Here you store ace commands for your package
5756
|
5857
*/
59-
const commands = []
58+
const commands = [];
6059

61-
module.exports = { providers, aceProviders, aliases, commands }
60+
module.exports = { providers, aceProviders, aliases, commands };

0 commit comments

Comments
 (0)