Skip to content
This repository was archived by the owner on Mar 11, 2025. It is now read-only.

Commit 431feb7

Browse files
danaalysethomascoe
authored andcommitted
Username (#143)
Fix #130
1 parent 40ec2ae commit 431feb7

File tree

2 files changed

+70
-89
lines changed

2 files changed

+70
-89
lines changed

README.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -14,11 +14,11 @@ The Detailed Design Document containing the initial specifications of this plugi
1414
* Removed unused admin pages
1515
* Fixed issue where site is broken when plugin is first loaded because of no installed dependencies
1616
* Check for expired members when member table is loaded, set them to expired
17+
* Registration form blocks submission for bad username (#130)
1718
* **Known Bugs and Defects**
1819
* No email alerts are sent to non-recurring members when membership expires (#135)
1920
* When non-recurring members expire, they do not immediately transition into an 'Expired' status. This only happens the next time the member table is loaded after they expire. We don't have a good way to trigger this to happen. Recurring members get triggered by a Stripe expiration event.
20-
* Registration form still allows you to submit when username field is red (#130)
21-
* Login may fail when logged into another (non-DecaturMakers) Google account (#44)
21+
* Login may fail when logged into another (non-DecaturMakers) Google account. This may not be an issue with the new G Suite plugin suggested below (#44)
2222

2323
### v0.6 2017-04-17
2424
* **New Features**

front-end-pages/registration-form/registration-form.html

Lines changed: 68 additions & 87 deletions
Original file line numberDiff line numberDiff line change
@@ -1,44 +1,66 @@
11
<script language="javascript">
2-
(function() {
3-
"use strict";
4-
angular
5-
.module('registration', ['ngMessages'])
6-
.controller('registrationCtrl', mainCtrl)
7-
.directive('passwordVerify', passwordVerify);
8-
9-
function mainCtrl($scope) {
10-
// Some code
11-
}
12-
13-
function passwordVerify() {
14-
return {
15-
restrict: 'A', // only activate on element attribute
16-
require: '?ngModel', // get a hold of NgModelController
17-
link: function(scope, elem, attrs, ngModel) {
18-
if (!ngModel) return; // do nothing if no ng-model
19-
20-
// watch own value and re-validate on change
21-
scope.$watch(attrs.ngModel, function() {
22-
validate();
23-
});
2+
var passwordGood = 0;
3+
var usernameGood = 0;
244

25-
// observe the other value and re-validate on change
26-
attrs.$observe('passwordVerify', function(val) {
27-
validate();
28-
});
5+
function showError() {
6+
jQuery("#username-group").addClass("has-error");
7+
jQuery("#username-help-block").removeClass("hidden");
8+
jQuery("#submit-button").prop("disabled", true);
9+
}
10+
11+
function clearError() {
12+
jQuery("#username-group").removeClass("has-error");
13+
jQuery("#username-help-block").addClass("hidden");
14+
if (passwordGood) {
15+
jQuery("#submit-button").prop("disabled", false);
16+
}
17+
}
2918

30-
var validate = function() {
31-
// values
32-
var val1 = ngModel.$viewValue;
33-
var val2 = attrs.passwordVerify;
19+
function checkUsername() {
20+
jQuery.ajax({
21+
type: "GET",
22+
url: "register",
23+
data: {
24+
"username": jQuery('#username').val(),
25+
"action": 'check'
26+
},
27+
success: function(result) {
28+
console.log(result);
29+
var resultJson = JSON.parse(result);
30+
if (resultJson['result'] == true) {
31+
usernameGood = 1;
32+
clearError();
33+
} else {
34+
usernameGood = 0;
35+
showError();
36+
}
37+
}
38+
});
39+
}
3440

35-
// set validity
36-
ngModel.$setValidity('passwordVerify', val1 === val2);
37-
};
38-
}
41+
function checkPasswordMatch() {
42+
var password = jQuery("#password").val();
43+
var confirmPassword = jQuery("#passwordMatch").val();
44+
45+
if (password.length < 8) {
46+
jQuery("#submit-button").prop("disabled", true);
47+
jQuery("#errorGroup").addClass("has-error");
48+
jQuery("#Error").html("Passwords must be 8 characters");
49+
passwordGood = 0;
50+
} else if (password != confirmPassword) {
51+
jQuery("#submit-button").prop("disabled", true);
52+
jQuery("#errorGroup").addClass("has-error");
53+
jQuery("#Error").html("Passwords do not match!");
54+
passwordGood = 0;
55+
} else {
56+
jQuery("#errorGroup").removeClass("has-error");
57+
jQuery("#Error").html("");
58+
passwordGood = 1;
59+
if (usernameGood) {
60+
jQuery("#submit-button").prop("disabled", false);
61+
}
62+
}
3963
}
40-
}
41-
})();
4264
</script>
4365

4466
<body style="background-color: #EBEBEB">
@@ -67,7 +89,7 @@ <h3>Register as Member</h3>
6789

6890
<div id="username-group" class="form-group">
6991
<label for="username" class="control-label" >Username:</label>
70-
<div class="input-group">
92+
<div class="input-group" id="username-group">
7193
<input type="text" style="" onkeyup="checkUsername()" onchange="checkUsername()" class="form-control" id="username"
7294
name="username" placeholder=""
7395
aria-describedby="username-help-block">
@@ -76,57 +98,16 @@ <h3>Register as Member</h3>
7698
<span id="username-help-block" class="help-block hidden">This username is already taken.</span>
7799
</div>
78100

79-
<script>
80-
81-
82-
function showError() {
83-
jQuery("#username-group").addClass("has-error");
84-
jQuery("#username-help-block").removeClass("hidden");
85-
//TODO Add submission blocker
86-
}
87-
88-
function clearError() {
89-
jQuery("#username-group").removeClass("has-error");
90-
jQuery("#username-help-block").addClass("hidden");
91-
}
92-
93-
function checkUsername() {
94-
jQuery.ajax({
95-
type: "GET",
96-
url: "register",
97-
data: {
98-
"username": jQuery('#username').val(),
99-
"action": 'check'
100-
},
101-
success: function(result) {
102-
console.log(result);
103-
var resultJson = JSON.parse(result);
104-
if (resultJson['result'] == true) {
105-
clearError();
106-
} else {
107-
showError();
108-
}
109-
}
110-
});
111-
}
112-
</script>
113-
114-
<div class="form-group" ng-class="{ 'has-error' : register.password.$dirty && register.password.$invalid && register.passwordMatch.$dirty && register.passwordMatch.$invalid}">
115-
<label for="password" class="control-label" >Password:</label>
116-
<input type="password" style="display: inline;" class="form-control" id="password" name="password" required ng-model="password" password-verify="{{passwordMatch}}" ng-minlength="8">
117-
<div class="help-block" ng-messages="register.password.$error" ng-if="register.password.$dirty">
118-
<p ng-message="minlength">Must be 8 characters.</p>
119-
<p ng-message="required">This field is required.</p>
101+
<div id="errorGroup">
102+
<div class="form-group">
103+
<label for="password">Password:</label>
104+
<input type="password" name="password" id="password" class="form-control" onchange="checkPasswordMatch();" onkeyup="checkPasswordMatch();">
120105
</div>
121-
</div>
122106

123-
<div class="form-group" ng-class="{ 'has-error' : register.passwordMatch.$dirty && register.passwordMatch.$invalid }">
124-
<label for="passwordMatch" class="control-label" >Confirm Password:</label>
125-
<input type="password" style="display: inline;" class="form-control" id="passwordMatch" name="passwordMatch" ng-model="passwordMatch" required password-verify="{{password}}" ng-minlength="8">
126-
<div class="help-block" ng-messages="register.passwordMatch.$error" ng-if="register.passwordMatch.$dirty">
127-
<p ng-message="required">This field is required.</p>
128-
<p ng-message="minlength">Must be 8 characters.</p>
129-
<p ng-message="passwordVerify">The fields do not match.</p>
107+
<div class="form-group">
108+
<label for="passwordMatch">Confirm Password:</label>
109+
<input type="password" name="passwordMatch" id="passwordMatch" class="form-control" onchange="checkPasswordMatch();" onkeyup="checkPasswordMatch();">
110+
<div id="Error" class="help-block"></div>
130111
</div>
131112
</div>
132113

@@ -147,7 +128,7 @@ <h3>Register as Member</h3>
147128
</div>
148129

149130
<div class="form-group">
150-
<button type="submit" class="btn btn-primary" ng-disabled="register.$invalid">Submit</button>
131+
<button id="submit-button" type="submit" class="btn btn-primary" disabled="true">Submit</button>
151132
</div>
152133
</div>
153134
</form>

0 commit comments

Comments
 (0)