malhuda/fictioneer
1
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases 112 Wiki Activity

Update lightbox

Browse Source
This commit is contained in:
Tetrakern 2023-09-18 10:02:51 +02:00
parent 99df170f10
commit 97c8ec16d7
3 changed files with 4 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
footer.php
View File

@ -68,7 +68,7 @@ do_action( 'fictioneer_after_main', $args );
<?php
// Lightbox container
if ( get_option( 'fictioneer_enable_lightbox' ) ) {
echo '<div id="fictioneer-lightbox" class="lightbox"><button type="button" class="lightbox__close" aria-label="' . esc_attr__( 'Close lightbox', 'fictioneer' ) . '">' . fictioneer_get_icon( 'fa-xmark' ) . '</button><i class="fa-solid fa-spinner fa-spin loader" style="--fa-animation-duration: .8s;"></i><div class="lightbox__content target"></div></div>';
echo '<div id="fictioneer-lightbox" class="lightbox"><button type="button" class="lightbox__close" aria-label="' . esc_attr__( 'Close lightbox', 'fictioneer' ) . '">' . fictioneer_get_icon( 'fa-xmark' ) . '</button><i class="fa-solid fa-spinner fa-spin loader" style="--fa-animation-duration: .8s;"></i><div class="lightbox__content"></div></div>';
}
// Fictioneer footer hook

2
js/lightbox.min.js vendored
View File

@ -1 +1 @@
const fcn_lightbox=_$$$("fictioneer-lightbox"),fcn_lightboxTarget=fcn_lightbox.querySelector(".target");function fcn_showLightbox(t){let e=!1,o=null;if(fcn_lightboxTarget.innerHTML="",t.classList.add("lightbox-last-trigger"),"IMG"==t.tagName?(o=t.cloneNode(),e=!0):t.href&&(o=document.createElement("img"),o.src=t.href,e=!0),e&&o){["class","style","height","width"].forEach((t=>o.removeAttribute(t))),fcn_lightboxTarget.appendChild(o),fcn_lightbox.classList.add("show");const t=fcn_lightbox.querySelector(".lightbox__close");t?.focus(),t?.blur()}}fcn_theBody.addEventListener("click",(t=>{const e=t.target.closest("[data-lightbox]:not(.no-auto-lightbox)");e&&(t.preventDefault(),fcn_showLightbox(e))})),fcn_theBody.addEventListener("keydown",(t=>{const e=t.target.closest("[data-lightbox]:not(.no-auto-lightbox)");e&&(32!=t.keyCode&&13!=t.keyCode||(t.preventDefault(),fcn_showLightbox(e)))})),document.querySelectorAll(".lightbox__close, .lightbox").forEach((t=>{t.addEventListener("click",(t=>{if("IMG"!=t.target.tagName){fcn_lightbox.classList.remove("show");const t=_$(".lightbox-last-trigger");t?.focus(),t?.blur(),t?.classList.remove("lightbox-last-trigger")}}))}));
const fcn_lightbox=_$$$("fictioneer-lightbox"),fcn_lightboxTarget=_$(".lightbox__content");function fcn_showLightbox(t){let e=!1,o=null;if(fcn_lightboxTarget.innerHTML="",t.classList.add("lightbox-last-trigger"),"IMG"==t.tagName?(o=t.cloneNode(),e=!0):t.href&&(o=document.createElement("img"),o.src=t.href,e=!0),e&&o){["class","style","height","width"].forEach((t=>o.removeAttribute(t))),fcn_lightboxTarget.appendChild(o),fcn_lightbox.classList.add("show");const t=fcn_lightbox.querySelector(".lightbox__close");t?.focus(),t?.blur()}}fcn_theBody.addEventListener("click",(t=>{const e=t.target.closest("[data-lightbox]:not(.no-auto-lightbox)");e&&(t.preventDefault(),fcn_showLightbox(e))})),fcn_theBody.addEventListener("keydown",(t=>{const e=t.target.closest("[data-lightbox]:not(.no-auto-lightbox)");e&&(32!=t.keyCode&&13!=t.keyCode||(t.preventDefault(),fcn_showLightbox(e)))})),document.querySelectorAll(".lightbox__close, .lightbox").forEach((t=>{t.addEventListener("click",(t=>{if("IMG"!=t.target.tagName){fcn_lightbox.classList.remove("show");const t=_$(".lightbox-last-trigger");t?.focus(),t?.blur(),t?.classList.remove("lightbox-last-trigger")}}))}));

4
src/js/lightbox.js
View File

@ -2,8 +2,8 @@
// SETUP
// =============================================================================
const fcn_lightbox = _$$$('fictioneer-lightbox'),
fcn_lightboxTarget = fcn_lightbox.querySelector('.target');
const /** @const {HTMLElement} */ fcn_lightbox = _$$$('fictioneer-lightbox'),
/** @const {HTMLElement} */ fcn_lightboxTarget = _$('.lightbox__content');
// =============================================================================
// SHOW LIGHTBOX