Launch Week Day 5: Introducing Reachability for PHP.Learn More
Socket
Book a DemoSign in
Socket

pagination

Package Overview
Dependencies
Maintainers
1
Versions
17
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

pagination - npm Package Compare versions

Comparing version
0.4.2
to
0.4.3
+43
example/twitter.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" type="text/css" rel="stylesheet" />
<script src="../release/pagination.full.min.js"></script>
</head>
<body>
<div id="paging">
</div>
<script type="text/html" id="pagination-template">
<ul class="pagination">
<% if (first) { %>
<li><a href="<%=preparedPreLink + first %>">&laquo;&laquo;</a></li>
<% } %>
<% if (previous) {%>
<li><a href="<%=preparedPreLink + previous %>">&laquo;</a></li>
<% } %>
<% for ( var i = 0; i < range.length; i++ ) {
if (i == current) {%>
<li class="active"><a href="<%=preparedPreLink %><%=range[i]%>" ><%=range[i]%></a></li>
<% } else { %>
<li><a href="<%=preparedPreLink %><%=range[i]%>" ><%=range[i]%></a></li>
<% } } %>
<% if (next) { %>
<li><a href="<%=preparedPreLink + next %>">&raquo;</a></li>
<% } %>
<% if (last) {%>
<li><a href="<%=preparedPreLink + last %>">&raquo;&raquo;</a></li>
<% } %>
</ul>
</script>
<script type="text/javascript">
(function() {
var paginator = new pagination.TemplatePaginator({prelink:'/', current: 3, rowsPerPage: 200, totalResult: 10020, slashSeparator: true, template: document.getElementById("pagination-template").innerHTML});
var html = paginator.render();
console.log(html);
document.getElementById("paging").innerHTML = html;
})();
</script>
</body>
</html>
pagination = require('./index.js')
var boostrapPaginator = new pagination.TemplatePaginator({
prelink:'/', current: 3, rowsPerPage: 200,
totalResult: 10020, slashSeparator: true,
template: function(result) {
var i, len, prelink;
var html = '<div><ul class="pagination">';
if(result.pageCount < 2) {
html += '</ul></div>';
return html;
}
prelink = this.preparePreLink(result.prelink);
if(result.previous) {
html += '<li><a href="' + prelink + result.previous + '">' + this.options.translator('PREVIOUS') + '</a></li>';
}
if(result.range.length) {
for( i = 0, len = result.range.length; i < len; i++) {
if(result.range[i] === result.current) {
html += '<li class="active"><a href="' + prelink + result.range[i] + '">' + result.range[i] + '</a></li>';
} else {
html += '<li><a href="' + prelink + result.range[i] + '">' + result.range[i] + '</a></li>';
}
}
}
if(result.next) {
html += '<li><a href="' + prelink + result.next + '" class="paginator-next">' + this.options.translator('NEXT') + '</a></li>';
}
html += '</ul></div>';
return html;
}
});
console.log(boostrapPaginator.render());
+1
-1

@@ -14,3 +14,3 @@ {

},
"version": "0.4.2",
"version": "0.4.3",
"scripts": {

@@ -17,0 +17,0 @@ "test": "vows --spec tests/*"

+38
-16

@@ -14,2 +14,39 @@ ## pagination

### Or customized renderer
This example show how to generate markup for twitter boostrap, see example/twitter.html for template rendering
var pagination = require('pagination')
var boostrapPaginator = new pagination.TemplatePaginator({
prelink:'/', current: 3, rowsPerPage: 200,
totalResult: 10020, slashSeparator: true,
template: function(result) {
var i, len, prelink;
var html = '<div><ul class="pagination">';
if(result.pageCount < 2) {
html += '</ul></div>';
return html;
}
prelink = this.preparePreLink(result.prelink);
if(result.previous) {
html += '<li><a href="' + prelink + result.previous + '">' + this.options.translator('PREVIOUS') + '</a></li>';
}
if(result.range.length) {
for( i = 0, len = result.range.length; i < len; i++) {
if(result.range[i] === result.current) {
html += '<li class="active"><a href="' + prelink + result.range[i] + '">' + result.range[i] + '</a></li>';
} else {
html += '<li><a href="' + prelink + result.range[i] + '">' + result.range[i] + '</a></li>';
}
}
}
if(result.next) {
html += '<li><a href="' + prelink + result.next + '" class="paginator-next">' + this.options.translator('NEXT') + '</a></li>';
}
html += '</ul></div>';
return html;
}
});
console.log(boostrapPaginator.render());
### OR

@@ -32,17 +69,2 @@

### OR
var pagination = require('pagination');
var paginator = new pagination.ItemPaginator({prelink:'/', slashSeparator: true, current: 3, rowsPerPage: 200, totalResult: 10020});
console.log(paginator.render());
// output (without newlines)
<div class="paginator">
<span class="paginator-current-report">Results 401 - 600 of 10020</span>
<a href="/page/1" class="paginator-first">First</a>
<a href="/page/2" class="paginator-previous">Previous</a>
<a href="/page/4" class="paginator-next">Next</a>
<a href="/page/51" class="paginator-last">Last</a>
</div>
### OR need data from the calculation

@@ -205,2 +227,2 @@

## Acknowledgements
Template engine is taking mostly from https://github.com/vanng822/ejs which is a fork of https://github.com/visionmedia/ejs
Template engine is taking mostly from https://github.com/vanng822/ejs which is a fork of https://github.com/visionmedia/ejs