From 5d8f0a4cd0682b5fa1101f52c74702c62385072e Mon Sep 17 00:00:00 2001
From: nac26 <nac26@43c2fc9b-1942-4403-87b2-35b4218f7473>
Date: Thu, 3 Feb 2011 13:55:06 +0000
Subject: [PATCH] NIHVIVO-1995 Refactored scrolling behavior and added function
 to determine whether user has already scrolled past the top of the browse
 section. NIHVIVO-2007 Had to change <nav> for pagination to <div> because IE
 was choking on this for some reason. Wouldn't style it and also wouldn't act
 on the event listeners. As part of this work, also refactored the sequence in
 how new content replaces existing content on an Ajax request, which I think
 improves the experience during loading (NIHVIVO-1742).

---
 .../js/menupage/browseByVClassPeople.js       | 47 ++++++++++++-------
 themes/wilma/css/wilma.css                    |  8 ++--
 2 files changed, 33 insertions(+), 22 deletions(-)

diff --git a/productMods/js/menupage/browseByVClassPeople.js b/productMods/js/menupage/browseByVClassPeople.js
index a6c84063..a5e21112 100644
--- a/productMods/js/menupage/browseByVClassPeople.js
+++ b/productMods/js/menupage/browseByVClassPeople.js
@@ -20,20 +20,18 @@ browseByVClass.getIndividuals = function(vclassUri, alpha, page, scroll) {
         scroll = true;
     }
     
-    // First wipe currently displayed class heading, individuals, and existing pagination
-    $('h3.selected-class').remove();
-    this.individualsInVClass.empty();
-    $('nav.pagination').remove();
+    // Scroll to #menupage-intro page unless told otherwise
+    if ( scroll != false ) {
+        // only scroll back up if we're past the top of the #browse-by section
+        scrollPosition = browseByVClass.getPageScroll();
+        browseByOffset = $('#browse-by').offset();
+        if ( scrollPosition[1] > browseByOffset.top) {
+            $.scrollTo('#menupage-intro', 500);
+        }
+    }
     
     $.getJSON(url, function(results) {
-        // Check to see if we're dealing with pagination
-        if ( results.pages.length ) {
-            pages = results.pages;
-            browseByVClass.pagination(pages, page);
-        }
-        
-        selectedClassHeading = '<h3 class="selected-class">'+ results.vclass.name +'</h3>';
-        browseByVClass.individualsContainer.prepend(selectedClassHeading);
+        individualList = "";
         
         $.each(results.individuals, function(i, item) {
             label = results.individuals[i].label;
@@ -72,16 +70,29 @@ browseByVClass.getIndividuals = function(vclassUri, alpha, page, scroll) {
                 listItem += '<span class="title">'+ preferredTitle +'</span>';
             }
             listItem += '</li>';
-            browseByVClass.individualsInVClass.append(listItem);
+            // browseByVClass.individualsInVClass.append(listItem);
+            individualList += listItem;
         })
         
+        // First wipe currently displayed class heading, individuals, and existing pagination
+        $('h3.selected-class').remove();
+        browseByVClass.individualsInVClass.empty();
+        $('nav.pagination').remove();
+        
+        // And then add the new content
+        browseByVClass.individualsInVClass.append(individualList);
+        
+        // Check to see if we're dealing with pagination
+        if ( results.pages.length ) {
+            pages = results.pages;
+            browseByVClass.pagination(pages, page);
+        }
+        
+        selectedClassHeading = '<h3 class="selected-class">'+ results.vclass.name +'</h3>';
+        browseByVClass.individualsContainer.prepend(selectedClassHeading);
+        
         // set selected class, alpha and page
         browseByVClass.selectedVClass(results.vclass.URI);
         browseByVClass.selectedAlpha(alpha);
-        
-        // Scroll to #menupage-intro unless told otherwise
-        if ( scroll != false ) {
-            $.scrollTo('#menupage-intro', 500);
-        }
     });
 };
\ No newline at end of file
diff --git a/themes/wilma/css/wilma.css b/themes/wilma/css/wilma.css
index a954effe..8dc33067 100644
--- a/themes/wilma/css/wilma.css
+++ b/themes/wilma/css/wilma.css
@@ -1051,16 +1051,16 @@ ul#alpha-browse-individuals .count-classes {
     color: #5e6363;
     font-size: 1em;
 }
-nav.pagination.menupage {
+.pagination.menupage {
     font-size: .8em;
 }
-nav.pagination.menupage li.selected {
+.pagination.menupage li.selected {
     color: #5e6363;
 }
-nav.pagination.menupage li a {
+.pagination.menupage li a {
     text-decoration: none;
 }
-nav.pagination.menupage li a:hover {
+.pagination.menupage li a:hover {
     background: #5e6363;
 }