Skip to content

Instantly share code, notes, and snippets.

@gifnksm gifnksm/pager.js
Created Dec 6, 2010

Embed
What would you like to do?
ページャ
(function() {
const NAMESPACE = 'mfp.xrea.jp';
if (!(NAMESPACE in window))
window[NAMESPACE] = {};
if (window[NAMESPACE].Pager !== undefined)
return;
const Pager = function(namePrefix) {
this._namePrefix = namePrefix;
this._callbacks = [];
this._numbers = [];
};
Pager.prototype = {
_namePrefix: null,
_callbacks: null,
addCallback: function(fun) {
if (typeof fun !== 'function')
return;
if (this._callbacks.indexOf(fun) === -1)
this._callbacks.push(fun);
},
removeCallback: function(fun) {
let idx = this._callbacks.indexOf(fun);
if (idx !== -1)
this._callbacks.splice(idx, 1);
},
_callCallbacks: function() {
let arg = arguments;
this._callbacks.forEach(function(f) f.apply(null, arg));
},
_length: NaN, _current: NaN,
_numbers: null,
_createLink: function(text, href) {
let link = document.createElement('a');
link.href = '#' + href;
link.className = this._namePrefix + 'page-link';
link.textContent = text;
return link;
},
update: function(length) {
this._length = length;
this.element.textContent = '';
{
let prev = this._createLink('\xab', 'prev');
prev.classList.add(this._namePrefix + 'prev-page');
this.element.appendChild(prev);
}
this._numbers = [];
for (let i = 0; i < length; i++) {
let link = this._createLink(i+1, i);
this._numbers.push(link);
this.element.appendChild(link);
}
{
let next = this._createLink('\xbb', 'next');
next.classList.add(this._namePrefix + 'next-page');
this.element.appendChild(next);
}
},
goTo: function(page) {
if (page < 0) page = 0;
if (page >= this._length) page = this._length - 1;
let prefix = this._namePrefix;
let length = this._length;
this._numbers.forEach(function(e, i) {
if (i === page)
e.classList.add(prefix + 'current-page');
else
e.classList.remove(prefix + 'current-page');
});
this._current = page;
},
goNext: function() this.goTo(this._current + 1),
goPrev: function() this.goTo(this._current - 1),
handleEvent: function(e) {
let { type, target } = e;
if (type !== 'click' || target.nodeName !== 'A')
return;
e.preventDefault();
let addr = target.getAttribute('href').slice(1);
switch (addr) {
case 'prev': this.goPrev(); break;
case 'next': this.goNext(); break;
default: this.goTo(parseInt(addr, 10)); break;
}
this._callCallbacks(this._current);
},
_element: null, get element() {
if (this._element !== null) return this._element;
this._element = document.createElement('span');
this._element.addEventListener('click', this, false);
return this._element;
}
};
window[NAMESPACE].Pager = Pager;
})();
let pager = new window['mfp.xrea.jp'].Pager('my-pager');
document.body.appendChild(pager.element);
pager.update(100);
pager.goTo(30);
pager.addCallback(function(page) {
alert("page: " + page);
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.