Really simple PJAX Router

Installation

<script src="pjax.router.min.js"></script>

Initializing

var router = new PJaxRouter();

Parameters

Basic params

There are 5 basic parameters that you can specify:

var router = new PJaxRouter({
    container: document.getElementById("content"), // container where datas will be removed/appended
    cancelNavigationClass: "out", // links with that class does not trigger PJAX navigation
    cacheLinks: ".important-pages", // cache pages for all the links that have the ".important-pages" class on init and after each successful navigation
    cacheNavigatedPages: true, // add the current page to the cache after each successful navigation
    cacheLength: 15, // set the cache size to 15 entries
});

Routing callbacks

var router = new PJaxRouter({
    container: document.getElementById("content"), // container where datas will be striped/appended
    cancelNavigationClass: "out", // links with that class does not trigger PJAX navigation
    cacheLinks: ".important-pages", // cache pages for all the links that have the ".important-pages" class on init and after each successful navigation
    cacheNavigatedPages: true, // add the current page to the cache after each successful navigation
    cacheLength: 15, // set the cache size to 15 entries
    
    onStart: {
        value: function(currentPage, nextPage) {
            console.log("navigation has started, do your hiding animations and stuff. Going from/to:", currentPage, nextPage);
        },
    },
    onLeaving: {
        duration: 1250,
        value: function(currentPage, nextPage) {
            console.log("1.25s has been ellapsed since navigation started, time to remove event listeners and stuff before the content will be removed. Going from/to:", currentPage, nextPage);
        },
    },
    onWaiting: {
        value: function(currentPage, nextPage) {
            console.log("data are late... maybe you could display a loader?. Going from/to:", currentPage, nextPage);
        },
    },
    onError: {
        value: function(currentPage, nextPage) {
            console.log("there has been an error while trying to retrieve the data and the navigation has been cancelled. Going from/to:", currentPage, nextPage);
        },
    },
    onReady: {
        value: function(prevPage, currentPage) {
            console.log("new data have been successfully appended, do you showing animations and register your new event listeners. Successful transition from/to:", prevPage, currentPage);
        },
    },
});

Router object

The router object returned is a PJAXRouter object with the following useful properties and methods:

Properties

Methods