File: D:/HostingSpaces/Neopoints/momsecurity.be/resources/assets/js/site/pagetransitionHandler.js
let pjaxReady = false;
let hasAnimationEnded = false;
let isAnimationReversed = false;
let overlayElement = document.querySelector('.pageTransitionOverlay');
let contentElement = document.querySelector(".content-holder");
let transitionEvent = whichTransitionEvent();
let linkDestination;
init();
function init() {
document.body.classList.remove('preventScroll');
document.addEventListener("pjax:error", pjaxFailed);
let links = document.querySelectorAll('a[href]:not(.pjax)');
for (let i = 0; i < links.length; i++) {
links[i].addEventListener("click", function (e) {
if (isset(e.currentTarget.href)) {
linkDestination = e.currentTarget.href;
startAnimation();
e.preventDefault();
return false;
}
});
}
MapsHandler.init();
NavigationHandler.init();
initForm();
initReferences();
overlayElement.classList.remove('down');
overlayElement.classList.remove('done');
}
function initForm() {
if(document.querySelectorAll('form').length > 0) {
console.log('initForm');
let formPjax = new Pjax({
debug: false,
elements: "form[action]", // intentionally set to an incorrect class, since we need to load Pjax manually
selectors: [
"form",
],
switches: {
"form": function (oldEl, newEl, options) {
// this is identical to the default behavior
oldEl.outerHTML = newEl.outerHTML;
this.onSwitch();
initForm();
}
},
cacheBust: false,
scrollTo: false
});
}
}
function initReferences() {
if(document.querySelectorAll('.o-referencesView').length > 0) {
document.querySelector('.o-referencesView').style.opacity = 1;
let referencesPjax = new Pjax({
debug: false,
elements: ".pjax",
selectors: [
".o-referencesView",
],
switches: {
".o-referencesView": function (oldEl, newEl, options) {
// this is identical to the default behavior
oldEl.style.opacity = 0;
newEl.style.opacity = 0;
let self = this;
window.setTimeout(function()
{
oldEl.outerHTML = newEl.outerHTML;
self.onSwitch();
initReferences();
}, 500);
}
},
cacheBust: false,
scrollTo: false
});
}
}
let pjax = new Pjax({
//debug: true,
elements: ".ajax", // intentionally set to an incorrect class, since we need to load Pjax manually
selectors: [
"title",
"meta[name=description]",
".content-holder",
],
switches: {
".content-holder": function (oldEl, newEl, options) {
// this is identical to the default behavior
oldEl.outerHTML = newEl.outerHTML;
this.onSwitch();
revertAnimation();
},
},
cacheBust: false
});
function elementTransitionEnded() {
if (overlayElement.classList.contains('down')) {
pjax.loadUrl(linkDestination);
} else if (overlayElement.classList.contains('done')) {
overlayElement.classList.remove('done');
overlayElement.removeEventListener(transitionEvent, elementTransitionEnded);
}
}
function startAnimation() {
isAnimationReversed = false;
overlayElement.addEventListener(transitionEvent, elementTransitionEnded);
overlayElement.classList.add('down');
}
function revertAnimation() {
isAnimationReversed = true;
hasAnimationEnded = false;
pjaxReady = false;
overlayElement.classList.remove('down');
overlayElement.classList.add('done');
init();
}
function pjaxFailed() {
console.log("pjax:error");
}
// Function from David Walsh: http://davidwalsh.name/css-animation-callback
function whichTransitionEvent() {
let t, el = document.createElement("fakeelement");
let transitions = {
"transition": "transitionend",
"OTransition": "oTransitionEnd",
"MozTransition": "transitionend",
"WebkitTransition": "webkitTransitionEnd"
};
for (t in transitions) {
if (el.style[t] !== undefined) {
return transitions[t];
}
}
}