NIHVIVO-2819 Rewrite accountAssociateProfile.js to improve the logic and enhance the function - mostly in preserving user choices in a re-display of the form.

webapp/src/edu/cornell/mannlib/vitro/webapp/controller/accounts/UserAccountsPage.java

@@ -21,6 +21,7 @@ import org.apache.commons.logging.LogFactory;
 import com.hp.hpl.jena.ontology.OntModel;
 
 import edu.cornell.mannlib.vitro.webapp.beans.ApplicationBean;
+import edu.cornell.mannlib.vitro.webapp.beans.Individual;
 import edu.cornell.mannlib.vitro.webapp.beans.PermissionSet;
 import edu.cornell.mannlib.vitro.webapp.beans.UserAccount;
 import edu.cornell.mannlib.vitro.webapp.beans.VClass;
@@ -141,9 +142,9 @@ public abstract class UserAccountsPage {
 		String seedClassUri = PERSON_CLASS_URI;
 		List<String> classUris = vclassDao.getAllSubClassURIs(seedClassUri);
 		classUris.add(seedClassUri);
-		
+
 		SortedMap<String, String> types = new TreeMap<String, String>();
-		for (String classUri: classUris) {
+		for (String classUri : classUris) {
 			VClass vclass = vclassDao.getVClassByURI(classUri);
 			if (vclass != null) {
 				types.put(classUri, vclass.getName());
@@ -188,8 +189,41 @@ public abstract class UserAccountsPage {
 	}
 
 	protected String getSiteName() {
-        ApplicationBean appBean = vreq.getAppBean();
+		ApplicationBean appBean = vreq.getAppBean();
-        return appBean.getApplicationName();		    
+		return appBean.getApplicationName();
 	}
 
+	protected ProfileInfo buildProfileInfo(String uri) {
+		Individual ind = indDao.getIndividualByURI(uri);
+		if (ind == null) {
+			return null;
+		} else {
+			return new ProfileInfo(ind.getRdfsLabel(), uri,
+					UrlBuilder.getIndividualProfileUrl(uri, vreq));
+		}
+	}
+
+	public static class ProfileInfo {
+		private final String label;
+		private final String uri;
+		private final String url;
+
+		public ProfileInfo(String label, String uri, String url) {
+			this.label = label;
+			this.uri = uri;
+			this.url = url;
+		}
+
+		public String getLabel() {
+			return label;
+		}
+
+		public String getUri() {
+			return uri;
+		}
+
+		public String getUrl() {
+			return url;
+		}
+	}
 }

webapp/src/edu/cornell/mannlib/vitro/webapp/controller/accounts/admin/UserAccountsAddPage.java

@@ -195,6 +195,11 @@ public class UserAccountsAddPage extends UserAccountsPage {
 		body.put(PARAMETER_NEW_PROFILE_CLASS_URI, newProfileClassUri);
 		body.put("formUrls", buildUrlsMap());
 
+		if (!associatedProfileUri.isEmpty()) {
+			body.put("associatedProfileInfo",
+					buildProfileInfo(associatedProfileUri));
+		}
+
 		if (!errorCode.isEmpty()) {
 			body.put(errorCode, Boolean.TRUE);
 		}

webapp/src/edu/cornell/mannlib/vitro/webapp/controller/accounts/admin/UserAccountsEditPage.java

@@ -4,12 +4,14 @@ package edu.cornell.mannlib.vitro.webapp.controller.accounts.admin;
 
 import java.util.Collections;
 import java.util.HashMap;
+import java.util.List;
 import java.util.Map;
 import java.util.Set;
 
 import org.apache.commons.logging.Log;
 import org.apache.commons.logging.LogFactory;
 
+import edu.cornell.mannlib.vitro.webapp.beans.Individual;
 import edu.cornell.mannlib.vitro.webapp.beans.SelfEditingConfiguration;
 import edu.cornell.mannlib.vitro.webapp.beans.UserAccount;
 import edu.cornell.mannlib.vitro.webapp.controller.VitroRequest;
@@ -187,6 +189,11 @@ public class UserAccountsEditPage extends UserAccountsPage {
 			body.put("lastName", lastName);
 			body.put("selectedRole", selectedRoleUri);
 			body.put(PARAMETER_NEW_PROFILE_CLASS_URI, newProfileClassUri);
+
+			if (!associatedProfileUri.isEmpty()) {
+				body.put("associatedProfileInfo",
+						buildProfileInfo(associatedProfileUri));
+			}
 		} else {
 			body.put("emailAddress", userAccount.getEmailAddress());
 			body.put("externalAuthId", userAccount.getExternalAuthId());
@@ -194,6 +201,13 @@ public class UserAccountsEditPage extends UserAccountsPage {
 			body.put("lastName", userAccount.getLastName());
 			body.put("selectedRole", getExistingRoleUri());
 			body.put(PARAMETER_NEW_PROFILE_CLASS_URI, "");
+
+			List<Individual> associatedInds = SelfEditingConfiguration.getBean(
+					vreq).getAssociatedIndividuals(indDao, userAccount);
+			if (!associatedInds.isEmpty()) {
+				body.put("associatedProfileInfo",
+						buildProfileInfo(associatedInds.get(0).getURI()));
+			}
 		}
 
 		if (!isRootUser()) {

webapp/web/js/account/accountAssociateProfile.js

@@ -1,18 +1,15 @@
 /* $This file is distributed under the terms of the license in /doc/license.txt$ */
 
 var associateProfileFields = {
-
-    /* *** Initial page setup *** */
-   
     onLoad: function() {
-        //console.log('Here we are');
         if (this.disableFormInUnsupportedBrowsers()) {
             return;
         }        
 
         this.mixIn();
-        this.initObjects();                 
+        this.initObjectReferences();                 
-        this.initPage();       
+        this.bindEventListeners();
+        this.setInitialState();       
     },
 
     disableFormInUnsupportedBrowsers: function() {       
@@ -33,8 +30,7 @@ var associateProfileFields = {
         $.extend(this, associateProfileFieldsData);
     },
     
-    // On page load, create references for easy access to form elements.
+    initObjectReferences: function() {
-    initObjects: function() {
         this.form = $('#userAccountForm');
         
         // The external auth ID field and messages
@@ -51,26 +47,18 @@ var associateProfileFields = {
         // We want to associate a profile
         this.associationOptionsArea = $('#associationOptions');
         this.associateProfileNameField = $('#associateProfileName');
-
+        this.newProfileClassSelector = $('#degreeUri');
+        
         // Container <div> elements to provide background shading -- tlw72
         this.associateProfileBackgroundOneArea = $('#associateProfileBackgroundOne');
     },
-    
-    // Initial page setup. Called only at page load.
-    initPage: function() {
-        this.checkForAssociatedProfile();
-        this.bindEventListeners();
-        this.initAutocomplete();
-    },
-    
-    bindEventListeners: function() {
-        //console.log('bindEventListeners');
 
+    bindEventListeners: function() {
         this.externalAuthIdField.change(function() {
-            associateProfileFields.checkForAssociatedProfile();
+            associateProfileFields.externalAuthIdFieldHasChanged();
         }); 
         this.externalAuthIdField.keyup(function() {
-            associateProfileFields.checkForAssociatedProfile();
+            associateProfileFields.externalAuthIdFieldHasChanged();
         }); 
         
         this.verifyAssociatedProfileLink.click(function() {
@@ -79,15 +67,15 @@ var associateProfileFields = {
         });   
         
         this.changeAssociatedProfileLink.click(function() {
-            associateProfileFields.associatedProfileUriField.val('');
+            associateProfileFields.showAssociatingOptionsArea();
-            associateProfileFields.associateProfileNameField.val('');
-            associateProfileFields.showExternalAuthIdNotRecognized();
             return false;
         });   
         
-    },
+        this.newProfileClassSelector.change(function() {
-    
+            console.log('selector has changed.')
-    initAutocomplete: function() {
+            associateProfileFields.newProfileClassHasChanged();
+        });
+        
         this.associateProfileNameField.autocomplete({
             minLength: 3,
             source: function(request, response) {
@@ -100,20 +88,35 @@ var associateProfileFields = {
                         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); 
+                associateProfileFields.showAssociatedProfileArea(ui.item.label, ui.item.uri, ui.item.url); 
             }
         });
 
+        
     },
+    
+    setInitialState: function() {
+        if (this.externalAuthIdField.val().length == 0) {
+            this.hideAllOptionals();
+        } else if (this.associatedProfileInfo) {
+            this.showAssociatedProfileArea(this.associatedProfileInfo.label, this.associatedProfileInfo.uri, this.associatedProfileInfo.url);
+        } else {
+            this.showAssociatingOptionsArea();
+        }
+    },
+    
+    externalAuthIdFieldHasChanged: function() {
+        if (this.externalAuthIdField.val().length == 0) {
+            this.hideAllOptionals();
+            return;
+        }
 
-    checkForAssociatedProfile: function() {
         $.ajax({
             url: associateProfileFields.ajaxUrl,
             dataType: "json",
@@ -125,59 +128,77 @@ var associateProfileFields = {
             complete: function(xhr, status) {
                 var results = $.parseJSON(xhr.responseText);
                 if (results.idInUse) {
-                    associateProfileFields.showExternalAuthIdInUse()
+                    associateProfileFields.showExternalAuthInUseMessage()
                 } else if (results.matchesProfile) {
-                    associateProfileFields.showExternalAuthIdMatchesProfile(results.profileUri, results.profileUrl, results.profileLabel)
+                    associateProfileFields.showAssociatedProfileArea(results.profileLabel, results.profileUri, results.profileUrl)
                 } else {
-                    associateProfileFields.showExternalAuthIdNotRecognized()
+                    associateProfileFields.showAssociatingOptionsArea();
                 }
             }
         });
     },
-
+    
     openVerifyWindow: function() {
         window.open(this.verifyUrl, 'verifyMatchWindow', 'width=640,height=640,scrollbars=yes,resizable=yes,status=yes,toolbar=no,menubar=no,location=no');
     },
-        
+    
-    showExternalAuthIdInUse: function() {
+    newProfileClassHasChanged: function() {
-        this.externalAuthIdInUseMessage.show();
+        if (this.newProfileClassSelector.val().length == 0) {
-        this.associatedArea.hide();
+            this.associateProfileNameField.disabled = false;
-        this.associationOptionsArea.hide();
-        this.associateProfileBackgroundOneArea.css("background-color","#fff");
-        this.associateProfileBackgroundOneArea.css("border","none");
-    },
- 
-    showExternalAuthIdMatchesProfile: function(profileUri, profileUrl, profileLabel) {
-        //console.log('showExternalAuthIdMatchesProfile: profileUri=' + profileUri + ', profileUrl=' + profileUrl + ', profileLabel='+ profileLabel);
-
-        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);
-        this.verifyUrl = profileUrl;
-    },
-       
-    showExternalAuthIdNotRecognized: function() {
-        this.externalAuthIdInUseMessage.hide();
-        this.associatedArea.hide();
-        
-        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.associateProfileNameField.val('');
-            this.associateProfileBackgroundOneArea.css("background-color","#fff");
+            this.associateProfileNameField.disabled = true;
-            this.associateProfileBackgroundOneArea.css("border","none");
         }
     },
+    
+    hideAllOptionals: function() {
+        this.hideExternalAuthInUseMessage();
+        this.hideAssociatedProfileArea();
+        this.hideAssociatingOptionsArea();
+    },
+    
+    hideExternalAuthInUseMessage: function() {
+        this.externalAuthIdInUseMessage.hide();
+    },
+    
+    hideAssociatedProfileArea: function() {
+        this.associatedArea.hide();
+        this.associatedProfileUriField.val('');
+    },
+    
+    hideAssociatingOptionsArea: function() {
+        this.associationOptionsArea.hide();
+        this.associateProfileNameField.val('');
+        this.newProfileClassSelector.selectedIndex = 0;
+    },
+    
+    showExternalAuthInUseMessage: function() {
+        this.hideAssociatedProfileArea();
+        this.hideAssociatingOptionsArea();
 
-    showSelectedProfile: function(item) {
+        this.externalAuthIdInUseMessage.show();
-    	this.showExternalAuthIdMatchesProfile(item.uri, item.url, item.label);
+    },
+    
+    showAssociatedProfileArea: function(name, uri, url) {
+        this.hideExternalAuthInUseMessage();
+        this.hideAssociatingOptionsArea();
+
+        if (this.associationEnabled) {
+            this.associatedProfileNameSpan.html(name);
+            this.associatedProfileUriField.val(uri);
+            this.verifyUrl = url;
+            this.associatedArea.show();
+        }
+    },
+    
+    showAssociatingOptionsArea: function() {
+        this.hideExternalAuthInUseMessage();
+        this.hideAssociatedProfileArea();
+
+        if (this.associationEnabled) {
+            this.newProfileClassHasChanged();
+            this.associationOptionsArea.show();
+        }
     },
     
 }

webapp/web/templates/freemarker/body/accounts/userAccounts-associateProfilePanel.ftl

@@ -41,7 +41,7 @@ ${stylesheets.add('<link rel="stylesheet" href="${urls.base}/edit/forms/css/auto
                 <select name="degreeUri" id="degreeUri" >
                     <option value="" selected="selected">Select one</option>
                     <#list profileTypes?keys as key>
-                        <option value="${key}" >${profileTypes[key]}</option>           
+                        <option value="${key}" <#if degreeUri = key> selected </#if> >${profileTypes[key]}</option>           
                     </#list>    
                 </select>    
             </p>
@@ -56,6 +56,18 @@ var associateProfileFieldsData = {
         userUri: '' ,
     </#if>
     
+    <#if associationIsReset??>
+        associationIsReset: 'true' ,
+    </#if>
+    
+    <#if associatedProfileInfo??>
+        associatedProfileInfo: {
+            label: '${associatedProfileInfo.label}',
+            uri: '${associatedProfileInfo.uri}',
+            url: '${associatedProfileInfo.url}'
+        },
+    </#if>
+    
     <#if showAssociation??>
         associationEnabled: true ,
         ajaxUrl: '${formUrls.accountsAjax}'