paginator example

paginate.js

steal('jquery/controller', 'jquery/model', function() {


	$.Model("Paginator", {
		defaults: {
			limit: 100,
			offset: 0,
			count: Infinity
		}
	}, {
		canNext: function() {
			return this.offset <= this.count - this.limit;
		},
		canPrev: function() {
			return this.offset > 0;
		},
		prev: function() {
			this.attr("offset", this.offset - this.limit)
		},
		next: function() {
			this.attr("offset", this.offset + this.limit)
		},
		setOffset: function( newVal ) {
			if ( newVal >= this.count ) {
				return this.count - 1;
			} else if ( newVal < 0 ) {
				return 0
			} else {
				return newVal
			}
		},
		setPage: function( pageNum ) {
			this.attr("offset", (pageNum) * this.limit)
		},
		pageCount: function() {
			return Math.ceil(this.count / this.limit);
		}
	})

	paginate = new Paginator({
		count: 1000
	})

	paginate.bind("updated.attr", function() {
		console.log(this.attrs())
	})

	$.Controller("NextPrev", {
		pluginName: "foobar"
	}, {
		init: function() {
			this.draw()
		},
		"{paginate} updated.attr": function() {
			this.draw();
		},
		draw: function() {
			var paginate = this.options.paginate;
			if ( paginate.canPrev() ) {
				this.element.find('.prev').show()
			} else {
				this.element.find('.prev').hide()
			}
			if ( paginate.canNext() ) {
				this.element.find('.next').show()
			} else {
				this.element.find('.next').hide()
			}
		},
		".next click": function() {
			this.options.paginate.next();
		},
		".prev click": function() {
			this.options.paginate.prev()
		}
	})

	$("#paginate").foobar({
		paginate: paginate
	})


	$.Controller("List", {
		"{paginate} updated.attr": function( ev, attr ) {
			if ( attr != 'count' ) {
				var attrs = this.options.paginate.attrs();
				delete attrs.count;
				this.params.model.findAll(attrs, this.proxy('list'))
			}
		},
		list: function( items ) {
			this.element.html(this.option.template, items);
			this.options.paginate.attr('count', items.length)
		}
	})
})