. Emails & SMS
(function () {
function getCaption(img) {
var card = img.closest('.esw-image-card');
var caption = card ? card.querySelector('.esw-caption') : null;
return (caption && caption.textContent.trim()) || img.getAttribute('alt') || 'Feature screenshot';
}
function ensureLightbox() {
var existing = document.querySelector('.esw-stripe-lightbox');
if (existing) return existing;
var lightbox = document.createElement('div');
lightbox.className = 'esw-stripe-lightbox';
lightbox.setAttribute('aria-hidden', 'true');
lightbox.setAttribute('role', 'dialog');
lightbox.setAttribute('aria-label', 'Screenshot preview');
lightbox.innerHTML =
'
' +
'' +
'
' +
'
![]()
' +
'
' +
'
';
document.body.appendChild(lightbox);
return lightbox;
}
function initStripeFeatureLightbox() {
var root = document.querySelector('.esw-stripe-feature');
if (!root) return;
var lightbox = ensureLightbox();
var lightboxImage = lightbox.querySelector('.esw-lightbox-image');
var lightboxCaption = lightbox.querySelector('.esw-lightbox-caption');
var closeButton = lightbox.querySelector('.esw-lightbox-close');
var lastFocus = null;
root.querySelectorAll('.esw-shot').forEach(function (img) {
img.classList.add('esw-lightbox-trigger');
img.setAttribute('role', 'button');
img.setAttribute('tabindex', '0');
img.setAttribute('aria-label', 'Open screenshot preview: ' + (img.getAttribute('alt') || 'feature screenshot'));
});
function openLightbox(img) {
lastFocus = img;
lightboxImage.src = img.currentSrc || img.src;
lightboxImage.alt = img.getAttribute('alt') || 'Feature screenshot';
lightboxCaption.textContent = getCaption(img);
lightbox.classList.add('is-open');
lightbox.setAttribute('aria-hidden', 'false');
document.documentElement.classList.add('esw-lightbox-open');
document.body.classList.add('esw-lightbox-open');
closeButton.focus();
}
function closeLightbox() {
lightbox.classList.remove('is-open');
lightbox.setAttribute('aria-hidden', 'true');
document.documentElement.classList.remove('esw-lightbox-open');
document.body.classList.remove('esw-lightbox-open');
window.setTimeout(function () {
lightboxImage.src = '';
}, 180);
if (lastFocus && typeof lastFocus.focus === 'function') {
lastFocus.focus();
}
}
root.addEventListener('click', function (event) {
var img = event.target.closest('.esw-shot');
if (!img || !root.contains(img)) return;
event.preventDefault();
openLightbox(img);
});
root.addEventListener('keydown', function (event) {
if ((event.key === 'Enter' || event.key === ' ') && event.target.classList.contains('esw-shot')) {
event.preventDefault();
openLightbox(event.target);
}
});
lightbox.addEventListener('click', function (event) {
if (event.target.hasAttribute('data-esw-lightbox-close')) {
closeLightbox();
}
});
document.addEventListener('keydown', function (event) {
if (event.key === 'Escape' && lightbox.classList.contains('is-open')) {
closeLightbox();
}
});
}
if (document.readyState === 'loading') {
document.addEventListener('DOMContentLoaded', initStripeFeatureLightbox);
} else {
initStripeFeatureLightbox();
}
})();