www.gusucode.com > CPF开源的PHP SNS问答社区 v0.7源码程序 > code/static/libs/jquery_pageless/jquery.pageless.js

    // =======================================================================
// PageLess - endless page
//
// Pageless is a jQuery plugin.
// As you scroll down you see more results coming back at you automatically.
// It provides an automatic pagination in an accessible way : if javascript
// is disabled your standard pagination is supposed to work.
//
// Licensed under the MIT:
// http://www.opensource.org/licenses/mit-license.php
//
// Parameters:
//    currentPage: current page (string or function; e.g. <%= params[:page] %>)
//    distance: distance to the end of page in px when ajax query is fired
//    loader: selector of the loader div (ajax activity indicator)
//    loaderHtml: html code of the div if loader not used
//    loaderImage: image inside the loader
//    loaderMsg: displayed ajax message
//    pagination: selector of the paginator divs.
//                if javascript is disabled paginator is provided
//    params: paramaters for the ajax query (hash or function), you can pass auth_token here
//    totalPages: total number of pages (integer or function)
//    url: URL used to request more data (string or function)
//    method: HTML method for call URL, default - get
//
// Callback Parameters:
//    scrape: A function to modify the incoming data.
//    complete: A function to call when a new page has been loaded (optional)
//    end: A function to call when the last page has been loaded (optional)
//
// Usage:
//   $('#results').pageless({ totalPages: 10
//                          , url: '/articles/'
//                          , loaderMsg: 'Loading more results'
//                          });
//
// Requires: jquery
//
// Author: Jean-Sébastien Ney (https://github.com/jney)
//
// Contributors:
//   Alexander Lang (https://github.com/langalex)
//   Lukas Rieder (https://github.com/Overbryd)
//   Kathryn Reeve (https://github.com/BinaryKitten)
//
// Thanks to:
//  * codemonky.com/post/34940898
//  * www.unspace.ca/discover/pageless/
//  * famspam.com/facebox
// =======================================================================

/*global document:true, jQuery:true, location:true, window:true*/

(function ($, window) {

    var element;
    var isLoading = false;
    var loader;
    var namespace = '.pageless';
    var SCROLL = 'scroll' + namespace;
    var RESIZE = 'resize' + namespace;
    var settings = {};
    var container;
    var $container;

    $.pageless = function (opts) {
        if ($.isFunction(opts)) {
            opts.call();
        } else {
            init(opts);
        }
    };

    $.pagelessReset = function () {
        var inited = settings.inited;

        settings = {
            container: window,
            currentPage: 1,
            distance: 100,
            pagination: '.pagination',
            params: {},
            url: location.href,
            loaderImage: "/images/load.gif",
            endMsg: '没有更多了',
            method: 'get'
        };

        container = settings.container;
        $container = $(container);

        if (inited) {
            stopListener();
        }

        // if there is a afterStopListener callback we call it
        if (settings.end) {
            settings.end.call();
        }
    };

    $.pagelessCurrentPage = function () {
        return settingOrFunc('currentPage');
    };

    var loaderHtml = function () {
        return settings.loaderHtml ||
            '<div id="pageless-loader" style="display:none;text-align:center;width:100%;margin-top:20px;">' +
            '<div class="msg" style="color:#e9e9e9;font-size:1.5em"></div>' +
            '<img src="' + settings.loaderImage + '" alt="loading more results" style="margin:10px auto" />' +
            '</div>';
    };

    // settings params: totalPages
    function init(opts) {
        $.pagelessReset();

        if (!settings.inited) {
            settings.inited = true;
        }

        if (opts) {
            $.extend(settings, opts);
        }

        // for accessibility we can keep pagination links
        // but since we have javascript enabled we remove pagination links
        // 只是隐藏而不是删除
        if (settings.pagination) {
            $(settings.pagination).css({"height": 0, "width": 0, "overflow": "hidden"});
        }

        // start the listener
        startListener();
    }

    $.fn.pageless = function (opts) {
        var $el = $(this);
        var $loader = $(opts.loader, $el);

        init(opts);
        element = $el;

        // loader element
        if (opts.loader && $loader.length) {
            loader = $loader;
        } else {
            loader = $(loaderHtml());
            $el.append(loader);
            // if we use the default loader, set the message
            if (!opts.loaderHtml) {
                $('#pageless-loader .msg').html(opts.loaderMsg).css(opts.msgStyles || {});
            }
        }
    };

    //
    function loading(bool) {
        isLoading = bool;
        if (loader) {
            if (isLoading) {
                loader.fadeIn('normal');
            } else {
                loader.fadeOut('normal');
            }
        }
    }

    // distance to end of the container
    function distanceToBottom() {
        return (container === window)
            ? $(document).height()
        - $container.scrollTop()
        - $container.height()
            : $container[0].scrollHeight
        - $container.scrollTop()
        - $container.height();
    }

    function settingOrFunc(name) {
        var ret = settings[name];
        return $.isFunction(settings[name]) ? ret() : ret;
    }

    function stopListener() {
        if ($container) {
            $container.unbind(namespace);
        }
    }

    // * bind a scroll event
    // * trigger is once in case of reload
    function startListener() {
        $container
            .bind(SCROLL + ' ' + RESIZE, watch)
            .trigger(SCROLL);
    }

    function watch() {
        var currentPage = settingOrFunc('currentPage');
        var totalPages = settingOrFunc('totalPages');

        // listener was stopped or we've run out of pages
        if (totalPages <= currentPage) {
            if (!$.isFunction(settings.currentPage) && !$.isFunction(settings.totalPages)) {
                stopListener();
                // if there is a afterStopListener callback we call it
                if (settings.end) {
                    settings.end.call();
                }

                var endMsg = settingOrFunc('endMsg'), endMsgStyles = settingOrFunc('endMsgStyles') || {};
                $('#pageless-loader .msg').html(endMsg).css(endMsgStyles);

                if (settings.pagination) {
                    $(settings.pagination).css({"height": 'auto', "width": 'auto', "overflow": "hidden"});
                }
            }
            return;
        }

        // if slider past our scroll offset, then fire a request for more data
        if (!isLoading && (distanceToBottom() < settings.distance)) {
            var url = settingOrFunc('url');
            var requestParams = settingOrFunc('params');

            loading(true);
            // move to next page
            currentPage++;
            if (!$.isFunction(settings.currentPage)) {
                settings.currentPage = currentPage;
            }

            //合并分页参数
            url = url.replace(':page:', currentPage);

            // set up ajax query params 已不需要
            //$.extend(requestParams, { page: currentPage });
            // finally ajax query
            $.ajax({
                data: requestParams,
                dataType: 'html',
                url: url,
                method: settings.method,
                success: function (data) {
                    if ($.isFunction(settings.scrape)) {
                        data = settings.scrape(data);
                    }
                    if (loader) {
                        loader.before(data);
                    } else {
                        element.append(data);
                    }
                    loading(false);
                    // if there is a complete callback we call it
                    if (settings.complete) {
                        settings.complete.call();
                    }
                }
            });
        }
    }
})(jQuery, window);