bp activity loader plugin install needs container info to work

This topic has 12 replies, 2 voices, and was last updated 9 years by Norman.

Author

Tagged: container info infinite scroll, bp activity loader

November 30, 2014 at 05:59 #37079

Participant

hi I am trying to set up the bp activity loader plugin. ( infinite scroll )

I think it also works well with KLEO, but in need to know which is the container for the main activity content, that usually appears when I click on load more.

this is the best hint I found on the net, but i couldn’t find the right content class
”
FIND YOUR selector for the container you need to have auto-load for BuddyPress Activity page…
The default in the file is #content (that is to say, id content), but for my theme, it is .content (class content, so I had to change the # to a . )
So, just press F12 on your keyboard, find the arrow, point at the area you need, and look for something similar.”

November 30, 2014 at 06:02 #37080

Norman

Participant

this is the activity-loader.js

/**
* Please note, this plugin requires the jQuery cookie plugin, which comes bundled with the bp-default theme and many BuddyPress themes.
* If you theme does not include it it, please copy it from bp-default/_inc/global.js and paste in your js file
**/

jQuery(document).ready( function() {
var jq=jQuery;
var is_activity_loading=false;//We’ll use this variable to make sure we don’t send the request again and again.

//Check the window scroll event.
jq(window).scroll(function() {
//Find the visible “load more” button.
//since BP does not remove the “load more” button, we need to find the last one that is visible.
var load_more_btn=jq(“.load-more:visible”);
//If there is no visible “load more” button, we’ve reached the last page of the activity stream.
if(!load_more_btn.get(0))
return;

//Find the offset of the button.
var pos=load_more_btn.offset();

//If the window height+scrollTop is greater than the top offset of the “load more” button, we have scrolled to the button’s position. Let us load more activity.

if(jq(window).scrollTop() + jq(window).height() > pos.top ) {

load_more_activity();
}

});

/**
* This routine loads more activity.
* We call it whenever we reach the bottom of the activity listing.
*
*/
function load_more_activity(){
//Check if activity is loading, which means another request is already doing this.
//If yes, just return and let the other request handle it.
if(is_activity_loading)
return false;

//So, it is a new request, let us set the var to true.
is_activity_loading=true;
//Add loading class to “load more” button.
//Theme authors may need to change the selector if their theme uses a different id for the content container.
//This is designed to work with the structure of bp-default/derivative themes.
//Change #content to whatever you have named the content container in your theme.
jq(„#.content li.load-more”).addClass(‘loading’);

if ( null == jq.cookie(‘bp-activity-oldestpage’) )
jq.cookie(‘bp-activity-oldestpage’, 1, {
path: ‘/’
} );

var oldest_page = ( jq.cookie(‘bp-activity-oldestpage’) * 1 ) + 1;

//Send the ajax request.
jq.post( ajaxurl, {
action: ‘activity_get_older_updates’,
‘cookie’: encodeURIComponent(document.cookie),
‘page’: oldest_page
},
function(response)
{
jq(“.load-more”).hide();//Hide any “load more” button.
jq(“#content li.load-more”).removeClass(‘loading’);//Theme authors, you may need to change #content to the id of your container here, too.

//Update cookie…
jq.cookie( ‘bp-activity-oldestpage’, oldest_page, {
path: ‘/’
} );

//and append the response.
jq(“#content ul.activity-list”).append(response.contents);

//Since the request is complete, let us reset is_activity_loading to false, so we’ll be ready to run the routine again.

is_activity_loading=false;
}, ‘json’ );

return false;
}

});//end of dom ready

November 30, 2014 at 06:02 #37081

Norman

Participant

COPY CODE

/**
 * Please note, this plugin requires the jQuery cookie plugin, which comes bundled with the bp-default theme and many BuddyPress themes.
 * If you theme does not include it it, please copy it from bp-default/_inc/global.js and paste in your js file
 **/

jQuery(document).ready( function() {
    var jq=jQuery;
    var is_activity_loading=false;//We'll use this variable to make sure we don't send the request again and again.

    //Check the window scroll event.
    jq(window).scroll(function() {
       //Find the visible "load more" button.
       //since BP does not remove the "load more" button, we need to find the last one that is visible.
        var load_more_btn=jq(".load-more:visible");
        //If there is no visible "load more" button, we've reached the last page of the activity stream.
        if(!load_more_btn.get(0))
            return;
        
        //Find the offset of the button.
         var pos=load_more_btn.offset();
       
       //If the window height+scrollTop is greater than the top offset of the "load more" button, we have scrolled to the button's position. Let us load more activity.
     
     
       if(jq(window).scrollTop() + jq(window).height() > pos.top ) {
           
            load_more_activity();
       }
    
    });
    
    
    /**
     * This routine loads more activity.
     * We call it whenever we reach the bottom of the activity listing.
     * 
     */
    function load_more_activity(){
        //Check if activity is loading, which means another request is already doing this.
        //If yes, just return and let the other request handle it.
            if(is_activity_loading)
                    return false;				

           //So, it is a new request, let us set the var to true.        
            is_activity_loading=true;
            //Add loading class to "load more" button.
            //Theme authors may need to change the selector if their theme uses a different id for the content container.
            //This is designed to work with the structure of bp-default/derivative themes.
            //Change #content to whatever you have named the content container in your theme.
            jq(„#.content li.load-more").addClass('loading');

            
            if ( null == jq.cookie('bp-activity-oldestpage') )
                    jq.cookie('bp-activity-oldestpage', 1, {
                            path: '/'
                    } );

            var oldest_page = ( jq.cookie('bp-activity-oldestpage') * 1 ) + 1;

            //Send the ajax request.
            jq.post( ajaxurl, {
                    action: 'activity_get_older_updates',
                    'cookie': encodeURIComponent(document.cookie),
                    'page': oldest_page
            },
            function(response)
            {
                    jq(".load-more").hide();//Hide any "load more" button.
                    jq("#content li.load-more").removeClass('loading');//Theme authors, you may need to change #content to the id of your container here, too.
                    
                    //Update cookie...
                    jq.cookie( 'bp-activity-oldestpage', oldest_page, {
                            path: '/'
                    } );
                    
                    //and append the response.
                    jq("#content ul.activity-list").append(response.contents);

                    //Since the request is complete, let us reset is_activity_loading to false, so we'll be ready to run the routine again.
                    
                    is_activity_loading=false;
            }, 'json' );

            return false;
    }
 

});//end of dom ready

November 30, 2014 at 19:26 #37133

sharmstr

Moderator

The div class is ‘activity’ and the ul container ID is “activity-stream”

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

This support site is not about custom work. If you need custom development please contact cornel@seventhqueen.com

November 30, 2014 at 19:57 #37142

Norman

Participant

i add it like this but the new content doesn’t show up

jq(“#activity-stream li.load-more”).addClass(‘activity’);

November 30, 2014 at 19:59 #37143

Norman

Participant

or do i have to change all content to activity-stream ?

November 30, 2014 at 20:06 #37146

Norman

Participant

i put it like that. it is triggering the infinite reload but not inserting the additional content.

`/**
* Please note, this plugin requires the jQuery cookie plugin, which comes bundled with the bp-default theme and many BuddyPress themes.
* If you theme does not include it it, please copy it from bp-default/_inc/global.js and paste in your js file
**/

jQuery(document).ready( function() {
var jq=jQuery;
var is_activity_loading=false;//We’ll use this variable to make sure we don’t send the request again and again.

//Find the offset of the button.
var pos=load_more_btn.offset();

//If the window height+scrollTop is greater than the top offset of the “load more” button, we have scrolled to the button’s position. Let us load more activity.

if(jq(window).scrollTop() + jq(window).height() > pos.top ) {

load_more_activity();
}

});

//So, it is a new request, let us set the var to true.
is_activity_loading=true;
//Add loading class to “load more” button.
//Theme authors may need to change the selector if their theme uses a different id for the content container.
//This is designed to work with the structure of bp-default/derivative themes.
//Change #content to whatever you have named the content container in your theme.
jq(“#activity-stream li.load-more”).addClass(‘activity’);

if ( null == jq.cookie(‘bp-activity-oldestpage’) )
jq.cookie(‘bp-activity-oldestpage’, 1, {
path: ‘/’
} );

var oldest_page = ( jq.cookie(‘bp-activity-oldestpage’) * 1 ) + 1;

//Send the ajax request.
jq.post( ajaxurl, {
action: ‘activity_get_older_updates’,
‘cookie’: encodeURIComponent(document.cookie),
‘page’: oldest_page
},
function(response)
{
jq(“.load-more”).hide();//Hide any “load more” button.
jq(“#activity-stream li.load-more”).removeClass(‘activity’);//Theme authors, you may need to change #content to the id of your container here, too.

//Update cookie…
jq.cookie( ‘bp-activity-oldestpage’, oldest_page, {
path: ‘/’
} );

//and append the response.
jq(“#activity-stream ul.activity-list”).append(response.contents);

//Since the request is complete, let us reset is_activity_loading to false, so we’ll be ready to run the routine again.

is_activity_loading=false;
}, ‘json’ );

return false;
}

});//end of dom ready

November 30, 2014 at 20:06 #37147

Norman

Participant

jQuery(document).ready( function() {
var jq=jQuery;
var is_activity_loading=false;//We’ll use this variable to make sure we don’t send the request again and again.

//Find the offset of the button.
var pos=load_more_btn.offset();

//If the window height+scrollTop is greater than the top offset of the “load more” button, we have scrolled to the button’s position. Let us load more activity.

if(jq(window).scrollTop() + jq(window).height() > pos.top ) {

load_more_activity();
}

});

//So, it is a new request, let us set the var to true.
is_activity_loading=true;
//Add loading class to “load more” button.
//Theme authors may need to change the selector if their theme uses a different id for the content container.
//This is designed to work with the structure of bp-default/derivative themes.
//Change #content to whatever you have named the content container in your theme.
jq(“#activity-stream li.load-more”).addClass(‘activity’);

if ( null == jq.cookie(‘bp-activity-oldestpage’) )
jq.cookie(‘bp-activity-oldestpage’, 1, {
path: ‘/’
} );

var oldest_page = ( jq.cookie(‘bp-activity-oldestpage’) * 1 ) + 1;

//Send the ajax request.
jq.post( ajaxurl, {
action: ‘activity_get_older_updates’,
‘cookie’: encodeURIComponent(document.cookie),
‘page’: oldest_page
},
function(response)
{
jq(“.load-more”).hide();//Hide any “load more” button.
jq(“#activity-stream li.load-more”).removeClass(‘activity’);//Theme authors, you may need to change #content to the id of your container here, too.

//Update cookie…
jq.cookie( ‘bp-activity-oldestpage’, oldest_page, {
path: ‘/’
} );

//and append the response.
jq(“#activity-stream ul.activity-list”).append(response.contents);

//Since the request is complete, let us reset is_activity_loading to false, so we’ll be ready to run the routine again.

is_activity_loading=false;
}, ‘json’ );

return false;
}

});//end of dom ready

November 30, 2014 at 20:07 #37148

Norman

Participant

COPY CODE

/**
 * Please note, this plugin requires the jQuery cookie plugin, which comes bundled with the bp-default theme and many BuddyPress themes.
 * If you theme does not include it it, please copy it from bp-default/_inc/global.js and paste in your js file
 **/

jQuery(document).ready( function() {
    var jq=jQuery;
    var is_activity_loading=false;//We'll use this variable to make sure we don't send the request again and again.

    //Check the window scroll event.
    jq(window).scroll(function() {
       //Find the visible "load more" button.
       //since BP does not remove the "load more" button, we need to find the last one that is visible.
        var load_more_btn=jq(".load-more:visible");
        //If there is no visible "load more" button, we've reached the last page of the activity stream.
        if(!load_more_btn.get(0))
            return;
        
        //Find the offset of the button.
         var pos=load_more_btn.offset();
       
       //If the window height+scrollTop is greater than the top offset of the "load more" button, we have scrolled to the button's position. Let us load more activity.
     
     
       if(jq(window).scrollTop() + jq(window).height() > pos.top ) {
           
            load_more_activity();
       }
    
    });
    
    
    /**
     * This routine loads more activity.
     * We call it whenever we reach the bottom of the activity listing.
     * 
     */
    function load_more_activity(){
        //Check if activity is loading, which means another request is already doing this.
        //If yes, just return and let the other request handle it.
            if(is_activity_loading)
                    return false;				

           //So, it is a new request, let us set the var to true.        
            is_activity_loading=true;
            //Add loading class to "load more" button.
            //Theme authors may need to change the selector if their theme uses a different id for the content container.
            //This is designed to work with the structure of bp-default/derivative themes.
            //Change #content to whatever you have named the content container in your theme.
            jq("#activity-stream li.load-more").addClass('activity');

            
            if ( null == jq.cookie('bp-activity-oldestpage') )
                    jq.cookie('bp-activity-oldestpage', 1, {
                            path: '/'
                    } );

            var oldest_page = ( jq.cookie('bp-activity-oldestpage') * 1 ) + 1;

            //Send the ajax request.
            jq.post( ajaxurl, {
                    action: 'activity_get_older_updates',
                    'cookie': encodeURIComponent(document.cookie),
                    'page': oldest_page
            },
            function(response)
            {
                    jq(".load-more").hide();//Hide any "load more" button.
                    jq("#activity-stream li.load-more").removeClass('activity');//Theme authors, you may need to change #content to the id of your container here, too.
                    
                    //Update cookie...
                    jq.cookie( 'bp-activity-oldestpage', oldest_page, {
                            path: '/'
                    } );
                    
                    //and append the response.
                    jq("#activity-stream ul.activity-list").append(response.contents);

                    //Since the request is complete, let us reset is_activity_loading to false, so we'll be ready to run the routine again.
                    
                    is_activity_loading=false;
            }, 'json' );

            return false;
    }
 

});//end of dom ready

November 30, 2014 at 20:20 #37149

sharmstr

Moderator

Why are you putting .addClass(‘activity’)? Looking at the code you provided, you shouldn’t change that part. It should stay .addClass(‘loading’); Looks like you need to change 3 lines, not just one.

line 52

COPY CODE


jq(".activity li.load-more").addClass('loading');

line 71

COPY CODE


jq(".activity li.load-more").removeClass('loading');//Theme authors, you may need to change #content to the id of your container here, too.

line 79

COPY CODE


 jq(".activity ul.activity-list").append(response.contents);

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

This support site is not about custom work. If you need custom development please contact cornel@seventhqueen.com

November 30, 2014 at 20:58 #37161

Norman

Participant

is change to this. still not working

COPY CODE

/**
 * Please note, this plugin requires the jQuery cookie plugin, which comes bundled with the bp-default theme and many BuddyPress themes.
 * If you theme does not include it it, please copy it from bp-default/_inc/global.js and paste in your js file
 **/

jQuery(document).ready( function() {
    var jq=jQuery;
    var is_activity_loading=false;//We'll use this variable to make sure we don't send the request again and again.

    //Check the window scroll event.
    jq(window).scroll(function() {
       //Find the visible "load more" button.
       //since BP does not remove the "load more" button, we need to find the last one that is visible.
        var load_more_btn=jq(".load-more:visible");
        //If there is no visible "load more" button, we've reached the last page of the activity stream.
        if(!load_more_btn.get(0))
            return;
        
        //Find the offset of the button.
         var pos=load_more_btn.offset();
       
       //If the window height+scrollTop is greater than the top offset of the "load more" button, we have scrolled to the button's position. Let us load more activity.
     
     
       if(jq(window).scrollTop() + jq(window).height() > pos.top ) {
           
            load_more_activity();
       }
    
    });
    
    
    /**
     * This routine loads more activity.
     * We call it whenever we reach the bottom of the activity listing.
     * 
     */
    function load_more_activity(){
        //Check if activity is loading, which means another request is already doing this.
        //If yes, just return and let the other request handle it.
            if(is_activity_loading)
                    return false;				

           //So, it is a new request, let us set the var to true.        
            is_activity_loading=true;
            //Add loading class to "load more" button.
            //Theme authors may need to change the selector if their theme uses a different id for the content container.
            //This is designed to work with the structure of bp-default/derivative themes.
            //Change #content to whatever you have named the content container in your theme.
            jq("#.activity li.load-more").addClass('loading');

            
            if ( null == jq.cookie('bp-activity-oldestpage') )
                    jq.cookie('bp-activity-oldestpage', 1, {
                            path: '/'
                    } );

            var oldest_page = ( jq.cookie('bp-activity-oldestpage') * 1 ) + 1;

            //Send the ajax request.
            jq.post( ajaxurl, {
                    action: 'activity_get_older_updates',
                    'cookie': encodeURIComponent(document.cookie),
                    'page': oldest_page
            },
            function(response)
            {
                    jq(".load-more").hide();//Hide any "load more" button.
                    jq("#.activity li.load-more").removeClass('loading');//Theme authors, you may need to change #content to the id of your container here, too.
                    
                    //Update cookie...
                    jq.cookie( 'bp-activity-oldestpage', oldest_page, {
                            path: '/'
                    } );
                    
                    //and append the response.
                    jq("#.activity ul.activity-list").append(response.contents);

                    //Since the request is complete, let us reset is_activity_loading to false, so we'll be ready to run the routine again.
                    
                    is_activity_loading=false;
            }, 'json' );

            return false;
    }
 

});//end of dom ready

November 30, 2014 at 21:05 #37163

sharmstr

Moderator

You changed it wrong. Look at my code again. I dont have ‘#’s. “#” are for IDs. “.” are for css classes.

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

This support site is not about custom work. If you need custom development please contact cornel@seventhqueen.com

November 30, 2014 at 21:42 #37169

Norman

Participant

oh right . sorry sharmstr.
yes it works.

here for everyone who wants to run the BP ACTIVITY LOADER PLUGIN.
just copy and replace this code:

COPY CODE

/**
 * Please note, this plugin requires the jQuery cookie plugin, which comes bundled with the bp-default theme and many BuddyPress themes.
 * If you theme does not include it it, please copy it from bp-default/_inc/global.js and paste in your js file
 **/

jQuery(document).ready( function() {
    var jq=jQuery;
    var is_activity_loading=false;//We'll use this variable to make sure we don't send the request again and again.

    //Check the window scroll event.
    jq(window).scroll(function() {
       //Find the visible "load more" button.
       //since BP does not remove the "load more" button, we need to find the last one that is visible.
        var load_more_btn=jq(".load-more:visible");
        //If there is no visible "load more" button, we've reached the last page of the activity stream.
        if(!load_more_btn.get(0))
            return;
        
        //Find the offset of the button.
         var pos=load_more_btn.offset();
       
       //If the window height+scrollTop is greater than the top offset of the "load more" button, we have scrolled to the button's position. Let us load more activity.
     
     
       if(jq(window).scrollTop() + jq(window).height() > pos.top ) {
           
            load_more_activity();
       }
    
    });
    
    
    /**
     * This routine loads more activity.
     * We call it whenever we reach the bottom of the activity listing.
     * 
     */
    function load_more_activity(){
        //Check if activity is loading, which means another request is already doing this.
        //If yes, just return and let the other request handle it.
            if(is_activity_loading)
                    return false;				

           //So, it is a new request, let us set the var to true.        
            is_activity_loading=true;
            //Add loading class to "load more" button.
            //Theme authors may need to change the selector if their theme uses a different id for the content container.
            //This is designed to work with the structure of bp-default/derivative themes.
            //Change #content to whatever you have named the content container in your theme.
            jq(".activity li.load-more").addClass('loading');

            
            if ( null == jq.cookie('bp-activity-oldestpage') )
                    jq.cookie('bp-activity-oldestpage', 1, {
                            path: '/'
                    } );

            var oldest_page = ( jq.cookie('bp-activity-oldestpage') * 1 ) + 1;

            //Send the ajax request.
            jq.post( ajaxurl, {
                    action: 'activity_get_older_updates',
                    'cookie': encodeURIComponent(document.cookie),
                    'page': oldest_page
            },
            function(response)
            {
                    jq(".load-more").hide();//Hide any "load more" button.
                    jq(".activity li.load-more").removeClass('loading');//Theme authors, you may need to change #content to the id of your container here, too.
                    
                    //Update cookie...
                    jq.cookie( 'bp-activity-oldestpage', oldest_page, {
                            path: '/'
                    } );
                    
                    //and append the response.
                    jq(".activity ul.activity-list").append(response.contents);

                    //Since the request is complete, let us reset is_activity_loading to false, so we'll be ready to run the routine again.
                    
                    is_activity_loading=false;
            }, 'json' );

            return false;
    }
 

});//end of dom ready

Author

Posts

Viewing 13 posts - 1 through 13 (of 13 total)

The topic ‘bp activity loader plugin install needs container info to work’ is closed to new replies.

bp activity loader plugin install needs container info to work

Search KB

Log in with your credentials

Forgot your details?