@knighttower/block-ui/dist/browser/blockui.js

A simple block ui plugin for Jquery or CashJs

(()=>{"use strict";var o={d:(e,t)=>{for(var i in t){o.o(t,i)&&!o.o(e,i)&&Object.defineProperty(e,i,{enumerable:!0,get:t[i]})}},o:(o,e)=>Object.prototype.hasOwnProperty.call(o,e),r:o=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(o,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(o,"__esModule",{value:!0})}},e={};o.r(e),o.d(e,{blockui:()=>n,default:()=>n});const t=o=>o&&"object"==typeof o&&o.constructor===Object,i=(o,...e)=>e.reduce((o,e)=>(t(e)?Object.entries(e).forEach(([e,n])=>{o[e]=t(n)&&t(o[e])?i(o[e],n):n}):Object.assign(o,e),o),{...o});const n=function(o){o.fn._fadeIn=o.fn.fadeIn;const e=o.noop||function(){};o.blockUI=o.blockui={on:function(o,e={}){t(o)&&(e=o,o=null),a(window,{content:o,...e})},off:function(o={}){s(window,o)},defaults:{loader:"<div class=x-ldr><div></div><div></div><div></div><div></div></div>",showLoader:!0,tag:"div",content:"",css:{padding:0,margin:0,width:"100vw",height:"100vh",top:"0",left:"0",textAlign:"center",color:"#000",border:"1px dashed #000",backgroundColor:"transparent",cursor:"wait",display:"flex",position:"fixed"},overlayCSS:{backgroundColor:"#000",opacity:.6,cursor:"default",position:"fixed"},cursorReset:"default",iframeSrc:/^https/i.test(window.location.href||"")?"javascript:false":"about:blank",forceIframe:!1,zindex:"auto",bindEvents:!0,constrainTabKey:!0,fadeIn:200,fadeOut:400,timeout:0,showOverlay:!0,focusInput:!0,focusableElements:":input:enabled:visible",onBlock:null,onUnblock:null,onOverlayClick:null,blockMsgClass:"x-block-ui__content",ignoreIfBlocked:!1}},o.fn.block=function(e){if(this[0]===window){return o.blockui.on(e),this}const t=i(o.blockui.defaults,e||{});return this.each(function(){const e=o(this);t.ignoreIfBlocked&&e.data("x-block-ui.isBlocked")||(e.unblock({fadeOut:0}),"static"===o.css(this,"position")&&(this.style.position="relative",e.data("x-block-ui.static",!0)),a(this,t))}),this},o.fn.unblock=function(e){return this[0]===window?(o.blockui.off(e),this):this.each(function(){s(this,e)})};let n=null,l=[];function a(t,a){o.blockui.isOn=!0,a=i(o.blockui.defaults,a);const s=t===window,c=o(t),r=o("body"),f=["<",a.tag,' class="block-ui-content-box" style="color: #FFF;">',a.content??o.blockui.defaults.content,'<span style="display:block; width:100%; height:1px; clear:both;"></span>',a.showLoader?a.loader:"","</",a.tag,">"].join("");if(a.ignoreIfBlocked&&c.data("x-block-ui.isBlocked")){return}a.overlayCSS={...o.blockui.defaults.overlayCSS,...a.overlayCSS||{}},s||(a.overlayCSS={...a.overlayCSS,position:"absolute",width:c.width(),height:c.height()}),a.onOverlayClick&&(a.overlayCSS.cursor="pointer"),c.data("x-block-ui.onUnblock",a.onUnblock);let h,b,p,k="number"!=typeof a.zindex?function(){const o=document.querySelectorAll("div, span, section, header, footer, aside, main, article");let e=0;return o.forEach(o=>{const t=window.getComputedStyle(o).zIndex;isNaN(t)||"auto"===t||(e=Math.max(e,Number(t)))}),e+1}():a.zindex;a.forceIframe&&(h=o(`<iframe class="x-block-ui" style="z-index:${k++};display:none;border:none;margin:0;padding:0;position:absolute;width:100vw;height:100vh;top:0;left:0" src="${a.iframeSrc}"></iframe>`)),b=o(`<div class="x-block-ui x-block-ui__overlay" style="z-index:${k++};display:none;border:none;margin:0;padding:0;width:100vw;height:100vh;top:0;left:0"></div>`),p=o(`<div class="x-block-ui ${a.blockMsgClass} ${s?"block-ui__page":"block-ui__element"}" style="z-index:${k+10};display:none;${s?"flex-direction: column;align-items: center;justify-content: center;":""}"></div>`),b.css(a.overlayCSS),a.forceIframe&&h.css("opacity",0);const y=s?r:c;if([h,b,p].forEach(o=>o&&o.appendTo(y)),f&&(p.css({...o.blockui.defaults.css,...a.css||{}}),s||p.css({position:"absolute",width:c.width(),height:c.height()}),p.append(f),(f.jquery||f.nodeType)&&o(f).show()),a.forceIframe&&a.showOverlay&&h.show(),a.fadeIn){const o=a.onBlock||e,t=a.showOverlay&&!f?o:e,i=f?o:e;a.showOverlay&&b._fadeIn(a.fadeIn,t),f&&p._fadeIn(a.fadeIn,i)}else{a.showOverlay&&b.show(),f&&p.show(),a.onBlock&&a.onBlock.bind(p)()}if(d(1,t,a),s&&(n=p[0],l=o(a.focusableElements,n),r.css("overflow","hidden"),a.focusInput&&setTimeout(()=>u(!1),20)),a.timeout){const e=setTimeout(()=>{s?o.blockui.off(a):c.unblock(a)},a.timeout);c.data("x-block-ui.timeout",e)}}function s(e,t){o.blockui.isOn=!1;const a=e===window,s=o(e),r=o("body"),u=s.data("x-block-ui.history"),f=s.data("x-block-ui.timeout");f&&(clearTimeout(f),s.removeData("x-block-ui.timeout")),t=i(o.blockui.defaults,t),d(0,e,t);const h=a?r.children(".x-block-ui"):s.children(".x-block-ui");t.fadeOut?h.stop().fadeOut(t.fadeOut,()=>{c(h,u,t,e)}):(h.hide(),c(h,u,t,e)),a&&(n=null,l=[],r.css("overflow",""))}function c(e,t,i,n){e.each(function(){this.parentNode&&this.parentNode.removeChild(this)});const l=o(n);if(t?.el){const{el:o,display:e,position:i,parent:n}=t;o.style.display=e,o.style.position=i,n&&n.appendChild(o),l.removeData("x-block-ui.history")}"function"==typeof i.onUnblock&&i.onUnblock(n,i)}function d(e,t,i){const l=t===window,a=o(t);if(!e&&(l&&!n||!l&&!a.data("x-block-ui.isBlocked"))){return}if(a.data("x-block-ui.isBlocked",e),!l||!i.bindEvents||e&&!i.showOverlay){return}o(document)[e?"on":"off"]("mousedown mouseup keydown keypress keyup touchstart touchend touchmove",i,r)}function r(e){if("keydown"===e.type&&9===e.keyCode&&n&&e.data.constrainTabKey){const o=l,t=!e.shiftKey&&e.target===o[o.length-1],i=e.shiftKey&&e.target===o[0];if(t||i){return setTimeout(()=>u(i),10),!1}}const t=e.data,i=o(e.target);return i.hasClass("x-block-ui__overlay")&&t.onOverlayClick&&t.onOverlayClick(e),i.parents(`div.${t.blockMsgClass}`).length>0||0===i.parents().children().filter("div.x-block-ui").length}function u(o){if(!l){return}const e=l[!0===o?l.length-1:0];e&&e.focus()}o(document).ready(function(){o("head").append("<style>.x-ldr,.x-ldr div{box-sizing:border-box}.x-ldr{display:inline-block;position:relative;width:80px;height:30px}.x-ldr div{position:absolute;top:25%;width:12px;height:12px;border-radius:50%;background:#a6a8b5;animation-timing-function:cubic-bezier(0,1,1,0)}.x-ldr div:nth-child(1),.x-ldr div:nth-child(2){left:8px}.x-ldr div:nth-child(3){left:32px}.x-ldr div:nth-child(4){left:56px}.x-ldr div:nth-child(1){animation:x-ldr1 0.6s infinite}.x-ldr div:nth-child(2),.x-ldr div:nth-child(3){animation:x-ldr2 0.6s infinite}.x-ldr div:nth-child(4){animation:x-ldr3 0.6s infinite}@keyframes x-ldr1{0%{transform:scale(0)}100%{transform:scale(1)}}@keyframes x-ldr3{0%{transform:scale(1)}100%{transform:scale(0)}}@keyframes x-ldr2{0%{transform:translate(0,0)}100%{transform:translate(24px,0)}}</style>")})}(window.$);window.blockui=e})();