soheilkhaledabadi/sodino
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(banner): create better banner style

Browse Source
This commit is contained in:
soheil khaledabadi
2026-05-08 18:43:06 +03:30
parent ea68db6c01
commit 8345e94a1b
3 changed files with 214 additions and 105 deletions
Download Patch File Download Diff File Expand all files Collapse all files

75
public/js/banner-frontend.js
View File

@@ -1,5 +1,4 @@
(function () {
const closeButtons = document.querySelectorAll('.sodino-banner-close');
const clicked = new Set();
function getCookie(name) {
@@ -11,6 +10,24 @@
return null;
}
function hideBanner(banner) {
if (!banner) {
return;
}
banner.style.display = 'none';
banner.setAttribute('aria-hidden', 'true');
const bannerId = banner.dataset.bannerId;
if (bannerId) {
const backdrop = document.querySelector('.sodino-banner-backdrop[data-banner-backdrop="' + bannerId + '"]');
if (backdrop) {
backdrop.style.display = 'none';
}
document.cookie = 'sodino_banner_' + bannerId + '=hidden; path=/; max-age=' + 60 * 60 * 24;
}
}
function sendClick(bannerId) {
if (!bannerId || clicked.has(bannerId) || !window.sodinoBannerFrontend) {
return;
@@ -21,45 +38,69 @@
fetch(window.sodinoBannerFrontend.ajaxUrl, {
method: 'POST',
credentials: 'same-origin',
keepalive: true,
headers: { 'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8' },
body: 'action=sodino_banner_click&banner_id=' + encodeURIComponent(bannerId) + '&nonce=' + encodeURIComponent(window.sodinoBannerFrontend.nonce),
});
}).catch(function () {});
}
document.addEventListener('click', function (event) {
const closeButton = event.target.closest('.sodino-banner-close');
if (closeButton) {
event.preventDefault();
event.stopPropagation();
hideBanner(closeButton.closest('.sodino-banner-wrap'));
return;
}
const backdrop = event.target.closest('.sodino-banner-backdrop');
if (backdrop) {
event.preventDefault();
const banner = document.querySelector('.sodino-banner-wrap[data-banner-id="' + backdrop.dataset.bannerBackdrop + '"]');
hideBanner(banner);
return;
}
const target = event.target.closest('.sodino-banner-link');
if (target) {
const bannerId = target.dataset.bannerId;
sendClick(bannerId);
sendClick(target.dataset.bannerId);
}
});
closeButtons.forEach(function (button) {
button.addEventListener('click', function () {
const wrapper = this.closest('.sodino-banner-wrap');
if (!wrapper) {
return;
}
wrapper.style.display = 'none';
const bannerId = wrapper.dataset.bannerId;
if (bannerId) {
document.cookie = 'sodino_banner_' + bannerId + '=hidden; path=/; max-age=' + 60 * 60 * 24;
}
});
document.addEventListener('keydown', function (event) {
if (event.key !== 'Escape') {
return;
}
const popup = document.querySelector('.sodino-banner-popup:not([aria-hidden="true"])');
if (popup) {
hideBanner(popup);
}
});
document.querySelectorAll('.sodino-banner-wrap').forEach(function (banner) {
const bannerId = banner.dataset.bannerId;
if (getCookie('sodino_banner_' + bannerId) === 'hidden') {
banner.style.display = 'none';
banner.setAttribute('aria-hidden', 'true');
const backdrop = document.querySelector('.sodino-banner-backdrop[data-banner-backdrop="' + bannerId + '"]');
if (backdrop) {
backdrop.style.display = 'none';
}
return;
}
if (banner.classList.contains('sodino-banner-popup')) {
setTimeout(function () {
if (getCookie('sodino_banner_' + bannerId) !== 'hidden') {
const backdrop = document.querySelector('.sodino-banner-backdrop[data-banner-backdrop="' + bannerId + '"]');
if (backdrop) {
backdrop.style.display = 'block';
}
banner.style.display = 'block';
banner.setAttribute('aria-hidden', 'false');
}
}, 2000);
}, 900);
}
});
})();