amisa-pagination
Version:
amisa.pagination component of amisa!
326 lines (324 loc) • 18.2 kB
JavaScript
var __defProp = Object.defineProperty;
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: !0, configurable: !0, writable: !0, value }) : obj[key] = value;
var __publicField = (obj, key, value) => (__defNormalProp(obj, typeof key != "symbol" ? key + "" : key, value), value), __accessCheck = (obj, member, msg) => {
if (!member.has(obj))
throw TypeError("Cannot " + msg);
};
var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), getter ? getter.call(obj) : member.get(obj)), __privateAdd = (obj, member, value) => {
if (member.has(obj))
throw TypeError("Cannot add the same private member more than once");
member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
}, __privateSet = (obj, member, value, setter) => (__accessCheck(obj, member, "write to private field"), setter ? setter.call(obj, value) : member.set(obj, value), value);
var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "access private method"), method);
var _styleElement;
class PaginationStyleManager {
constructor(paginationManager) {
__privateAdd(this, _styleElement, void 0);
this.paginationManager = paginationManager, __privateSet(this, _styleElement, document.createElement("style")), __privateGet(this, _styleElement).textContent = `
nav {
width: 100%;
padding-top:3px;
padding-bottom:3px;
display: block;
}
ul {
display: flex;
align-items: center;
justify-content: center;
padding-left: 0;
list-style: none;
border-radius: 0.25rem;
margin-top: 0.1rem;
margin-bottom: 0.1rem;
}
ul > li:first-child > button {
margin-right: 0;
border-top-right-radius: 0.25rem;
border-bottom-right-radius: 0.25rem;
}
ul > li:last-child > button {
border-top-left-radius: 0.25rem;
border-bottom-left-radius: 0.25rem;
}
button.separator {
display: block;
padding: 0.4rem 0.6rem;
margin-left: -1px;
color: #6c757d;
pointer-events: none;
cursor: auto;
background-color: #2c343f;
border: 1px solid #dee2e6;
border-radius: 0;
}
button {
display: block;
padding: 0.4rem 0.6rem;
margin-left: -1px;
color: rgba(255, 255, 255, 0.7);
background-color: #2c343f;
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 0;
min-width: 38px;
}
button:disabled {
color: #6c757d;
pointer-events: none;
cursor: auto;
background-color: #2c343f;
border-color: rgba(255, 255, 255, 0.2);
}button.active {
z-index: 1;
color: #1e2b41;
background-color: rgba(255, 255, 255, 0.7);
border-color: rgba(255, 255, 255, 0.2);
}
button:hover:not(.active) {
color: #0056b3;
text-decoration: none;
background-color: #e9ecef;
border-color: rgba(255, 255, 255, 0.2);
}
button:focus {
z-index: 2;
outline: 0;
box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
}
button:not(:disabled):not(.disabled) {
cursor: pointer;
}
`;
}
get styleElement() {
return __privateGet(this, _styleElement);
}
}
_styleElement = new WeakMap();
var _navElement, _ulElement;
class PaginationNavManager {
constructor(paginationManager) {
__privateAdd(this, _navElement, void 0);
__privateAdd(this, _ulElement, void 0);
__publicField(this, "remove", () => {
});
__publicField(this, "create", () => {
__privateGet(this, _navElement).classList.add("pagination"), this.initialize(), __privateGet(this, _navElement).appendChild(this.paginationManager.paginationStyleManager.styleElement), __privateGet(this, _navElement).appendChild(__privateGet(this, _ulElement));
});
__publicField(this, "initialize", () => {
this.paginationManager.pagesManager.previousPageManager.refresh(), __privateGet(this, _ulElement).appendChild(this.paginationManager.pagesManager.previousPageManager.liElement), this.paginationManager.pagesManager.pagesButton.forEach((element) => {
__privateGet(this, _ulElement).appendChild(element.liElement);
}), this.paginationManager.pagesManager.nextPageManager.refresh(), __privateGet(this, _ulElement).appendChild(this.paginationManager.pagesManager.nextPageManager.liElement);
});
__publicField(this, "refresh", () => {
this.paginationManager.pagesManager.refresh(), this.initialize();
});
this.paginationManager = paginationManager, __privateSet(this, _navElement, document.createElement("nav")), __privateGet(this, _navElement).style.userSelect = "none", __privateSet(this, _ulElement, document.createElement("ul")), this.create();
}
get navElement() {
return __privateGet(this, _navElement);
}
get ulElement() {
return __privateGet(this, _ulElement);
}
}
_navElement = new WeakMap(), _ulElement = new WeakMap();
var _liElement, _buttonElement, _onClick;
class PageButtonManagerBase {
constructor(paginationManager) {
__privateAdd(this, _liElement, void 0);
__privateAdd(this, _buttonElement, void 0);
__publicField(this, "refresh", () => {
__privateGet(this, _buttonElement).disabled = this.disabled, __privateGet(this, _buttonElement).textContent = this.caption, typeof this.pageNumber == "number" && this.pageNumber === this.paginationManager.currentPage && __privateGet(this, _buttonElement).classList.add("active");
});
__publicField(this, "remove", () => {
this.liElement.remove();
});
__privateAdd(this, _onClick, (e) => {
e.preventDefault(), this.onClick();
});
this.paginationManager = paginationManager, __privateSet(this, _liElement, document.createElement("li")), __privateSet(this, _buttonElement, document.createElement("button")), __privateGet(this, _liElement).appendChild(__privateGet(this, _buttonElement)), __privateGet(this, _buttonElement).addEventListener("click", __privateGet(this, _onClick));
}
get liElement() {
return __privateGet(this, _liElement);
}
get buttonElement() {
return __privateGet(this, _buttonElement);
}
}
_liElement = new WeakMap(), _buttonElement = new WeakMap(), _onClick = new WeakMap();
class NextPageManager extends PageButtonManagerBase {
get disabled() {
return this.paginationManager.currentPage >= this.paginationManager.totalPages;
}
get caption() {
return "بعد";
}
get pageNumber() {
}
constructor(paginationManager) {
super(paginationManager), this.refresh();
}
onClick() {
this.paginationManager.currentPage < this.paginationManager.totalPages && this.paginationManager.setActivePage(this.paginationManager.currentPage + 1);
}
}
class PageButtonNumberManager extends PageButtonManagerBase {
constructor(paginationManager, pageNumber) {
super(paginationManager), this.pageNumber = pageNumber, this.refresh();
}
get disabled() {
return !1;
}
get caption() {
var _a;
return ((_a = this.pageNumber) == null ? void 0 : _a.toString()) || "??";
}
onClick() {
this.paginationManager.setActivePage(this.pageNumber);
}
}
class PageButtonSeperatorManager extends PageButtonManagerBase {
get disabled() {
return !0;
}
get caption() {
return "...";
}
get pageNumber() {
}
constructor(paginationManager) {
super(paginationManager), this.buttonElement.classList.add("separator"), this.refresh();
}
onClick() {
}
}
class PreviousPageManager extends PageButtonManagerBase {
get disabled() {
return this.paginationManager.currentPage === 1;
}
get caption() {
return "قبل";
}
get pageNumber() {
}
constructor(paginationManager) {
super(paginationManager), this.refresh();
}
onClick() {
this.paginationManager.currentPage > 1 && this.paginationManager.setActivePage(this.paginationManager.currentPage - 1);
}
}
var _totalPages, totalPages_get, _currentPage, currentPage_get, _previousPageManager, _nextPageManager, _pages, _initializeLessThan11, _initializeLessThan16, initializeLessThan16_fn, _initializeLessThan16To8, initializeLessThan16To8_fn, _initializeLessThan16MoreThan8, initializeLessThan16MoreThan8_fn, _initializeMoreThan15;
class PagesManager {
constructor(paginationManager) {
__privateAdd(this, _totalPages);
__privateAdd(this, _currentPage);
__privateAdd(this, _initializeLessThan16);
__privateAdd(this, _initializeLessThan16To8);
__privateAdd(this, _initializeLessThan16MoreThan8);
__privateAdd(this, _previousPageManager, void 0);
__privateAdd(this, _nextPageManager, void 0);
__privateAdd(this, _pages, []);
__publicField(this, "initialize", () => {
__privateSet(this, _pages, []), this.paginationManager.totalPages < 11 ? __privateGet(this, _initializeLessThan11).call(this) : this.paginationManager.totalPages < 16 ? __privateMethod(this, _initializeLessThan16, initializeLessThan16_fn).call(this) : __privateGet(this, _initializeMoreThan15).call(this);
});
__privateAdd(this, _initializeLessThan11, () => {
for (let page = 1; page <= this.paginationManager.totalPages; page++)
__privateGet(this, _pages).push(new PageButtonNumberManager(this.paginationManager, page));
});
__privateAdd(this, _initializeMoreThan15, () => {
if (__privateGet(this, _currentPage, currentPage_get) < 5)
__privateGet(this, _pages).push(new PageButtonNumberManager(this.paginationManager, 1)), __privateGet(this, _pages).push(new PageButtonNumberManager(this.paginationManager, 2)), __privateGet(this, _pages).push(new PageButtonNumberManager(this.paginationManager, 3)), __privateGet(this, _pages).push(new PageButtonNumberManager(this.paginationManager, 4)), __privateGet(this, _pages).push(new PageButtonNumberManager(this.paginationManager, 5)), __privateGet(this, _pages).push(new PageButtonSeperatorManager(this.paginationManager)), __privateGet(this, _pages).push(new PageButtonNumberManager(this.paginationManager, __privateGet(this, _totalPages, totalPages_get) - 2)), __privateGet(this, _pages).push(new PageButtonNumberManager(this.paginationManager, __privateGet(this, _totalPages, totalPages_get) - 1)), __privateGet(this, _pages).push(new PageButtonNumberManager(this.paginationManager, __privateGet(this, _totalPages, totalPages_get) - 0));
else if (__privateGet(this, _currentPage, currentPage_get) > 4 && __privateGet(this, _currentPage, currentPage_get) < __privateGet(this, _totalPages, totalPages_get) - 3)
__privateGet(this, _pages).push(new PageButtonNumberManager(this.paginationManager, 1)), __privateGet(this, _pages).push(new PageButtonNumberManager(this.paginationManager, 2)), __privateGet(this, _pages).push(new PageButtonSeperatorManager(this.paginationManager)), __privateGet(this, _pages).push(new PageButtonNumberManager(this.paginationManager, __privateGet(this, _currentPage, currentPage_get) - 1)), __privateGet(this, _pages).push(new PageButtonNumberManager(this.paginationManager, __privateGet(this, _currentPage, currentPage_get) - 0)), __privateGet(this, _pages).push(new PageButtonNumberManager(this.paginationManager, __privateGet(this, _currentPage, currentPage_get) + 1)), __privateGet(this, _pages).push(new PageButtonSeperatorManager(this.paginationManager)), __privateGet(this, _pages).push(new PageButtonNumberManager(this.paginationManager, __privateGet(this, _totalPages, totalPages_get) - 1)), __privateGet(this, _pages).push(new PageButtonNumberManager(this.paginationManager, __privateGet(this, _totalPages, totalPages_get) - 0));
else if (__privateGet(this, _currentPage, currentPage_get) >= this.totalPages_3 && __privateGet(this, _currentPage, currentPage_get) <= __privateGet(this, _totalPages, totalPages_get))
__privateGet(this, _pages).push(new PageButtonNumberManager(this.paginationManager, 1)), __privateGet(this, _pages).push(new PageButtonNumberManager(this.paginationManager, 2)), __privateGet(this, _pages).push(new PageButtonSeperatorManager(this.paginationManager)), __privateGet(this, _pages).push(new PageButtonNumberManager(this.paginationManager, __privateGet(this, _totalPages, totalPages_get) - 5)), __privateGet(this, _pages).push(new PageButtonNumberManager(this.paginationManager, __privateGet(this, _totalPages, totalPages_get) - 4)), __privateGet(this, _pages).push(new PageButtonNumberManager(this.paginationManager, __privateGet(this, _totalPages, totalPages_get) - 3)), __privateGet(this, _pages).push(new PageButtonNumberManager(this.paginationManager, __privateGet(this, _totalPages, totalPages_get) - 2)), __privateGet(this, _pages).push(new PageButtonNumberManager(this.paginationManager, __privateGet(this, _totalPages, totalPages_get) - 1)), __privateGet(this, _pages).push(new PageButtonNumberManager(this.paginationManager, __privateGet(this, _totalPages, totalPages_get) - 0));
else
throw new Error(`Total page : '${__privateGet(this, _totalPages, totalPages_get)}' Current Page: '${__privateGet(this, _currentPage, currentPage_get)}'`);
});
__publicField(this, "refresh", () => {
__privateGet(this, _previousPageManager).remove(), __privateGet(this, _pages).forEach((button) => {
button.liElement.remove();
}), __privateGet(this, _nextPageManager).remove(), this.initialize();
});
this.paginationManager = paginationManager, __privateSet(this, _previousPageManager, new PreviousPageManager(this.paginationManager)), __privateSet(this, _nextPageManager, new NextPageManager(this.paginationManager));
}
get previousPageManager() {
return __privateGet(this, _previousPageManager);
}
get nextPageManager() {
return __privateGet(this, _nextPageManager);
}
get pagesButton() {
return __privateGet(this, _pages);
}
get totalPages_3() {
return __privateGet(this, _totalPages, totalPages_get) - 3;
}
}
_totalPages = new WeakSet(), totalPages_get = function() {
return this.paginationManager.totalPages;
}, _currentPage = new WeakSet(), currentPage_get = function() {
return this.paginationManager.currentPage;
}, _previousPageManager = new WeakMap(), _nextPageManager = new WeakMap(), _pages = new WeakMap(), _initializeLessThan11 = new WeakMap(), _initializeLessThan16 = new WeakSet(), initializeLessThan16_fn = function() {
__privateGet(this, _currentPage, currentPage_get) < 8 ? __privateMethod(this, _initializeLessThan16To8, initializeLessThan16To8_fn).call(this) : __privateMethod(this, _initializeLessThan16MoreThan8, initializeLessThan16MoreThan8_fn).call(this);
}, _initializeLessThan16To8 = new WeakSet(), initializeLessThan16To8_fn = function() {
for (let pageNumber = 1; pageNumber <= 8; pageNumber++)
__privateGet(this, _pages).push(new PageButtonNumberManager(this.paginationManager, pageNumber));
__privateGet(this, _pages).push(new PageButtonSeperatorManager(this.paginationManager)), __privateGet(this, _pages).push(new PageButtonNumberManager(this.paginationManager, __privateGet(this, _totalPages, totalPages_get) - 1)), __privateGet(this, _pages).push(new PageButtonNumberManager(this.paginationManager, __privateGet(this, _totalPages, totalPages_get)));
}, _initializeLessThan16MoreThan8 = new WeakSet(), initializeLessThan16MoreThan8_fn = function() {
__privateGet(this, _pages).push(new PageButtonNumberManager(this.paginationManager, 1)), __privateGet(this, _pages).push(new PageButtonNumberManager(this.paginationManager, 2)), __privateGet(this, _pages).push(new PageButtonSeperatorManager(this.paginationManager));
for (let pageNumber = __privateGet(this, _totalPages, totalPages_get) - 8; pageNumber <= __privateGet(this, _totalPages, totalPages_get); pageNumber++)
__privateGet(this, _pages).push(new PageButtonNumberManager(this.paginationManager, pageNumber));
}, _initializeMoreThan15 = new WeakMap();
var _paginationNavManager, _paginationStyleManager, _pagesManager, _currentPage2, _totalPages2, _triggerEvents, _events;
class PaginationManager {
constructor() {
__privateAdd(this, _paginationNavManager, void 0);
__privateAdd(this, _paginationStyleManager, void 0);
__privateAdd(this, _pagesManager, void 0);
__privateAdd(this, _currentPage2, 1);
__privateAdd(this, _totalPages2, 1);
__publicField(this, "setActivePage", (newPageNumber) => {
__privateGet(this, _triggerEvents).call(this, "onCurrentPageChange", newPageNumber, __privateGet(this, _currentPage2)), __privateSet(this, _currentPage2, newPageNumber), __privateGet(this, _paginationNavManager).refresh();
});
__publicField(this, "setData", (totalPages, currentPage) => {
__privateSet(this, _totalPages2, totalPages || 1), __privateSet(this, _currentPage2, currentPage || 1), this.refresh();
});
__publicField(this, "refresh", () => {
__privateGet(this, _paginationNavManager).refresh();
});
__privateAdd(this, _triggerEvents, async (eventName, newPageNumber, oldPageNumber) => {
__privateGet(this, _events).filter((i) => i[0] === eventName).forEach(async (eventData) => {
eventData[1](newPageNumber, oldPageNumber);
});
});
__publicField(this, "addEventListener", (eventName, eventCallBackFunction) => {
__privateGet(this, _events).push([eventName, eventCallBackFunction]);
});
__privateAdd(this, _events, []);
__privateSet(this, _pagesManager, new PagesManager(this)), __privateSet(this, _paginationStyleManager, new PaginationStyleManager(this)), __privateSet(this, _paginationNavManager, new PaginationNavManager(this));
}
get paginationNavManager() {
return __privateGet(this, _paginationNavManager);
}
get paginationStyleManager() {
return __privateGet(this, _paginationStyleManager);
}
get pagesManager() {
return __privateGet(this, _pagesManager);
}
get navElement() {
return __privateGet(this, _paginationNavManager).navElement;
}
get currentPage() {
return __privateGet(this, _currentPage2);
}
get totalPages() {
return __privateGet(this, _totalPages2);
}
}
_paginationNavManager = new WeakMap(), _paginationStyleManager = new WeakMap(), _pagesManager = new WeakMap(), _currentPage2 = new WeakMap(), _totalPages2 = new WeakMap(), _triggerEvents = new WeakMap(), _events = new WeakMap();
export {
PaginationManager
};