NIHVIVO-2829: chages template, css and minor js addition for account profile association
This commit is contained in:
tworrall
parent
53d6dc7019
commit
a0e962774e
5 changed files with 131 additions and 56 deletions
|
|
@ -27,31 +27,22 @@ table#account th {
|
|||
background-color: #F7F9F9;
|
||||
height: 40px;
|
||||
color: #064D68;
|
||||
padding-top: 5px;
|
||||
padding-top: 7px;
|
||||
border: 1px solid #d9e4ea;
|
||||
border-bottom: none;
|
||||
padding-left: 6px;
|
||||
font-size: .9em;
|
||||
}
|
||||
table#account th {
|
||||
text-align: left;
|
||||
} /*Fix for IE8 and 9, force text in a cell to be aligned to the left*/
|
||||
table#account tr {
|
||||
background-color: #fff;
|
||||
}
|
||||
table#account tr:nth-child(2n) {
|
||||
background-color: rgba(200, 200, 180,.25);
|
||||
}
|
||||
table#account td {
|
||||
vertical-align: top;
|
||||
padding: .5em;
|
||||
border: 1px solid #d9e4ea;
|
||||
font-size: .825em;
|
||||
padding-top: .5em;
|
||||
padding-bottom: .5em;
|
||||
font-size: .9em;
|
||||
}
|
||||
table#account tr {
|
||||
background-color: #fff;
|
||||
}
|
||||
table#account td a{
|
||||
word-wrap: break-word;
|
||||
table#account tr:nth-child(2n+1) {
|
||||
background-color: rgba(200, 200, 180,.25);
|
||||
}
|
||||
#filter-roles {
|
||||
float: left;
|
||||
|
|
@ -170,18 +161,14 @@ padding-right: 5px;
|
|||
}
|
||||
#associated {
|
||||
float:right;
|
||||
margin-top:-98px;
|
||||
margin-right:80px;
|
||||
display:none;
|
||||
display:none;
|
||||
}
|
||||
#associated label {
|
||||
margin-bottom:5px;
|
||||
}
|
||||
#associationOptions {
|
||||
float:right;
|
||||
margin-top:-98px;
|
||||
margin-right:80px;
|
||||
display:none;
|
||||
display:none;
|
||||
}
|
||||
#verifyProfileLink {
|
||||
margin-left:10px;
|
||||
|
|
@ -189,3 +176,68 @@ padding-right: 5px;
|
|||
#externalAuthIdInUse {
|
||||
color: #f70;
|
||||
}
|
||||
#associateProfileBackgroundOne {
|
||||
background-color:#fff;
|
||||
padding:5px 0 5px 0;
|
||||
margin-left:-8px;
|
||||
margin-right:-8px;
|
||||
padding-top:7px;
|
||||
width:100%;
|
||||
border:none;
|
||||
border-right:none;
|
||||
border-bottom-left-radius: 5px;
|
||||
border-top-left-radius: 5px;
|
||||
-moz-border-radius-bottomleft: 5px;
|
||||
-moz-border-radius-topleft: 5px;
|
||||
-webkit-border-bottom-left-radius: 5px;
|
||||
-webkit-border-top-left-radius: 5px;
|
||||
}
|
||||
#associateProfileBackgroundTwo {
|
||||
background-color:#f1f2ee;
|
||||
padding-top:7px;
|
||||
padding-bottom:42px;
|
||||
padding-right:94px;
|
||||
margin-top:-112px;
|
||||
margin-right:-8px;
|
||||
border:1px solid #ccc;
|
||||
border-left:none;
|
||||
border-top-right-radius: 5px;
|
||||
-moz-border-radius-topright: 5px;
|
||||
-webkit-border-top-right-radius: 5px;
|
||||
border-bottom-right-radius: 5px;
|
||||
-moz-border-radius-bottomright: 5px;
|
||||
-webkit-border-bottom-right-radius: 5px;
|
||||
}
|
||||
#associateProfileBackgroundThree {
|
||||
background-color:#f1f2ee;
|
||||
padding-left:12px;
|
||||
padding-top:7px;
|
||||
padding-bottom:26px;
|
||||
padding-right:94px;
|
||||
margin-top:-112px;
|
||||
margin-left:-12px;
|
||||
margin-right:-8px;
|
||||
border:1px solid #ccc;
|
||||
border-left:none;
|
||||
border-bottom:none;
|
||||
border-top-right-radius: 5px;
|
||||
-moz-border-radius-topright: 5px;
|
||||
-webkit-border-top-right-radius: 5px;
|
||||
}
|
||||
#associateProfileBackgroundFour {
|
||||
background-color:#f1f2ee;
|
||||
padding-left:12px;
|
||||
padding-bottom:26px;
|
||||
padding-right:94px;
|
||||
margin-top:-8px;
|
||||
margin-left:-12px;
|
||||
margin-right:-8px;
|
||||
border:1px solid #ccc;
|
||||
border-top:none;
|
||||
border-bottom-left-radius: 5px;
|
||||
border-bottom-right-radius: 5px;
|
||||
-moz-border-radius-bottomleft: 5px;
|
||||
-moz-border-radius-bottomright: 5px;
|
||||
-webkit-border-bottom-left-radius: 5px;
|
||||
-webkit-border-bottom-right-radius: 5px;
|
||||
}
|
||||
|
|
@ -51,6 +51,9 @@ var associateProfileFields = {
|
|||
// We want to associate a profile
|
||||
this.associationOptionsArea = $('#associationOptions');
|
||||
this.associateProfileNameField = $('#associateProfileName');
|
||||
|
||||
// Container <div> elements to provide background shading -- tlw72
|
||||
this.associateProfileBackgroundOneArea = $('#associateProfileBackgroundOne');
|
||||
},
|
||||
|
||||
// Initial page setup. Called only at page load.
|
||||
|
|
@ -140,6 +143,8 @@ var associateProfileFields = {
|
|||
this.externalAuthIdInUseMessage.show();
|
||||
this.associatedArea.hide();
|
||||
this.associationOptionsArea.hide();
|
||||
this.associateProfileBackgroundOneArea.css("background-color","#fff");
|
||||
this.associateProfileBackgroundOneArea.css("border","none");
|
||||
},
|
||||
|
||||
showExternalAuthIdMatchesProfile: function(profileUri, profileUrl, profileLabel) {
|
||||
|
|
@ -148,6 +153,8 @@ var associateProfileFields = {
|
|||
this.externalAuthIdInUseMessage.hide();
|
||||
this.associatedArea.show();
|
||||
this.associationOptionsArea.hide();
|
||||
this.associateProfileBackgroundOneArea.css("background-color","#f1f2ee");
|
||||
this.associateProfileBackgroundOneArea.css("border","1px solid #ccc");
|
||||
|
||||
this.associatedProfileNameSpan.html(profileLabel);
|
||||
this.associatedProfileUriField.val(profileUri);
|
||||
|
|
@ -160,8 +167,12 @@ var associateProfileFields = {
|
|||
|
||||
if (this.associationEnabled && this.externalAuthIdField.val().length > 0) {
|
||||
this.associationOptionsArea.show();
|
||||
this.associateProfileBackgroundOneArea.css("background-color","#f1f2ee");
|
||||
this.associateProfileBackgroundOneArea.css("border","1px solid #ccc");
|
||||
} else {
|
||||
this.associationOptionsArea.hide();
|
||||
this.associateProfileBackgroundOneArea.css("background-color","#fff");
|
||||
this.associateProfileBackgroundOneArea.css("border","none");
|
||||
}
|
||||
},
|
||||
|
||||
|
|
|
|||
|
|
@ -74,7 +74,7 @@
|
|||
<#if emailIsEnabled??>
|
||||
<p class="note">
|
||||
Note: An email will be sent to the address entered above
|
||||
notifying the user that an account has been created.
|
||||
notifying that an account has been created.
|
||||
It will include instructions for activating the account and creating a password.
|
||||
</p>
|
||||
<#else>
|
||||
|
|
@ -84,15 +84,16 @@
|
|||
<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> </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 class="explanatoryText" style="margin-top:-8px">Minimum of ${minimumLength} characters in length.</p>
|
||||
</#if>
|
||||
|
||||
<br />
|
||||
<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>
|
||||
|
|
|
|||
|
|
@ -2,40 +2,50 @@
|
|||
|
||||
<#-- Template for setting the account reference field, which can also associate a profile with the user account -->
|
||||
|
||||
${stylesheets.add('<link rel="stylesheet" href="${urls.base}/edit/forms/css/autocomplete.css"" />',
|
||||
'<link rel="stylesheet" href="${urls.base}/js/jquery-ui/css/smoothness/jquery-ui-1.8.9.custom.css"" />')}
|
||||
${stylesheets.add('<link rel="stylesheet" href="${urls.base}/edit/forms/css/autocomplete.css" />',
|
||||
'<link rel="stylesheet" href="${urls.base}/js/jquery-ui/css/smoothness/jquery-ui-1.8.9.custom.css" />')}
|
||||
|
||||
<label for="externalAuthId">External Auth. ID / Matching ID</label>
|
||||
<input type="text" name="externalAuthId" value="${externalAuthId}" id="externalAuthId" role="input "/>
|
||||
<span id="externalAuthIdInUse" style="display: none;" >This Account Reference is already in use.</span>
|
||||
<p class="explanatoryText" style="margin-top:-8px">Can be used to associate the account with the user's profile via the matching property.</p>
|
||||
<div id="associateProfileBackgroundOne">
|
||||
<div style="margin-left:8px">
|
||||
<label for="externalAuthId">External Auth. ID / Matching ID</label>
|
||||
<input type="text" name="externalAuthId" value="${externalAuthId}" id="externalAuthId" role="input "/>
|
||||
<span id="externalAuthIdInUse" style="display: none;" >This Account Reference is already in use.</span>
|
||||
<p class="explanatoryText" style="margin-top:-8px">Can be used to associate the account with the user's profile via the matching property.</p>
|
||||
</div>
|
||||
</div>
|
||||
<#-- If there is an associated profile, show these -->
|
||||
<div id="associated">
|
||||
<p>
|
||||
<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 id="associateProfileBackgroundTwo">
|
||||
<p>
|
||||
<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>
|
||||
</div>
|
||||
|
||||
<#-- If we haven't selected one, show these instead -->
|
||||
<div id="associationOptions">
|
||||
<p>
|
||||
<label for="associateProfileName">Select the associated profile</label>
|
||||
<input type="text" id="associateProfileName" name="associateProfileName" class="acSelector" size="35">
|
||||
</p>
|
||||
<p> - or - </p>
|
||||
<p>
|
||||
<label for="">Create the associated profile</label>
|
||||
<select name="degreeUri" id="degreeUri" >
|
||||
<option value="" selected="selected">Select one</option>
|
||||
<#list profileTypes?keys as key>
|
||||
<option value="${key}" >${profileTypes[key]}</option>
|
||||
</#list>
|
||||
</select>
|
||||
</p>
|
||||
<div id="associateProfileBackgroundThree">
|
||||
<p>
|
||||
<label for="associateProfileName">Select the associated profile</label>
|
||||
<input type="text" id="associateProfileName" name="associateProfileName" class="acSelector" size="35">
|
||||
</p>
|
||||
</div>
|
||||
<div id="associateProfileBackgroundFour">
|
||||
<p> - or - </p>
|
||||
<p>
|
||||
<label for="">Create the associated profile</label>
|
||||
<select name="degreeUri" id="degreeUri" >
|
||||
<option value="" selected="selected">Select one</option>
|
||||
<#list profileTypes?keys as key>
|
||||
<option value="${key}" >${profileTypes[key]}</option>
|
||||
</#list>
|
||||
</select>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript">
|
||||
|
|
|
|||
|
|
@ -89,16 +89,17 @@
|
|||
<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> </td>
|
||||
<td>
|
||||
<label for="confirm-password">Confirm initial password<span class="requiredHint"> *</span></label>
|
||||
<label for="confirm-password">Confirm new 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>
|
||||
<p class="explanatoryText" style="margin-top:-8px">Minimum of ${minimumLength} characters in length.</p>
|
||||
<p class="explanatoryText">Leaving this blank means that the password will not be changed.</p>
|
||||
</#if>
|
||||
|
||||
<br />
|
||||
<input type="submit" name="submitEdit" value="Save changes" class="submit" /> or <a class="cancel" href="${formUrls.list}">Cancel</a>
|
||||
|
||||
<p class="requiredHint">* required fields</p>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue