Recent Topics
  1. b2evolution CMS Support Forums
  2. b2evolution Support
  3. Plugins & Extensions
  4. Infinite Scroll Plugin

Infinite Scroll Plugin

1 Dec 18, 2010 11:05    

The plugin gives tou the ability to load next set of posts as you reach the end of the page, so that the user does not have to click and load another page.

http://www.tilqi.com/assets/ssi.jpg

Download : https://sourceforge.net/projects/evocms-plugins/files/infinite_scroll_plugin/

Demo: http://www.eodepo.com/demo/blog1.php

Back to top

2 Dec 18, 2010 13:33

Demo doesn't work.

Nice plugin by the way, I'll try it on my website :)

Back to top

5 Dec 18, 2010 13:50

sam2kb wrote:

Is page cache enabled?

maybe, i dont know, it is a default 4.0.1 install

Back to top

6 Dec 18, 2010 14:00

Use this instead. No need to load jQuery from google if it's included in b2evo already

function SkinBeginHtmlHead()
{
	$plug_url = $this->get_plugin_url();
	
	$inf_content = $this->Settings->get( 'inf_content' );
	$inf_nav = $this->Settings->get( 'inf_nav' );
	$inf_post = $this->Settings->get( 'inf_post' );
	$inf_bufferPx = $this->Settings->get( 'inf_bufferPx' );
	$inf_animate = $this->Settings->get( 'inf_animate' );
	$inf_extraScrollPx = $this->Settings->get( 'inf_extraScrollPx' );
	$inf_loadingText = $this->Settings->get( 'inf_loadingText' );
	$inf_donetext = $this->Settings->get( 'inf_donetext' );
	$inf_debug = $this->Settings->get( 'inf_debug' );
	

	$js = 'jQuery(document).ready(function() {
		jQuery("'.$inf_content.'").infinitescroll({ 
			navSelector  : "'.$inf_nav.'",
			nextSelector : "'.$inf_nav.' a:first",    
			itemSelector : "'.$inf_post.'",
			loadingImg   : "'.$plug_url.'ajax-loader.gif"';
		
	if(!empty($inf_bufferPx))		$js .= ', bufferPx:'.$inf_bufferPx;
	if(!empty($inf_animate))		$js .= ', animate:'.$inf_animate;
	if(!empty($inf_extraScrollPx))	$js .= ', extraScrollPx:'.$inf_extraScrollPx;
	if(!empty($inf_loadingText))	$js .= ', loadingText:"'.$inf_loadingText.'"';
	if(!empty($inf_donetext))		$js .= ', donetext:"'.$inf_donetext.'"';
	if(!empty($inf_debug))			$js .= ', debug:'.$inf_debug;
	
	$js .= '});
		});';

	require_js( '#jquery#' );
	require_js( $plug_url.'jquery.infinitescroll.js', true );
	add_js_headline( $js );
}

Back to top

7 Dec 18, 2010 14:10

sam2kb wrote:

Use this instead. No need to load jQuery from google if it's included in b2evo already

function SkinBeginHtmlHead()
{
	$plug_url = $this->get_plugin_url();
	
	$inf_content = $this->Settings->get( 'inf_content' );
	$inf_nav = $this->Settings->get( 'inf_nav' );
	$inf_post = $this->Settings->get( 'inf_post' );
	$inf_bufferPx = $this->Settings->get( 'inf_bufferPx' );
	$inf_animate = $this->Settings->get( 'inf_animate' );
	$inf_extraScrollPx = $this->Settings->get( 'inf_extraScrollPx' );
	$inf_loadingText = $this->Settings->get( 'inf_loadingText' );
	$inf_donetext = $this->Settings->get( 'inf_donetext' );
	$inf_debug = $this->Settings->get( 'inf_debug' );
	

	$js = 'jQuery(document).ready(function() {
		jQuery("'.$inf_content.'").infinitescroll({ 
			navSelector  : "'.$inf_nav.'",
			nextSelector : "'.$inf_nav.' a:first",    
			itemSelector : "'.$inf_post.'",
			loadingImg   : "'.$plug_url.'ajax-loader.gif"';
		
	if(!empty($inf_bufferPx))		$js .= ', bufferPx:'.$inf_bufferPx;
	if(!empty($inf_animate))		$js .= ', animate:'.$inf_animate;
	if(!empty($inf_extraScrollPx))	$js .= ', extraScrollPx:'.$inf_extraScrollPx;
	if(!empty($inf_loadingText))	$js .= ', loadingText:"'.$inf_loadingText.'"';
	if(!empty($inf_donetext))		$js .= ', donetext:"'.$inf_donetext.'"';
	if(!empty($inf_debug))			$js .= ', debug:'.$inf_debug;
	
	$js .= '});
		});';

	require_js( '#jquery#' );
	require_js( $plug_url.'jquery.infinitescroll.js', true );
	add_js_headline( $js );
}

thank you.. i have updated the download link.

I am already having problems understanding which comes first when you insert via require_js, add_headline, or directly within skinbeginhtmlhead

Back to top

8 Dec 18, 2010 14:53

You should always include headlines with add_headline or similar build-in functions.

Back to top

9 Dec 18, 2010 14:57

BTW instead of that highly inefficient hack with paged results, you can comment the following line in /inc/_core/ui/results/_results.class.php : 700

// Make sure we're not requesting a page out of range:
if( $this->page > $this->total_pages )
{
	//$this->page = $this->total_pages;
}

Back to top

10 Dec 18, 2010 15:17

sam2kb wrote:

BTW instead of that highly inefficient hack with paged results, you can comment the following line in /inc/_core/ui/results/_results.class.php : 700

// Make sure we're not requesting a page out of range:
if( $this->page > $this->total_pages )
{
	//$this->page = $this->total_pages;
}

thanks for the input. it says "ugly fix" in the description already P:
but that would still be a core hack. i wonder why it still has not been fixed in v4

Back to top

11 Dec 18, 2010 18:46

Just for kicks, you don't need the skin, or core, hack.

SkinBeginHtmlHead() is your friend ;) Run your code in there and return an error to your ajax.

¥

Back to top

12 Dec 18, 2010 19:01

¥åßßå wrote:

Just for kicks, you don't need the skin, or core, hack.

SkinBeginHtmlHead() is your friend ;) Run your code in there and return an error to your ajax.

¥

well, i have tried that already, and unfortunately that doesn't do.

Back to top

13 Dec 18, 2010 19:07

Assuming your code relies on a 404 header .. it wouldn't (content has already been sent), but it's easy enough to kick out a detectable string.

¥

Back to top

14 Dec 18, 2010 19:16

The code searches for specific DOM tags, so we can just break the output.

SkinBeginHtmlHead()

global $paged, $MainList;

if( $paged > $MainList->total_pages )
{
	echo '</head>';
	echo '<h2>404 Not Found</h2>';
	exit;
}

Back to top

15 Dec 18, 2010 19:18

¥åßßå wrote:

Assuming your code relies on a 404 header .. it wouldn't (content has already been sent), but it's easy enough to kick out a detectable string.

¥

There must be a hook like AfterMainListLoaded, what do you think?

Back to top

17 Dec 19, 2010 03:38

sam2kb wrote:

I added per-blog settings if you don't mind :)

Those are really needed since different skins use different classes for posts and navigation.

http://pastebin.com/raw.php?i=E9uG61EV

right, great!

i have updated the plugin and the download link.
included and changed the script to minified.
updated default values
removed hack thing
updated readme

One thing about the plugin: Don't forget to re-initiate your jquery goodness for the newly added content(like lightbox, anything). There is a 

function(arrayOfNewElems){
 
     // optional callback when new content is successfully loaded in.

but it did not work for me.Would anyone gets this thing right like to share it here

Back to top

18 Dec 19, 2010 05:40

One thing about the plugin: Don't forget to re-initiate your jquery goodness for the newly added content(like lightbox, anything).

What are you talking about?

Back to top

19 Dec 19, 2010 12:28

i mean jquery wont work in loaded posts (like lightbox etc.) unless you re-run your jquery code.

Back to top

22 Dec 31, 2010 09:18

I need to figure out how to fix a few things before we put this plugin on the shelf:

* The plugin gets stuck if you access the blog from another page like paged=2, as it basically tries to load the first link in the navigation div.

* Featured posts gets included in the loop, and loads at the beginning of every loaded page.

Any ideas on how to fix these ?

Back to top

23 Feb 16, 2011 10:55

hey

When I use the plugin (manual or auto), once it reaches the last post, it infinitely loads the last post. Why is that?

Back to top

25 Jan 30, 2012 16:02

Hello,

Hello,

I tried to install the "Infinite Scroll Plugin" with "b2evo_ru" skin but it seems that it doesn't work.
I added in the plugin settings: .top_menu at "Content Div" and .bPost at "Post Div" but it seems that the script doesn't have the .navigation div (is missing also in the styile.css file)

Here are my modified settings:

Content Div: #content, #tq-main .Posts .tq-g .top_menu
Navigation Div: .navigation
Post Div: .post .bPost

Can you please tell me what should I change in the above settings?

Thanks

Back to top

26 Jan 30, 2012 16:18

One correction:

Post Div: .bPost

Back to top


Form is loading...