domovoy/public/assets/js/domovoy.js

82 lines
2.9 KiB
JavaScript

(function () {
function request(method, url, body, target, swap) {
fetch(url, {
method: method,
body: body,
headers: body ? {'X-Requested-With': 'fetch'} : {'X-Requested-With': 'fetch'}
})
.then(function (response) { return response.text(); })
.then(function (html) {
if (!target) {
return;
}
if (swap === 'outerHTML') {
target.outerHTML = html;
} else {
target.innerHTML = html;
}
install(target);
});
}
function targetFor(element) {
var selector = element.getAttribute('hx-target');
return selector ? document.querySelector(selector) : element;
}
function install(root) {
root.querySelectorAll('[hx-get]').forEach(function (element) {
if (element.dataset.domovoyGetInstalled === '1') {
return;
}
element.dataset.domovoyGetInstalled = '1';
var url = element.getAttribute('hx-get');
var trigger = element.getAttribute('hx-trigger') || '';
var swap = element.getAttribute('hx-swap') || 'innerHTML';
if (element.tagName === 'FORM' && trigger.includes('change')) {
element.addEventListener('change', function () {
var params = new URLSearchParams(new FormData(element));
var nextUrl = url + '?' + params.toString();
var target = targetFor(element);
if (target) {
target.setAttribute('hx-get', nextUrl);
}
request('GET', nextUrl, null, target, swap);
});
}
if (trigger.includes('load')) {
request('GET', url, null, targetFor(element), swap);
}
var every = trigger.match(/every\s+(\d+)s/);
if (every) {
window.setInterval(function () {
request('GET', url, null, targetFor(element), swap);
}, parseInt(every[1], 10) * 1000);
}
});
root.querySelectorAll('[hx-post]').forEach(function (element) {
if (element.dataset.domovoyPostInstalled === '1') {
return;
}
element.dataset.domovoyPostInstalled = '1';
element.addEventListener('click', function () {
request(
'POST',
element.getAttribute('hx-post'),
new FormData(),
targetFor(element),
element.getAttribute('hx-swap') || 'innerHTML'
);
});
});
}
document.addEventListener('DOMContentLoaded', function () {
install(document);
});
})();