110swag / flashy-frontend

Commit 6eb24516e233a46dfcfecb8ee5590c7b53871fde

Authored by Andrew Buss 2015-06-02 11:26:16 -0700

clean up reset flow

Showing 7 changed files with 135 additions and 146 deletions Side-by-side Diff

scripts/RequestResetController.js
scripts/ResetPasswordController.js
scripts/RootController.js
scripts/SettingsController.js
scripts/UserService.js
templates/requestpasswordreset.html
templates/resetpassword.html

...	...	@@ -7,9 +7,8 @@
7	7	$http.post('/api/request_password_reset/', {email: email}).
8	8	success(function(data) {
9	9	$scope.success = true;
10		- //$state.go('requestresetsuccess');
11		- console.log('SUCCESS');
12		- console.log(data);
	10	+ Materialize.toast('A password reset link was sent to your email', 4000);
	11	+ $state.go('login');
13	12	}).
14	13	error(function(data, status, header, config) {
15	14	if (data.email) {

1	1	angular.module('flashy.ResetPasswordController', ['ui.router']).
2	2
3		-controller('ResetPasswordController', ['$scope', '$state', '$http', '$timeout',
4		- function($scope, $state, $http, $timeout) {
5		- 'use strict';
6		- var url = document.location.href.split('/');
7		- var token = url[url.length - 1];
8		- var uid = url[url.length - 2];
9		- $scope.error = false;
10		- $scope.success = false;
11		- $scope.mismatch = false;
12		- $scope.unacceptable = false;
13		- /*if(token == 'resetpassword') {
14		- $state.go('login');
15		- }*/
16		- console.log('RESETTING');
17		- $scope.confirmResetPass = function() {
18		- if ($scope.newPassword.length < 8) {
19		- $scope.unacceptable = true;
20		- return;
21		- }
22		- if ($scope.newPassword != $scope.confirmPassword) {
23		- $scope.mismatch = true;
24		- $scope.confirmPassword.$setPristine();
25		- console.log('mismatch');
26		- return;
27		- }
28		- /password passes local tests/
29		- $http.post('/api/reset_password/', JSON.stringify({
30		- 'uid': uid,
31		- 'token': token,
32		- 'new_password': $scope.newPassword
33		- }))
34		- .success(function(data) {
35		- $scope.error = false;
36		- $scope.success = true;
37		- //$state.go('resetpasssuccess');
38		- $timeout(function($state) {
39		- $state.go('login');
40		- }, 1000);
41		- console.log(data);
42		- })
43		- .error(function(data, status, header, config) {
44		- $scope.error = true;
45		- $scope.success = false;
46		- $scope.mismatch = false;
47		- $scope.unacceptable = false;
48		- console.log(data);
49		- });
50		- };
51		- $scope.cancelReset = function() {
52		- $state.go('login');
53		- };
54		-}]);
	3	+ controller('ResetPasswordController', function($scope, $state, $stateParams, $http, UserService) {
	4	+ $scope.error = false;
	5	+ $scope.success = false;
	6	+ $scope.mismatch = false;
	7	+ $scope.unacceptable = false;
	8	+
	9	+ $scope.confirmResetPass = function() {
	10	+ if ($scope.newPassword.length < 8) {
	11	+ $scope.unacceptable = true;
	12	+ return;
	13	+ }
	14	+ if ($scope.newPassword != $scope.confirmPassword) {
	15	+ $scope.mismatch = true;
	16	+ $scope.confirmPassword.$setPristine();
	17	+ console.log('mismatch');
	18	+ return;
	19	+ }
	20	+ /password passes local tests/
	21	+ $http.post('/api/reset_password/', JSON.stringify({
	22	+ 'uid': $stateParams.uid,
	23	+ 'token': $stateParams.token,
	24	+ 'new_password': $scope.newPassword
	25	+ }))
	26	+ .success(function(data) {
	27	+ $scope.error = false;
	28	+ $scope.success = true;
	29	+ UserService.startAuth().then(function() {
	30	+ $state.go('login');
	31	+ });
	32	+ Materialize.toast('Your password was successfully changed', 4000);
	33	+ })
	34	+ .error(function(data, status, header, config) {
	35	+ $scope.error = true;
	36	+ $scope.success = false;
	37	+ $scope.mismatch = false;
	38	+ $scope.unacceptable = false;
	39	+ console.log(data);
	40	+ });
	41	+ };
	42	+ $scope.cancelReset = function() {
	43	+ $state.go('login');
	44	+ };
	45	+ });

...	...	@@ -34,7 +34,7 @@
34	34	$('#classDropdown').toggle();
35	35	})
36	36	*/
37		-
	37	+
38	38	var postlogin = function(data) {
39	39	$scope.user = data;
40	40	//UserService.redirectToDefaultState($state);

...	...	@@ -27,7 +27,7 @@
27	27	callback(true);
28	28	}
29	29
30		- console.log("gonna try to launch service worker now");
	30	+ console.log('gonna try to launch service worker now');
31	31	if ('serviceWorker' in navigator) {
32	32
33	33	console.log('gonna try to launch service worker now');
...	...	@@ -55,5 +55,5 @@
55	55	}
56	56
57	57
58		- });
	58	+ });

...	...	@@ -19,15 +19,17 @@
19	19	deferred.resolve(data);
20	20	};
21	21	this.login = login;
22		- $http.get('/api/me/').success(function(data) {
23		- console.log('user is logged in!');
24		- login(data);
25		- }).error(function(data) {
26		- console.log(data);
27		- console.log('not logged in yet: ' + data.detail);
28		- _user = {email: false};
29		- deferred.resolve(_user);
30		- });
	22	+ this.startAuth = function() {
	23	+ return $http.get('/api/me/').success(function(data) {
	24	+ console.log('user is logged in!');
	25	+ login(data);
	26	+ }).error(function(data) {
	27	+ console.log(data);
	28	+ console.log('not logged in yet: ' + data.detail);
	29	+ _user = {email: false};
	30	+ deferred.resolve(_user);
	31	+ });
	32	+ };
31	33
32	34	this.isResolved = function() {
33	35	return !!_user;
...	...	@@ -102,5 +104,6 @@
102	104	Materialize.toast('Resent confirmation email! Check your spam folder too.', 4000);
103	105	});
104	106	};
	107	+ this.startAuth();
105	108	});

1		-<div class="row" ng-show="success">
2		- <h1>Request sent!</h1>
3		- <h1>Check your email in a few minutes.</h1>
4		-</div>
	1	+<div class="" style="margin-top:32px;">
	2	+ <div class="row" style="max-width:512px; width:50%; min-width:256px; margin: 0 auto">
	3	+ <div class="card">
	4	+ <form class="col s12" name="passreset_form">
5	5
6		-<div class="row" ng-hide="success">
7		-<div class="offset-s2 col s8">
8		-<div class="card">
9		- <form class="col s12" name="passreset_form">
10		- <div class="card-content">
11		- <h2>Reset Password</h2>
12		- </div>
13		-
14		- <div class="divider"></div>
15		- <div name="passreset" class="card-content">
16		- <div class="section">
17		- <div ng-show="error" role="error">
18		- <i style="color:#8E2323" class="mdi-alert-error"></i>
19		- <span style="color:#8E2323">Enter a valid email!</span>
	6	+ <div class="card-content">
	7	+ <h2>Reset Password</h2>
20	8	</div>
21		- </div>
22		- <!--FORM INPUT-->
23		- <div class="input-field">
24		- <label for="email">Enter Your Email</label>
25		- <input id="email" type="email" class="form-control" ng-model="user_email" placeholder="" required />
26		- </div>
27		- </div>
28	9
29		- <div class="card-action">
30		- <button class="btn waves-effect waves-light green right" type="submit" name="action"
31		- ng-click="resetPass(user_email)">Reset</button>
32		- <button class="btn waves-effect waves-light red" type="submit" name="action"
33		- ng-click="cancelReset()">Cancel</button>
	10	+ <div class="divider"></div>
	11	+ <div name="passreset" class="card-content">
	12	+ <div class="section">
	13	+ <div ng-show="error" role="error">
	14	+ <i style="color:#8E2323" class="mdi-alert-error"></i>
	15	+ <span style="color:#8E2323">Enter a valid email!</span>
	16	+ </div>
	17	+ </div>
	18	+ <!--FORM INPUT-->
	19	+ <div class="input-field">
	20	+ <label for="email">Enter Your Email</label>
	21	+ <input id="email" type="email" class="form-control" ng-model="user_email" placeholder="" required/>
	22	+ </div>
	23	+ </div>
34	24
	25	+ <div class="card-action">
	26	+ <button class="btn waves-effect waves-light green right" type="submit" name="action"
	27	+ ng-click="resetPass(user_email)">Reset
	28	+ </button>
	29	+ <button class="btn waves-effect waves-light red" type="submit" name="action"
	30	+ ng-click="cancelReset()">Cancel
	31	+ </button>
	32	+
	33	+ </div>
	34	+ </form>
35	35	</div>
36		- </form>
37		-</div>
38		-</div>
	36	+ </div>
39	37	</div>

1		-<div class="row" ng-show="success">
2		- <h1>Reset password successful!</h1>
3		-</div>
	1	+<div class="" style="margin-top:32px;">
	2	+ <div class="row" style="max-width:512px; width:50%; min-width:256px; margin: 0 auto">
	3	+ <div class="card">
	4	+ <form class="col s12" name="resetpass_form">
	5	+ <div class="card-content">
	6	+ <h2 class="">Reset Password</h2>
	7	+ </div>
	8	+ <div class="divider"></div>
	9	+ <div class="card-content">
	10	+ <!--ERRORS-->
	11	+ <div role="alert" ng-show="error">
	12	+ <i style="color:#8E2323" class="mdi-alert-error"></i>
	13	+ <span style="color:#8E2323">Your password reset link is invalid. Perhaps it has already been used?</span>
	14	+ </div>
	15	+ <div role="alert" ng-show="mismatch && newPassword != confirmPassword">
	16	+ <i style="color:#8E2323" class="mdi-alert-error"></i>
	17	+ <span style="color:#8E2323">Passwords do not match!</span>
	18	+ </div>
	19	+ <div role="alert" ng-show="unacceptable && newPassword.length < 8">
	20	+ <i style="color:#8E2323" class="mdi-alert-error"></i>
	21	+ <span style="color:#8E2323">Please make a password with at least 8 characters!</span>
	22	+ </div>
	23	+ <!--INPUTS-->
	24	+ <div class="input-field">
	25	+ <input id="newpassword" type="password" class="validate" ng-model="newPassword" placeholder="" required/>
	26	+ <label for="newpassword">Password</label>
	27	+ </div>
	28	+ <div class="input-field">
	29	+ <input id="confirmpassword" type="password" class="validate" ng-model="confirmPassword" placeholder=""
	30	+ required/>
	31	+ <label for="confirmpassword">Confirm password</label>
	32	+ </div>
	33	+ </div>
4	34
5		-<div class="container" ng-hide="success">
6		-<div class="row">
7		-<div class="offset-s2 col s8">
8		-<div class="card">
9		- <form class="col s12" name="resetpass_form">
10		- <div class="card-content">
11		- <h2 class="">Reset Password</h2>
	35	+ <div class="card-action">
	36	+ <button class="btn waves-effect waves-light green right" type="submit" name="submit"
	37	+ ng-click="confirmResetPass()">Confirm
	38	+ </button>
	39	+ <button class="btn waves-effect waves-light red" type="submit" name="action"
	40	+ ng-click="cancelReset()">Cancel
	41	+ </button>
	42	+
	43	+ </div>
	44	+ </form>
12	45	</div>
13		- <div class="divider"></div>
14		- <div class="card-content">
15		- <!--ERRORS-->
16		- <div role="alert" ng-show="error">
17		- <i style="color:#8E2323" class="mdi-alert-error"></i>
18		- <span style="color:#8E2323">Please check your reset password link!</span>
19		- </div>
20		- <div role="alert" ng-show="mismatch && newPassword != confirmPassword">
21		- <i style="color:#8E2323" class="mdi-alert-error"></i>
22		- <span style="color:#8E2323">Passwords do not match!</span>
23		- </div>
24		- <div role="alert" ng-show="unacceptable && newPassword.length < 8">
25		- <i style="color:#8E2323" class="mdi-alert-error"></i>
26		- <span style="color:#8E2323">Please make a password with at least 8 characters!</span>
27		- </div>
28		- <!--INPUTS-->
29		- <div class="input-field">
30		- <input id="newpassword" type="password" class="validate" ng-model="newPassword" placeholder="" required/>
31		- <label for="newpassword">Password</label>
32		- </div>
33		- <div class="input-field">
34		- <input id="confirmpassword" type="password" class="validate" ng-model="confirmPassword" placeholder="" required/>
35		- <label for="confirmpassword">Confirm password</label>
36		- </div>
37		- </div>
38		-
39		- <div class="card-action">
40		- <button class="btn waves-effect waves-light red" type="submit" name="action"
41		- ng-click="cancelReset()">Cancel</button>
42		- <button class="btn waves-effect waves-light green right" type="submit" name="action"
43		- ng-click="confirmResetPass()">Confirm</button>
44		- </div>
45		- </form>
46		-</div>
47		-</div>
48		-</div>
	46	+ </div>
49	47	</div>