jquery/no_pager/no_pager.js

/*
        no pager, as seen at
        http://www.humanized.com/weblog/2006/04/28/reading_humanized/
        but using jquery

        2006-08-16 Dobrica Pavlinusic <dpavlin@rot13.org>
*/

var preloadDistance = 1000;
var isUpdating = false;
var checker;
var v;
var cookie = 'no_pager';

/*
        function to log debugging information into debug div
*/

function logDebug( m1, m2 ) {
        var m = m1;
        if (m2) m += m2;
        if (m) $('#debug').append( '<small>'+m+'</small><br/>' );
}

function log( m1, m2 ) {
        var m = m1;
        if (m2) m += m2;
        m += '</br>'
        if (m) $('#debug').append( m );
}

function load_page() {
        setCookie(cookie+"_height", getScrollHeight() );
        setCookie(cookie+"_scroll", getScrollHeight() - _getWindowHeight() );

        if ( isUpdating == true
                || getPageHeight() - getScrollHeight() > preloadDistance
                || v.page >= v.max_page
        ) return;

        v.page++;

        log(
                'Get page:' + v.page + '<br/>search: ' + v.search +
                ' PageHeight:' + getPageHeight() + ' ScrollHeight:' + getScrollHeight()
        );

        setCookie( cookie+'_page', v.page );
        isUpdating = true;

        $('#status').html(
                'Loading page '+ v.page + '...'
        );

        $.get(
                "index.cgi/snippet",
                {
                        page: v.page,
                        search: v.search,
                },
                function ( response ) {
                        
                        if (response.length < 500) {
                                $('#footer').show();
                                if ( v.page > 0 ) {
                                        $('#more_history').html('<h2 style="text-align: center; font-style:italic; padding: 2em;">No more results.</h2>');
                                } else {
                                        $('#more_history').html('<h2 style="text-align: center; font-style:italic; padding: 2em;">No results matched your search.</h2>');
                                }
                                $('#status').html( 'All results shown.' );
                                return;
                        }

                        response += "<div id='more_history'>";
                        response += "  <strong>More posts are being loaded...</strong> <br />";
                        response += "  If you are using the scroll bar, release the mouse to see more posts.";
                        response += "</div>"
                        $('#more_history').html( response );

                        eval( 'v=' + $('#json').val() );

                        isUpdating = false;
                        $('#status').html( v.status );
                }
        );


}

/*
        bind events and init no_pager
*/

$(document).ready( function() {

        logDebug( 'no_page binding events' );

        eval( 'v=' + $('#json').val() );

        var cookie_id = getCookie(cookie+'_id') || 0;

        logDebug("Page ID:", v.id);
        logDebug("Page Cookie:", cookie_id);

        var fromBackButton = false;
        if ( cookie_id == v.id ) {
                fromBackButton = true;
        } else {
                setCookie(cookie+'_id', v.id);
        }

        logDebug("From Back Button?:", fromBackButton);
        if ( fromBackButton ) {
                logDebug( 'Load ' + getCookie(cookie+'_page') + ' pages');
                logDebug( 'Scroll to:' + getCookie(cookie+'_scroll') );
                $('#spacer').height( getCookie(cookie+'_height')+"px" );
                scroll( 0, getCookie(cookie+'_scroll') );
        }


        checker = setInterval(function () {
                load_page();
        }, 100);


});

1	dpavlin	2	/*
2			no pager, as seen at
3			http://www.humanized.com/weblog/2006/04/28/reading_humanized/
4	dpavlin	11	but using jquery
5
6			2006-08-16 Dobrica Pavlinusic <dpavlin@rot13.org>
7	dpavlin	2	*/
8
9	dpavlin	11	var preloadDistance = 1000;
10			var isUpdating = false;
11			var checker;
12	dpavlin	15	var v;
13			var cookie = 'no_pager';
14	dpavlin	11
15			/*
16			function to log debugging information into debug div
17			*/
18
19			function logDebug( m1, m2 ) {
20			var m = m1;
21			if (m2) m += m2;
22			if (m) $('#debug').append( '<small>'+m+'</small><br/>' );
23	dpavlin	2	}
24
25	dpavlin	11	function log( m1, m2 ) {
26			var m = m1;
27			if (m2) m += m2;
28			m += '</br>'
29			if (m) $('#debug').append( m );
30	dpavlin	2	}
31
32	dpavlin	11	function load_page() {
33	dpavlin	15	setCookie(cookie+"_height", getScrollHeight() );
34			setCookie(cookie+"_scroll", getScrollHeight() - _getWindowHeight() );
35	dpavlin	2
36	dpavlin	11	if ( isUpdating == true
37			\|\| getPageHeight() - getScrollHeight() > preloadDistance
38	dpavlin	15	\|\| v.page >= v.max_page
39	dpavlin	11	) return;
40	dpavlin	2
41	dpavlin	15	v.page++;
42	dpavlin	2
43	dpavlin	15	log(
44			'Get page:' + v.page + '<br/>search: ' + v.search +
45			' PageHeight:' + getPageHeight() + ' ScrollHeight:' + getScrollHeight()
46			);
47	dpavlin	2
48	dpavlin	15	setCookie( cookie+'_page', v.page );
49	dpavlin	11	isUpdating = true;
50	dpavlin	2
51	dpavlin	11	$('#status').html(
52	dpavlin	15	'Loading page '+ v.page + '...'
53	dpavlin	11	);
54	dpavlin	2
55	dpavlin	11	$.get(
56			"index.cgi/snippet",
57			{
58	dpavlin	15	page: v.page,
59			search: v.search,
60	dpavlin	11	},
61			function ( response ) {
62
63			if (response.length < 500) {
64			$('#footer').show();
65	dpavlin	15	if ( v.page > 0 ) {
66	dpavlin	11	$('#more_history').html('<h2 style="text-align: center; font-style:italic; padding: 2em;">No more results.</h2>');
67			} else {
68			$('#more_history').html('<h2 style="text-align: center; font-style:italic; padding: 2em;">No results matched your search.</h2>');
69			}
70			$('#status').html( 'All results shown.' );
71			return;
72			}
73	dpavlin	9
74	dpavlin	11	response += "<div id='more_history'>";
75			response += " <strong>More posts are being loaded...</strong> <br />";
76			response += " If you are using the scroll bar, release the mouse to see more posts.";
77			response += "</div>"
78			$('#more_history').html( response );
79	dpavlin	15
80			eval( 'v=' + $('#json').val() );
81
82	dpavlin	11	isUpdating = false;
83	dpavlin	15	$('#status').html( v.status );
84	dpavlin	11	}
85			);
86	dpavlin	9
87	dpavlin	2
88			}
89
90	dpavlin	11	/*
91			bind events and init no_pager
92			*/
93	dpavlin	2
94	dpavlin	11	$(document).ready( function() {
95	dpavlin	2
96	dpavlin	11	logDebug( 'no_page binding events' );
97	dpavlin	2
98	dpavlin	15	eval( 'v=' + $('#json').val() );
99	dpavlin	2
100	dpavlin	15	var cookie_id = getCookie(cookie+'_id') \|\| 0;
101	dpavlin	11
102	dpavlin	15	logDebug("Page ID:", v.id);
103			logDebug("Page Cookie:", cookie_id);
104
105	dpavlin	2	var fromBackButton = false;
106	dpavlin	15	if ( cookie_id == v.id ) {
107	dpavlin	11	fromBackButton = true;
108			} else {
109	dpavlin	15	setCookie(cookie+'_id', v.id);
110	dpavlin	11	}
111	dpavlin	2
112			logDebug("From Back Button?:", fromBackButton);
113	dpavlin	15	if ( fromBackButton ) {
114			logDebug( 'Load ' + getCookie(cookie+'_page') + ' pages');
115			logDebug( 'Scroll to:' + getCookie(cookie+'_scroll') );
116			$('#spacer').height( getCookie(cookie+'_height')+"px" );
117			scroll( 0, getCookie(cookie+'_scroll') );
118	dpavlin	2	}
119
120	dpavlin	15
121			checker = setInterval(function () {
122			load_page();
123			}, 100);
124
125
126	dpavlin	11	});
127	dpavlin	2