-
Notifications
You must be signed in to change notification settings - Fork 44
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Cosmetic fixes to the registration page
- Loading branch information
1 parent
70a755e
commit f0f4b26
Showing
1 changed file
with
78 additions
and
83 deletions.
There are no files selected for viewing
161 changes: 78 additions & 83 deletions
161
iam-login-service/src/main/webapp/resources/iam/apps/registration/registration.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,106 +1,101 @@ | ||
<div ng-controller="RegistrationController as rc"> | ||
<h2 class="text-center"> | ||
Register at <strong>{{organisationName}}</strong> | ||
</h2> | ||
<div class="ext-authn-info" ng-show="extAuthInfo != null"> | ||
<p> | ||
You have been succesfully authenticated with | ||
<strong> {{extAuthProviderName}}</strong>, but your credentials are <strong>not</strong> yet linked to an <strong>{{organisationName}}</strong> account. | ||
</p> | ||
<p> | ||
To proceed with the registration please fill in your personal information below. | ||
</p> | ||
<p> | ||
To abort this registration click <a href="#" ng-click="rc.clearSessionCookies();">here</a>. | ||
</p> | ||
</div> | ||
<div class="ext-authn-info" ng-show="extAuthInfo == null"> | ||
<p> | ||
This is the {{organisationName}} registration page. | ||
</p> | ||
<p> | ||
If you want to register using an external identity provider, like Google or your institution identity provider, head back | ||
to the <a href="/login">login page</a> and click the "Sign in with" button of your preferred identity provider. | ||
</p> | ||
<p> | ||
To proceed with the registration please fill in your personal information below. | ||
</p> | ||
</div> | ||
<form name="registrationForm" id="registration-form"> | ||
<div ng-show="operationResult != null"> | ||
<div class="alert" ng-class="{'alert-success': operationResult=='ok', 'alert-danger': operationResult=='err'}"> | ||
<button class="close" ng-click="operationResult=null" aria-label="close">×</button> {{textAlert}} | ||
</div> | ||
<h2 class="text-center"> | ||
Register at <strong>{{organisationName}}</strong> | ||
</h2> | ||
<div class="ext-authn-info" ng-show="extAuthInfo != null"> | ||
<p> | ||
You have been succesfully authenticated with | ||
<strong> {{extAuthProviderName}}</strong>, but your credentials are <strong>not</strong> yet linked to an <strong>{{organisationName}}</strong> account. | ||
</p> | ||
<p> | ||
To proceed with the registration please fill in your personal information below. | ||
</p> | ||
<p> | ||
To abort this registration click <a href="#" ng-click="rc.clearSessionCookies();">here</a>. | ||
</p> | ||
</div> | ||
<div class="form-group" ng-class="{'has-error': rc.fieldInvalid('name'), 'has-success': rc.fieldValid('name')}"> | ||
<label class="control-label" for="name">Given name</label> | ||
<input class="form-control" name="name" id="name" type="text" ng-model="request.givenname" placeholder="Given name" required | ||
ng-minlength="2" /> | ||
<span class="help-block" ng-show="registrationForm.name.$dirty && registrationForm.name.$error.required"> | ||
<div class="ext-authn-info" ng-show="extAuthInfo == null"> | ||
<p> | ||
This is the {{organisationName}} registration page. | ||
</p> | ||
<p> | ||
If you want to register using an external identity provider, like Google or your institution identity provider, head back to the <a href="/login">login page</a> and click the "Sign in with" button of your preferred identity provider. | ||
</p> | ||
<p> | ||
To proceed with the registration please fill in your personal information below. | ||
</p> | ||
</div> | ||
<form name="registrationForm" id="registration-form"> | ||
<div ng-show="operationResult != null"> | ||
<div class="alert" ng-class="{'alert-success': operationResult=='ok', 'alert-danger': operationResult=='err'}"> | ||
<button class="close" ng-click="operationResult=null" aria-label="close">×</button> {{textAlert}} | ||
</div> | ||
</div> | ||
<div class="form-group" ng-class="{'has-error': rc.fieldInvalid('name'), 'has-success': rc.fieldValid('name')}"> | ||
<label class="control-label" for="name">Given name</label> | ||
<input class="form-control" name="name" id="name" type="text" ng-model="request.givenname" placeholder="Your first name" required ng-minlength="2" /> | ||
<span class="help-block" ng-show="registrationForm.name.$dirty && registrationForm.name.$error.required"> | ||
Please provide a name | ||
</span> | ||
<span class="help-block" ng-show="registrationForm.name.$dirty &®istrationForm.name.$error.minlength"> | ||
<span class="help-block" ng-show="registrationForm.name.$dirty &®istrationForm.name.$error.minlength"> | ||
Name must be at least 2 characters long | ||
</span> | ||
</div> | ||
<div class="form-group" ng-class="{'has-error': rc.fieldInvalid('surname'), 'has-success': rc.fieldValid('surname')}"> | ||
<label class="control-label" for="surname">Family name</label> | ||
<input class="form-control" name="surname" id="surname" type="text" ng-model="request.familyname" placeholder="Family name" | ||
required ng-minlength="2" /> | ||
<span class="help-block" ng-show="registrationForm.surname.$dirty && registrationForm.surname.$error.required">Please provide a family name</span> | ||
<span class="help-block" ng-show="registrationForm.surname.$dirty && registrationForm.surname.$error.minlength">Family name must be at least 2 characters long</span> | ||
</div> | ||
<div class="form-group" ng-class="{'has-error': rc.fieldInvalid('email'), 'has-success': rc.fieldValid('email')}"> | ||
<label class="control-label" for="email">Email</label> | ||
<input class="form-control" name="email" id="email" type="email" ng-model="request.email" placeholder="Email" required ng-minlength="3" | ||
iam-email-available-validator ng-model-options="{ debounce : { 'default' : 500 } }" /> | ||
<span class="help-block" ng-show="registrationForm.email.$dirty && registrationForm.email.$error.required"> | ||
</div> | ||
<div class="form-group" ng-class="{'has-error': rc.fieldInvalid('surname'), 'has-success': rc.fieldValid('surname')}"> | ||
<label class="control-label" for="surname">Family name</label> | ||
<input class="form-control" name="surname" id="surname" type="text" ng-model="request.familyname" placeholder="Your family name" required ng-minlength="2" /> | ||
<span class="help-block" ng-show="registrationForm.surname.$dirty && registrationForm.surname.$error.required">Please provide a family name</span> | ||
<span class="help-block" ng-show="registrationForm.surname.$dirty && registrationForm.surname.$error.minlength">Family name must be at least 2 characters long</span> | ||
</div> | ||
<div class="form-group" ng-class="{'has-error': rc.fieldInvalid('email'), 'has-success': rc.fieldValid('email')}"> | ||
<label class="control-label" for="email">Email</label> | ||
<input class="form-control" name="email" id="email" type="email" ng-model="request.email" placeholder="Your email address" required ng-minlength="3" iam-email-available-validator ng-model-options="{ debounce : { 'default' : 500 } }" /> | ||
<span class="help-block" ng-show="registrationForm.email.$dirty && registrationForm.email.$error.required"> | ||
Please provide an email | ||
</span> | ||
<span class="help-block" ng-show="registrationForm.email.$dirty && registrationForm.email.$error.email"> | ||
<span class="help-block" ng-show="registrationForm.email.$dirty && registrationForm.email.$error.email"> | ||
This is not a valid email | ||
</span> | ||
<span class="help-block" ng-show="registrationForm.email.$dirty && registrationForm.email.$error.emailAvailable"> | ||
<span class="help-block" ng-show="registrationForm.email.$dirty && registrationForm.email.$error.emailAvailable"> | ||
This email is already linked to another user | ||
</span> | ||
</div> | ||
<div class="form-group" ng-class="{'has-error': rc.fieldInvalid('username'), 'has-success': rc.fieldValid('username')}"> | ||
<label class="control-label" for="username">Username</label> | ||
<input class="form-control" id="username" name="username" type="text" ng-model="request.username" placeholder="Username" | ||
required ng-minlength="3" iam-username-available-validator ng-model-options="{ debounce : { 'default' : 500 } }" /> | ||
<span class="help-block" ng-show="registrationForm.username.$dirty && registrationForm.username.$error.required"> | ||
</div> | ||
<div class="form-group" ng-class="{'has-error': rc.fieldInvalid('username'), 'has-success': rc.fieldValid('username')}"> | ||
<label class="control-label" for="username">Username</label> | ||
<input class="form-control" id="username" name="username" type="text" ng-model="request.username" placeholder="Choose a username" required ng-minlength="3" iam-username-available-validator ng-model-options="{ debounce : { 'default' : 500 } }" /> | ||
<span class="help-block" ng-show="registrationForm.username.$dirty && registrationForm.username.$error.required"> | ||
Please choose a username</span> | ||
<span class="help-block" ng-show="registrationForm.username.$dirty && registrationForm.username.$error.minlength"> | ||
<span class="help-block" ng-show="registrationForm.username.$dirty && registrationForm.username.$error.minlength"> | ||
The username must be at least 3 characters long | ||
</span> | ||
<span class="help-block" ng-show="registrationForm.username.$dirty && registrationForm.username.$error.usernameAvailable"> | ||
<span class="help-block" ng-show="registrationForm.username.$dirty && registrationForm.username.$error.usernameAvailable"> | ||
This username is already linked to another user | ||
</span> | ||
</div> | ||
<div class="form-group"> | ||
<label class="control-label" for="notes">Notes</label> | ||
<textarea class="form-control" id="notes" name="notes" rows="5" placeholder="Registration reason (mandatory)" ng-model=request.notes required></textarea> | ||
<span class="help-block" ng-show="registrationForm.notes.$dirty && registrationForm.notes.$error.required"> | ||
Please writes a reason for your registration | ||
</div> | ||
<div class="form-group" ng-class="{'has-error': rc.fieldInvalid('notes'), 'has-success': rc.fieldValid('notes')}"> | ||
<label class="control-label" for="notes">Notes</label> | ||
<textarea class="form-control" id="notes" name="notes" rows="5" placeholder="Providing a clear explanation on the motivation behind this request will likely speed up the approval process" ng-model=request.notes required></textarea> | ||
<span class="help-block" ng-show="registrationForm.notes.$dirty && registrationForm.notes.$error.required"> | ||
Please provide a reason for your registration request | ||
</span> | ||
</div> | ||
<div ng-show="extAuthInfo != null"> | ||
<div class="form-group"> | ||
<label class="control-label">External authentication type</label> | ||
<div>{{extAuthInfo.type}}</div> | ||
<label class="control-label">External authentication provider</label> | ||
<div>{{extAuthInfo.issuer}}</div> | ||
<label class="control-label">Subject</label> | ||
<div>{{extAuthInfo.subject}}</div> | ||
</div> | ||
</div> | ||
<div class="form-group"> | ||
<button class="btn btn-primary" type="submit" name="register" ng-disabled="!registrationForm.$valid || submitDisabled" ng-click="rc.submit()"> | ||
</div> | ||
<div ng-show="extAuthInfo != null"> | ||
<div class="form-group"> | ||
<label class="control-label">External authentication type</label> | ||
<div>{{extAuthInfo.type}}</div> | ||
<label class="control-label">External authentication provider</label> | ||
<div>{{extAuthInfo.issuer}}</div> | ||
<label class="control-label">Subject</label> | ||
<div>{{extAuthInfo.subject}}</div> | ||
</div> | ||
</div> | ||
<div class="form-group"> | ||
<button class="btn btn-primary" type="submit" name="register" ng-disabled="!registrationForm.$valid || submitDisabled" ng-click="rc.submit()"> | ||
Register | ||
</button> | ||
<button class="btn btn-warning" type="button" name="reset" ng-click="rc.reset()" ng-disabled="registrationForm.$pristine"> | ||
<button class="btn btn-warning" type="button" name="reset" ng-click="rc.reset()" ng-disabled="registrationForm.$pristine"> | ||
Reset Form | ||
</button> | ||
</div> | ||
</form> | ||
</div> | ||
</form> | ||
</div> |