NIHVIVO-2279 Flesh out the UI for editing UserAccount, and associating with Individual Profiles
This commit is contained in:
j2blake
parent
50b159710b
commit
89a91757c0
7 changed files with 172 additions and 48 deletions
|
|
@ -9,6 +9,7 @@ var associateProfileFields = {
|
|||
if (this.disableFormInUnsupportedBrowsers()) {
|
||||
return;
|
||||
}
|
||||
|
||||
this.mixIn();
|
||||
this.initObjects();
|
||||
this.initPage();
|
||||
|
|
@ -44,17 +45,19 @@ var associateProfileFields = {
|
|||
this.associatedArea = $('#associated');
|
||||
this.associatedProfileNameSpan = $('#associatedProfileName');
|
||||
this.verifyAssociatedProfileLink = $('#verifyProfileLink');
|
||||
this.changeAssociatedProfileLink = $('#changeProfileLink');
|
||||
this.associatedProfileUriField = $('#associatedProfileUri')
|
||||
|
||||
// We want to associate a profile
|
||||
this.associationOptionsArea = $('#associationOptions');
|
||||
this.associateProfileNameField = $('#associateProfileName');
|
||||
},
|
||||
|
||||
// Initial page setup. Called only at page load.
|
||||
initPage: function() {
|
||||
this.checkForAssociatedProfile();
|
||||
|
||||
this.bindEventListeners();
|
||||
this.initAutocomplete();
|
||||
},
|
||||
|
||||
bindEventListeners: function() {
|
||||
|
|
@ -72,15 +75,48 @@ var associateProfileFields = {
|
|||
return false;
|
||||
});
|
||||
|
||||
this.changeAssociatedProfileLink.click(function() {
|
||||
associateProfileFields.associatedProfileUriField.val('');
|
||||
associateProfileFields.associateProfileNameField.val('');
|
||||
associateProfileFields.showExternalAuthIdNotRecognized();
|
||||
return false;
|
||||
});
|
||||
|
||||
},
|
||||
|
||||
initAutocomplete: function() {
|
||||
this.associateProfileNameField.autocomplete({
|
||||
minLength: 3,
|
||||
source: function(request, response) {
|
||||
$.ajax({
|
||||
url: associateProfileFields.ajaxUrl,
|
||||
dataType: 'json',
|
||||
data: {
|
||||
function: "autoCompleteProfile",
|
||||
term: request.term,
|
||||
externalAuthId: associateProfileFields.externalAuthIdField.val()
|
||||
},
|
||||
complete: function(xhr, status) {
|
||||
console.log('response text' + xhr.responseText);
|
||||
var results = jQuery.parseJSON(xhr.responseText);
|
||||
response(results);
|
||||
}
|
||||
});
|
||||
},
|
||||
select: function(event, ui) {
|
||||
associateProfileFields.showSelectedProfile(ui.item);
|
||||
}
|
||||
});
|
||||
|
||||
},
|
||||
|
||||
checkForAssociatedProfile: function() {
|
||||
$.ajax({
|
||||
url: associateProfileFields.ajaxUrl,
|
||||
dataType: "json",
|
||||
data: {
|
||||
function: "checkExternalAuth",
|
||||
userAccountUri: "",
|
||||
userAccountUri: associateProfileFields.userUri,
|
||||
externalAuthId: associateProfileFields.externalAuthIdField.val()
|
||||
},
|
||||
complete: function(xhr, status) {
|
||||
|
|
@ -88,7 +124,7 @@ var associateProfileFields = {
|
|||
if (results.idInUse) {
|
||||
associateProfileFields.showExternalAuthIdInUse()
|
||||
} else if (results.matchesProfile) {
|
||||
associateProfileFields.showExternalAuthIdMatchesProfile(results.profileUri, results.profileUri, results.profileLabel)
|
||||
associateProfileFields.showExternalAuthIdMatchesProfile(results.profileUri, results.profileUrl, results.profileLabel)
|
||||
} else {
|
||||
associateProfileFields.showExternalAuthIdNotRecognized()
|
||||
}
|
||||
|
|
@ -122,13 +158,17 @@ var associateProfileFields = {
|
|||
this.externalAuthIdInUseMessage.hide();
|
||||
this.associatedArea.hide();
|
||||
|
||||
if (this.externalAuthIdField.val().length > 0) {
|
||||
if (this.associationEnabled && this.externalAuthIdField.val().length > 0) {
|
||||
this.associationOptionsArea.show();
|
||||
} else {
|
||||
this.associationOptionsArea.hide();
|
||||
}
|
||||
},
|
||||
|
||||
showSelectedProfile: function(item) {
|
||||
this.showExternalAuthIdMatchesProfile(item.uri, item.url, item.label);
|
||||
},
|
||||
|
||||
}
|
||||
|
||||
$(document).ready(function() {
|
||||
|
|
|
|||
|
|
@ -68,6 +68,8 @@
|
|||
<label for="external-auth-id">External authorization ID</label>
|
||||
<input type="text" name="externalAuthId" value="${externalAuthId}" id="external-auth-id" role="input "/>
|
||||
|
||||
<#include "userAccounts-associateProfilePanel.ftl">
|
||||
|
||||
<p>Roles<span class="requiredHint"> *</span> </p>
|
||||
<#list roles as role>
|
||||
<input type="radio" name="role" value="${role.uri}" role="radio" <#if selectedRole = role.uri>checked</#if> />
|
||||
|
|
@ -75,31 +77,28 @@
|
|||
<br />
|
||||
</#list>
|
||||
|
||||
<#if !emailIsEnabled??>
|
||||
<label for="initial-password">Initial password<span class="requiredHint"> *</span></label>
|
||||
<input type="password" name="initialPassword" value="${initialPassword}" id="initial-password" role="input "/>
|
||||
|
||||
<p>Minimum of ${minimumLength} characters in length.</p>
|
||||
|
||||
<label for="confirm-password">Confirm initial password<span class="requiredHint"> *</span></label>
|
||||
<input type="text" name="confirmPassword" value="${confirmPassword}" id="confirm-password" role="input "/>
|
||||
</#if>
|
||||
|
||||
<p>Associate a profile with this account</p>
|
||||
<input type="radio" name="associate" value="yes" role="radio" <#if associate??>checked</#if> id="associate" />
|
||||
<label class="inline" for="associate"> Yes</label>
|
||||
|
||||
<input type="radio" name="associate" value="no" role="radio" <#if !associate??>checked</#if> id="no-associate" />
|
||||
<label class="inline" for="no-associate"> No</label>
|
||||
|
||||
<#if emailIsEnabled??>
|
||||
<p class="note">
|
||||
Note: An email will be sent to the address entered above
|
||||
notifying that an account has been created.
|
||||
It will include instructions for activating the account and creating a password.
|
||||
</p>
|
||||
<#else>
|
||||
<table>
|
||||
<tr>
|
||||
<td>
|
||||
<label for="initial-password">Initial password<span class="requiredHint"> *</span></label>
|
||||
<input type="password" name="initialPassword" value="${initialPassword}" id="initial-password" role="input "/>
|
||||
</td>
|
||||
<td>
|
||||
<label for="confirm-password">Confirm initial password<span class="requiredHint"> *</span></label>
|
||||
<input type="password" name="confirmPassword" value="${confirmPassword}" id="confirm-password" role="input" />
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
<p>Minimum of ${minimumLength} characters in length.</p>
|
||||
</#if>
|
||||
|
||||
|
||||
<input type="submit" name="submitAdd" value="Add new account" class="submit"/> or <a class="cancel" href="${formUrls.list}">Cancel</a>
|
||||
|
||||
<p class="requiredHint">* required fields</p>
|
||||
|
|
|
|||
|
|
@ -21,6 +21,7 @@
|
|||
<label for="associatedProfileName">Associated profile:</label>
|
||||
<span class="acSelectionInfo" id="associatedProfileName"></span>
|
||||
<a href="" id="verifyProfileLink">(verify this match)</a>
|
||||
<a href="" id="changeProfileLink">(change profile)</a>
|
||||
</p>
|
||||
<input type="hidden" id="associatedProfileUri" name="associatedProfileUri" value="" />
|
||||
</div>
|
||||
|
|
@ -36,7 +37,9 @@
|
|||
<label for="">Create an associated profile</label>
|
||||
<select name="degreeUri" id="degreeUri" >
|
||||
<option value="" selected="selected">Select one</option>
|
||||
<option value="" disabled>Bogus</option>
|
||||
<#list profileTypes?keys as key>
|
||||
<option value="${key}" >${profileTypes[key]}</option>
|
||||
</#list>
|
||||
</select>
|
||||
</p>
|
||||
</div>
|
||||
|
|
@ -47,9 +50,20 @@
|
|||
|
||||
<script type="text/javascript">
|
||||
var associateProfileFieldsData = {
|
||||
ajaxUrl: '${formUrls.accountsAjax}'
|
||||
<#if userUri??>
|
||||
userUri: '${userUri}' ,
|
||||
<#else>
|
||||
userUri: '' ,
|
||||
</#if>
|
||||
|
||||
<#if showAssociation??>
|
||||
associationEnabled: true ,
|
||||
ajaxUrl: '${formUrls.accountsAjax}'
|
||||
</#if>
|
||||
};
|
||||
</script>
|
||||
|
||||
${scripts.add('<script type="text/javascript" src="${urls.base}/js/account/accountAssociateProfile.js"></script>')}
|
||||
${scripts.add('<script type="text/javascript" src="${urls.base}/js/jquery.js"></script>',
|
||||
'<script type="text/javascript" src="${urls.base}/js/jquery-ui/js/jquery-ui-1.8.9.custom.min.js"></script>',
|
||||
'<script type="text/javascript" src="${urls.base}/js/account/accountAssociateProfile.js"></script>')}
|
||||
|
||||
|
|
|
|||
|
|
@ -86,14 +86,20 @@
|
|||
be reset until the user follows the link provided in this email.
|
||||
</p>
|
||||
<#else>
|
||||
<label for="new-password">New password<span class="requiredHint"> *</span></label>
|
||||
<input type="password" name="newPassword" value="${newPassword}" id="new-password" role="input" />
|
||||
|
||||
<table>
|
||||
<tr>
|
||||
<td>
|
||||
<label for="new-password">New password<span class="requiredHint"> *</span></label>
|
||||
<input type="password" name="newPassword" value="${newPassword}" id="new-password" role="input" />
|
||||
</td>
|
||||
<td>
|
||||
<label for="confirm-password">Confirm initial password<span class="requiredHint"> *</span></label>
|
||||
<input type="password" name="confirmPassword" value="${confirmPassword}" id="confirm-password" role="input" />
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
<p>Minimum of ${minimumLength} characters in length.</p>
|
||||
<p>Leaving this blank means that the password will not be changed.</p>
|
||||
|
||||
<label for="confirm-password">Confirm initial password<span class="requiredHint"> *</span></label>
|
||||
<input type="password" name="confirmPassword" value="${confirmPassword}" id="confirm-password" role="input" />
|
||||
</#if>
|
||||
|
||||
<input type="submit" name="submitEdit" value="Save changes" class="submit" /> or <a class="cancel" href="${formUrls.list}">Cancel</a>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue