@knighttower/block-ui
Version:
A simple block ui plugin for Jquery or CashJs
1 lines • 6.85 kB
JavaScript
(()=>{"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=function(o){for(var e=arguments.length,n=new Array(e>1?e-1:0),l=1;l<e;l++){n[l-1]=arguments[l]}return n.reduce(((o,e)=>(t(e)?Object.entries(e).forEach((e=>{let[n,l]=e;o[n]=t(l)&&t(o[n])?i(o[n],l):l})):Object.assign(o,e),o)),{...o})};const n=function(o,e){o.fn._fadeIn=o.fn.fadeIn;const n=o.noop||function(){};o.blockUI=o.blockui={on:function(o){let i=arguments.length>1&&arguments[1]!==e?arguments[1]:{};t(o)&&(i=o,o=null),s(window,{content:o,...i})},off:function(){c(window,arguments.length>0&&arguments[0]!==e?arguments[0]:{})},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)),s(this,t))})),this},o.fn.unblock=function(e){return this[0]===window?(o.blockui.off(e),this):this.each((function(){c(this,e)}))};let l=null,a=[];function s(e,t){o.blockui.isOn=!0,t=i(o.blockui.defaults,t);const s=e===window,c=o(e),r=o("body"),u=["<",t.tag,' class="block-ui-content-box" style="color: #FFF;">',t.content??o.blockui.defaults.content,'<span style="display:block; width:100%; height:1px; clear:both;"></span>',t.showLoader?t.loader:"","</",t.tag,">"].join("");if(t.ignoreIfBlocked&&c.data("x-block-ui.isBlocked")){return}t.overlayCSS={...o.blockui.defaults.overlayCSS,...t.overlayCSS||{}},s||(t.overlayCSS={...t.overlayCSS,position:"absolute",width:c.width(),height:c.height()}),t.onOverlayClick&&(t.overlayCSS.cursor="pointer"),c.data("x-block-ui.onUnblock",t.onUnblock);let h,b,p,k="number"!=typeof t.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}():t.zindex;t.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="${t.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 ${t.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(t.overlayCSS),t.forceIframe&&h.css("opacity",0);const y=s?r:c;if([h,b,p].forEach((o=>o&&o.appendTo(y))),u&&(p.css({...o.blockui.defaults.css,...t.css||{}}),s||p.css({position:"absolute",width:c.width(),height:c.height()}),p.append(u),(u.jquery||u.nodeType)&&o(u).show()),t.forceIframe&&t.showOverlay&&h.show(),t.fadeIn){const o=t.onBlock||n,e=t.showOverlay&&!u?o:n,i=u?o:n;t.showOverlay&&b._fadeIn(t.fadeIn,e),u&&p._fadeIn(t.fadeIn,i)}else{t.showOverlay&&b.show(),u&&p.show(),t.onBlock&&t.onBlock.bind(p)()}if(d(1,e,t),s&&(l=p[0],a=o(t.focusableElements,l),r.css("overflow","hidden"),t.focusInput&&setTimeout((()=>f(!1)),20)),t.timeout){const e=setTimeout((()=>{s?o.blockui.off(t):c.unblock(t)}),t.timeout);c.data("x-block-ui.timeout",e)}}function c(e,t){o.blockui.isOn=!1;const n=e===window,s=o(e),c=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=n?c.children(".x-block-ui"):s.children(".x-block-ui");t.fadeOut?h.stop().fadeOut(t.fadeOut,(()=>{r(h,u,t,e)})):(h.hide(),r(h,u,t,e)),n&&(l=null,a=[],c.css("overflow",""))}function r(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 n=t===window,a=o(t);if(!e&&(n&&!l||!n&&!a.data("x-block-ui.isBlocked"))){return}if(a.data("x-block-ui.isBlocked",e),!n||!i.bindEvents||e&&!i.showOverlay){return}o(document)[e?"on":"off"]("mousedown mouseup keydown keypress keyup touchstart touchend touchmove",i,u)}function u(e){if("keydown"===e.type&&9===e.keyCode&&l&&e.data.constrainTabKey){const o=a,t=!e.shiftKey&&e.target===o[o.length-1],i=e.shiftKey&&e.target===o[0];if(t||i){return setTimeout((()=>f(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 f(o){if(!a){return}const e=a[!0===o?a.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})();