Skip to content
This repository has been archived by the owner on Apr 17, 2021. It is now read-only.

A jQuery plugin to add next/previous page annotations to web pages

License

Notifications You must be signed in to change notification settings

chocolateboy/jquery-pagerizer

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

18 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

jquery-pagerizer

A jQuery plugin to add next/previous page annotations to web pages

INSTALL

Grab the minified file from the dist directory, or use a CDN e.g.:

SYNOPSIS

// ==UserScript==
// @name          Pagerize Example
// @description   Mark up Example.com result pages with pager annotations
// @version       0.0.1
// @include       http://www.example.com/examples/*
// @require       https://code.jquery.com/jquery-3.3.1.min.js
// @require       https://cdn.jsdelivr.net/gh/chocolateboy/jquery-pagerizer@1.0.0/dist/pagerizer.min.js
// ==/UserScript==

$('a#older').addRel('prev')
$('a#newer').addRel('next')

DESCRIPTION

jQuery Pagerizer is a jQuery plugin which exposes helper methods which can be used to easily add pager annotations to web pages with missing or incorrect rel="prev" and rel="next" attributes. These annotations can then be consumed by an addon or userscript which allows pages to be navigated by keyboard e.g. the [[ and ]] key bindings in Tridactyl, Vim Vixen etc.

rel keywords are normalized to lowercase before being added or removed e.g.:

$('<a rel="NEXT"></a>').addRel('next') // <a rel="next"></a>
$('<a rel="quux"></a>').addRel('Prev') // <a rel="quux prev"></a>

Although developed to facilitate the manipulation of pager annotations, the plugin can be used to add or remove any rel keywords with the expected "token set" semantics:

$('<a></a>').addRel('foo')                      // <a rel="foo"></a>
$('<a></a>').removeRel('foo')                   // <a></a>
$('<a rel="foo"></a>').addRel('foo')            // <a rel="foo"></a>
$('<a rel="foo foo"></a>').addRel('bar')        // <a rel="foo bar"></a>
$('<a rel="foo foo"></a>').removeRel('foo')     // <a></a>
$('<a rel="foo foo bar"></a>').removeRel('foo') // <a rel="bar"></a>

INSTANCE METHODS

addRel

Signature: (...rels: Array<string>) ⇒ JQuery

$('a#older').addRel('prev')
$('a#newer').addRel('next')

Add the specified rel keywords to the matching element or elements.

findRelLinks

Signature: (...rels: Array<string>) ⇒ JQuery

const $existingLinks = $(document).findRelLinks()
const $onlyNextLinks = $(document).findRelLinks('next')

Return all A and LINK elements that have rel attributes which include any of the supplied keywords. If no rel keywords are supplied, the call is equivalent to:

findRelLinks('prev', 'previous', 'next')

removeRel

Signature: (...rels: Array<string>) ⇒ JQuery

// remove all next/previous-page rel links
$(document).findRelLinks().removeRel()

// remove the next-topic link so we can replace it with a next-page link
$('a.next-topic').removeRel('next')
$('a.current-page').next().addRel('next')

Removes the specified rel keywords from the rel attribute and returns the jQuery instance. If no rel keywords are supplied, the call is equivalent to:

removeRel('next', 'prev', 'previous')

If all rel keywords are removed, the rel attribute is removed:

$('<a rel="foo"></a>').removeRel('foo') // <a></a>

COMPATIBILITY

  • This plugin should work in any browser with ES5 support.
  • It has been tested with jQuery 3.x, and may not work with earlier versions.
  • It has been tested on Greasemonkey 3 and Violentmonkey, but should work in all current userscript engines.

SEE ALSO

AUTHOR

chocolateboy

COPYRIGHT AND LICENSE

Copyright © 2013-2019 by chocolateboy.

This is free software; you can redistribute it and/or modify it under the terms of the Artistic License 2.0.