const ONDH = {
spinner: null,
init() {
this.spinner = document.createElement('div');
this.spinner.className = 'ondh-spinner';
this.spinner.innerHTML = '⏳';
document.body.appendChild(this.spinner);
document.addEventListener('click', this.handleClick.bind(this));
window.addEventListener('popstate', this.handlePopState.bind(this));
this.loadFromUrl();
},
handleClick(e) {
const a = e.target.closest('.ondh-pagination a');
if (!a) return;
e.preventDefault();
const wrap = document.querySelector('#ondh-shop-products');
if (!wrap) return;
const page = a.dataset.page || 1;
this.loadPage(page, wrap.dataset.limit || 12);
history.pushState({page}, '', `?p=${page}`); // 👈 ?p=20
},
loadPage(page, limit) {
const wrap = document.querySelector('#ondh-shop-products');
this.spinner.style.display = 'block';
const fd = new FormData();
fd.append('action', 'ondh_shop_products_ajax');
fd.append('page', page);
fd.append('limit', limit);
fetch('http://het-onderdelenhuis.be/wp-admin/admin-ajax.php', {
method: 'POST',
credentials: 'same-origin',
body: fd
})
.then(r => r.text())
.then(html => {
wrap.innerHTML = html;
this.spinner.style.display = 'none';
})
.catch(() => this.spinner.style.display = 'none');
},
loadFromUrl() {
const urlParams = new URLSearchParams(window.location.search);
const page = urlParams.get('p'); // 👈 Read ?p=20
if (page && page > 1) {
this.loadPage(page, document.querySelector('#ondh-shop-products')?.dataset.limit || 12);
}
},
handlePopState(e) {
const urlParams = new URLSearchParams(window.location.search);
const page = urlParams.get('p') || 1; // 👈 Read ?p=
this.loadPage(page, document.querySelector('#ondh-shop-products')?.dataset.limit || 12);
}
};
ONDH.init();
V0060445 | Het Onderdelenhuis.be
