Changeset 7470

Timestamp:

10/23/2013 07:11:32 PM (13 years ago)

Author:

r-a-y

Message:

Scroll to top when clicking on bottom pagination links in BP loops.

If a user clicks on a pagination link located at the bottom of any BP loop
(members, groups), the loop will refresh with AJAX, but will not scroll to
the top of the page. This isn't so great for UX.

This commit adds the ability to scroll to top when a bottom-paginated
link is clicked.

In order for this to work, an additional parameter ('caller') was added to
the bp_filter_request() JS function to determine where the link was called
from.

Fixes #5206.

Location:

trunk

Files:

• bp-templates/bp-legacy/js/buddypress.js (modified) (4 diffs)
• bp-themes/bp-default/_inc/global.js (modified) (4 diffs)

trunk/bp-templates/bp-legacy/js/buddypress.js

@@ -750 +750 @@
                         var object = css_id[0];
                         var search_terms = false;
+                        var pagination_id = jq(target).closest('.pagination-links').attr('id');
 
                         if ( jq('div.dir-search input').length )
@@ -760 +761 @@
                         else
                                 var page_number = Number( jq(target).html() );
-
-                        bp_filter_request( object, jq.cookie('bp-' + object + '-filter'), jq.cookie('bp-' + object + '-scope'), 'div.' + object, search_terms, page_number, jq.cookie('bp-' + object + '-extras') );
+                        
+                        if ( pagination_id.indexOf( 'pag-bottom' ) !== -1 ) {
+                                var caller = 'pag-bottom';
+                        } else {
+                                var caller = null;
+                        }
+
+                        bp_filter_request( object, jq.cookie('bp-' + object + '-filter'), jq.cookie('bp-' + object + '-scope'), 'div.' + object, search_terms, page_number, jq.cookie('bp-' + object + '-extras'), caller );
 
                         return false;
@@ -1377 +1384 @@
 
 /* Filter the current content list (groups/members/blogs/topics) */
-function bp_filter_request( object, filter, scope, target, search_terms, page, extras ) {
+function bp_filter_request( object, filter, scope, target, search_terms, page, extras, caller ) {
         if ( 'activity' == object )
                 return false;
@@ -1424 +1431 @@
         function(response)
         {
-                jq(target).fadeOut( 100, function() {
-                        jq(this).html(response);
-                        jq(this).fadeIn(100);
-                });
+                /* animate to top if called from bottom pagination */
+                if ( caller == 'pag-bottom' && jq('#subnav').length ) {
+                        var top = jq('#subnav').parent();
+                        jq('html,body').animate({scrollTop: top.offset().top}, 'slow', function() {
+                                jq(target).fadeOut( 100, function() {
+                                        jq(this).html(response);
+                                        jq(this).fadeIn(100);
+                                });
+                        });     
+
+                } else {
+                        jq(target).fadeOut( 100, function() {
+                                jq(this).html(response);
+                                jq(this).fadeIn(100);
+                        });
+                }
+
                 jq('.item-list-tabs li.selected').removeClass('loading');
         });

trunk/bp-themes/bp-default/_inc/global.js

@@ -736 +736 @@
                         var object = css_id[0];
                         var search_terms = false;
+                        var pagination_id = jq(target).closest('.pagination-links').attr('id');
 
                         if ( jq('div.dir-search input').length )
@@ -746 +747 @@
                         else
                                 var page_number = Number( jq(target).html() );
-
-                        bp_filter_request( object, jq.cookie('bp-' + object + '-filter'), jq.cookie('bp-' + object + '-scope'), 'div.' + object, search_terms, page_number, jq.cookie('bp-' + object + '-extras') );
+                        
+                        if ( pagination_id.indexOf( 'pag-bottom' ) !== -1 ) {
+                                var caller = 'pag-bottom';
+                        } else {
+                                var caller = null;
+                        }
+
+                        bp_filter_request( object, jq.cookie('bp-' + object + '-filter'), jq.cookie('bp-' + object + '-scope'), 'div.' + object, search_terms, page_number, jq.cookie('bp-' + object + '-extras'), caller );
 
                         return false;
@@ -1343 +1350 @@
 
 /* Filter the current content list (groups/members/blogs/topics) */
-function bp_filter_request( object, filter, scope, target, search_terms, page, extras ) {
+function bp_filter_request( object, filter, scope, target, search_terms, page, extras, caller ) {
         if ( 'activity' == object )
                 return false;
@@ -1390 +1397 @@
         function(response)
         {
-                jq(target).fadeOut( 100, function() {
-                        jq(this).html(response);
-                        jq(this).fadeIn(100);
-                });
+                /* animate to top if called from bottom pagination */
+                if ( caller == 'pag-bottom' && jq('#subnav').length ) {
+                        var top = jq('#subnav').parent();
+                        jq('html,body').animate({scrollTop: top.offset().top}, 'slow', function() {
+                                jq(target).fadeOut( 100, function() {
+                                        jq(this).html(response);
+                                        jq(this).fadeIn(100);
+                                });
+                        });     
+
+                } else {
+                        jq(target).fadeOut( 100, function() {
+                                jq(this).html(response);
+                                jq(this).fadeIn(100);
+                        });
+                }
+
                 jq('.item-list-tabs li.selected').removeClass('loading');
         });