nanosplash 2.4.0 → 2.5.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.github/workflows/production.yml +5 -2
- package/README.md +1 -1
- package/dist/iife/nanosplash.iife.js +1 -1
- package/dist/module/manifest.json +1 -4
- package/dist/module/nanosplash.cjs.js +1 -1
- package/dist/module/nanosplash.es.js +122 -67
- package/dist/module/{Nanosplash.css → style.css} +0 -0
- package/docs/index.html +51 -19
- package/docs/nanosplash.iife.js +3 -3
- package/docs/typedoc/assets/search.js +1 -1
- package/docs/typedoc/classes/Core_Nanosplash.default.html +133 -0
- package/docs/typedoc/modules/Core_Nanosplash.html +1 -1
- package/docs/typedoc/modules/types.html +1 -1
- package/index.html +51 -19
- package/package.json +10 -9
- package/src/Core/Nanosplash.ts +160 -38
- package/src/Core/SplashInstance.ts +29 -23
- package/src/Exceptions/DestinationException.ts +13 -0
- package/src/Exceptions/Exception.ts +9 -0
- package/src/Exceptions/IllegalArgumentException.ts +11 -0
- package/src/Factory/NanosplashFactory.ts +37 -5
- package/src/Interfaces/NanosplashInterface.ts +6 -1
- package/src/{repositories → Repositories}/NanosplashRepository.ts +37 -6
- package/src/{utilities → Tests}/dom.spec.ts +7 -5
- package/src/{utilities → Utilities}/dom.ts +23 -0
- package/src/main.ts +2 -5
- package/src/types.d.ts +19 -13
- package/tsconfig.json +1 -0
- package/update-all.sh +2 -2
- package/vite.config.ts +16 -0
- package/vite.mod.config.js +10 -11
- package/docs/typedoc/classes/Core_Nanosplash.Nanosplash.html +0 -59
- package/jest.config.ts +0 -194
|
@@ -24,10 +24,13 @@ jobs:
|
|
|
24
24
|
- uses: actions/checkout@v2
|
|
25
25
|
with:
|
|
26
26
|
fetch-depth: 0
|
|
27
|
-
|
|
27
|
+
|
|
28
28
|
# Checkout branch
|
|
29
29
|
- name: Checkout
|
|
30
|
-
run:
|
|
30
|
+
run: |
|
|
31
|
+
git checkout production
|
|
32
|
+
git fetch
|
|
33
|
+
git pull origin
|
|
31
34
|
|
|
32
35
|
- name: Install npm packages
|
|
33
36
|
run: yarn install
|
package/README.md
CHANGED
|
@@ -17,7 +17,7 @@
|
|
|
17
17
|
## Import via CDN (recommended)
|
|
18
18
|
|
|
19
19
|
```html
|
|
20
|
-
<script src="https://unpkg.com/nanosplash/dist/iife/nanosplash.iife.js">
|
|
20
|
+
<script src="https://unpkg.com/nanosplash/dist/iife/nanosplash.iife.js"></script>
|
|
21
21
|
```
|
|
22
22
|
```js
|
|
23
23
|
// Install Nanosplash in the browser
|
|
@@ -1 +1 @@
|
|
|
1
|
-
var t=
|
|
1
|
+
var t=document.createElement("style");t.innerHTML=".ns-blur,body .ns-fs~*{filter:blur(5px);overflow:hidden}.ns-wrapper{position:relative}.ns-fs{left:0;min-height:100vh;min-width:100%;position:fixed;top:0;z-index:2}.ns-window{align-items:center;background-color:#fffc;display:flex;height:100%;justify-content:center;left:0;position:absolute;top:0;width:100%;z-index:1}.ns-img{margin-bottom:2em;max-height:9rem;width:9rem}.ns-text-container{align-items:center}.ns-text,.ns-text-container{display:flex;justify-content:center}.ns-text{color:#5a6685}.ns-spinner{display:flex;height:1em;margin-left:1em;width:1em}.ns-spinner>svg{stroke-width:8;-webkit-animation:Rotate 2s linear infinite;animation:Rotate 2s linear infinite;height:inherit;position:relative;width:inherit}.ns-spinner .path{stroke:#5a6685;stroke-linecap:round;-webkit-animation:Dash 1.5s ease-in-out infinite;animation:Dash 1.5s ease-in-out infinite}@-webkit-keyframes Rotate{to{transform:rotate(1turn)}}@keyframes Rotate{to{transform:rotate(1turn)}}@-webkit-keyframes Dash{0%{stroke-dasharray:1,150;stroke-dashoffset:0}50%{stroke-dasharray:90,150;stroke-dashoffset:-35}to{stroke-dasharray:90,150;stroke-dashoffset:-124}}@keyframes Dash{0%{stroke-dasharray:1,150;stroke-dashoffset:0}50%{stroke-dasharray:90,150;stroke-dashoffset:-35}to{stroke-dasharray:90,150;stroke-dashoffset:-124}}\n",document.head.appendChild(t),function(){function t(t){return document.querySelector(t)}const s=t=>document.createElement(t);function e(t,...s){t.classList.add(...s)}function i(t,s,e){t.setAttribute(s,e)}class n extends Error{constructor(t,s){super(t),this.name=this.constructor.name,this.t=s}}class r extends n{constructor(t,s,e){super(t),this.destination=s,this.t=e}}class h extends n{constructor(t,s){super(t),this.i=s}}class o{static h(s){if("string"==typeof s)try{const e=t(s);if(!e)throw new n(`No DOM match with ${s}`);return e}catch(t){throw new r(`Destination (${s}) is either invalid or non-existing in DOM`,s,t)}else if(s instanceof Node)return s;throw new h(`Destination (${s}) must be either a Node or a CSS selector`,s)}static o(t){const s={getId:()=>t.getId(),remove:()=>t.delete(),moveTo:s=>t.moveTo(s),getText:()=>t.getText(),setText:s=>t.setText(s),getImgSrc:()=>t.getImgSrc(),setImgSrc:s=>t.setImgSrc(s)};return{...s,inside:e=>(t.moveTo(e),s)}}static l(){const t=s("div");return e(t,"ns-spinner"),t.innerHTML='\n <svg viewBox="0 0 50 50">\n <circle class="path" cx="25" cy="25" r="20" fill="none"></circle>\n </svg>\n ',t}}class a{constructor(t,e,i){var n;this.u=s("div"),this.m=s("div"),this.g=s("div"),this.p=o.l(),this.v=s("div"),this.k=s("div"),this.S=s("div"),this.D=s("img"),this.id=Math.random().toString(36).substring(2),this.I=t,this.m.innerText=e,this.N=i,this.D.src=null!=(n=this.N)?n:"",this.D.alt=u.F,this.u.style.fontSize=t.T(),this.p.style.display=t.A()?"flex":"none",this.M(),this.setImgSrc(i)}C(){e(this.S,"ns-container"),e(this.k,"ns-blur"),e(this.D,"ns-img"),e(this.m,"ns-text"),e(this.g,"ns-text-container"),e(this.p,"ns-spinner"),e(this.v,"ns","ns-window"),e(this.u,"ns-wrapper")}O(){this.g.append(this.m,this.p),this.S.append(this.D,this.g),this.v.append(this.S),this.u.append(this.k,this.v)}M(){this.u.id=this.getId(),i(this.u,"data-ctx","nanosplash"),this.O(),this.C()}getId(){return this.id}getText(){return this.m.innerText}setText(t){return this.m.innerText=t,this}getImgSrc(){return this.N}setImgSrc(t){return this.D.src=null!=t?t:"",this.D.style.display=t?"block":"none",this.O(),this}R(){return this.W}$(){const t=this.u.parentElement;t&&this.j(t)}B(){i(this.u,"style",""),this.u.classList.remove("ns-fs")}H(t){const s=t.parentNode;s&&(this.j(s),s.replaceChild(this.u,t),this.k.appendChild(t))}P(){this.u.classList.add("ns-fs"),((t,s,e=!1)=>{t&&s&&(s.hasChildNodes()&&e?s.insertBefore(t,s.firstChild):s.appendChild(t))})(this.u,document.body,!0)}V(t){this.I.q(t).filter((t=>t.getId()!==this.getId())).forEach((t=>t.delete()))}moveTo(t){try{this.$(),this.W=o.h(t),this.V(this.W),this.W===document.body?this.P():(this.B(),this.H(this.W)),this.M()}catch(t){this.delete(),this.I.debug&&console.warn(t)}}G(t){Array.from(this.k.childNodes).forEach(t)}j(t){this.G((s=>t.insertBefore(s,this.u)))}J(){[this.m,this.p,this.g,this.D,this.S,this.k,this.v,this.u].forEach((t=>t.remove()))}delete(){this.$(),this.J(),this.I.delete(this)}}class c{static K(t,s,e,i){var n;return t||(t=new a(s,e,i)),t.setText(e).setImgSrc(null!=(n=t.getImgSrc())?n:i)}static L(t,s){return e=>(s=c.K(s,t,e),t.U.set(s.getId(),s),s.moveTo(document.body),o.o(s))}static X(t,s){return(...e)=>((s=c.K(s,t,"")).moveTo(document.body),(async()=>{for(const[t,[i,n]]of e.entries())s.setText(n),await i;s.delete()})(),o.o(s))}static Y(t,s){return e=>(s=c.K(s,t,""),{show:i=>(t.U.set(s.getId(),s),s.moveTo(document.body),s.setText(i),e.finally((()=>s.delete())),o.o(s))})}}const l=class{constructor(t){var s;this.debug=void 0===(null==t?void 0:t.debug)?l.Z:t._,this.N=null==t?void 0:t.N,this._=void 0===(null==t?void 0:t._)?l.tt:t._,this.fontSize=null!=(s=null==t?void 0:t.fontSize)?s:"18px",this.U=new Map}setImgSrc(t){return this.N=t,this}st(t){return this._=t,this}et(t){return this.fontSize=t,this}getImgSrc(){return this.N}A(){return this._}T(){return this.fontSize}show(t){return c.L(this,new a(this,t,this.N))(t)}progress(...t){return c.X(this,new a(this,"",this.N))(...t)}while(t){return c.Y(this,new a(this,"",this.N))(t)}it(t){const s=this.U.size,e=Array.from(this.U.values());for(let i=s-1;i>=0;i--){const s=e[i];if(!t(s.getId(),s,i))break}}delete(t){this.U.delete(t.getId())}hideAll(){this.U.forEach((t=>t.delete()))}hide(s){try{if(s){const e=s instanceof Node,i=t=>{Array.from(this.U.values()).filter((s=>s.R()===t)).forEach((t=>t.delete()))};if("string"==typeof s){const e=this.U.get(s);if(e)return void e.delete();{const e=t(s);throw e&&i(e),new n(`The CSS selector (${s}) points to a non-existing DOM element.`)}}if(!e)throw new h("The ref argument must be either a string or Node",s);i(s)}else{const t=this.U.size;this.it(((s,e,i)=>{const n=i===t-1;return n&&e.delete(),n}))}}catch(t){this.debug&&console.warn(t)}}q(t){return Array.from(this.U.values()).filter((s=>s.R()===t))}};let u=l;u.F="Nanosplash",u.tt=!0,u.Z=!0,window.addEventListener("load",(()=>{window.Nanosplash=u,window.ns=new u}))}();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
|
|
1
|
+
function t(t){return document.querySelector(t)}const s=t=>document.createElement(t);function i(t,...s){t.classList.add(...s)}function e(t,s,i){t.setAttribute(s,i)}class Exception extends Error{constructor(t,s){super(t),this.name=this.constructor.name,this.t=s}}class DestinationException extends Exception{constructor(t,s,i){super(t),this.destination=s,this.t=i}}class IllegalArgumentException extends Exception{constructor(t,s){super(t),this.i=s}}class NanosplashRepository{static h(s){if("string"==typeof s)try{const i=t(s);if(!i)throw new Exception(`No DOM match with ${s}`);return i}catch(t){throw new DestinationException(`Destination (${s}) is either invalid or non-existing in DOM`,s,t)}else if(s instanceof Node)return s;throw new IllegalArgumentException(`Destination (${s}) must be either a Node or a CSS selector`,s)}static o(t){const s={getId:()=>t.getId(),remove:()=>t.delete(),moveTo:s=>t.moveTo(s),getText:()=>t.getText(),setText:s=>t.setText(s),getImgSrc:()=>t.getImgSrc(),setImgSrc:s=>t.setImgSrc(s)};return{...s,inside:i=>(t.moveTo(i),s)}}static l(){const t=s("div");return i(t,"ns-spinner"),t.innerHTML='\n <svg viewBox="0 0 50 50">\n <circle class="path" cx="25" cy="25" r="20" fill="none"></circle>\n </svg>\n ',t}}class SplashInstance{constructor(t,i,e){var n;this.u=s("div"),this.p=s("div"),this.g=s("div"),this.m=NanosplashRepository.l(),this.S=s("div"),this.v=s("div"),this.N=s("div"),this.I=s("img"),this.id=Math.random().toString(36).substring(2),this.F=t,this.p.innerText=i,this.D=e,this.I.src=null!=(n=this.D)?n:"",this.I.alt=h.A,this.u.style.fontSize=t.getFontSize(),this.m.style.display=t.spinnerIsVisible()?"flex":"none",this.T(),this.setImgSrc(e)}R(){i(this.N,"ns-container"),i(this.v,"ns-blur"),i(this.I,"ns-img"),i(this.p,"ns-text"),i(this.g,"ns-text-container"),i(this.m,"ns-spinner"),i(this.S,"ns","ns-window"),i(this.u,"ns-wrapper")}M(){this.g.append(this.p,this.m),this.N.append(this.I,this.g),this.S.append(this.N),this.u.append(this.v,this.S)}T(){this.u.id=this.getId(),e(this.u,"data-ctx","nanosplash"),this.M(),this.R()}getId(){return this.id}getText(){return this.p.innerText}setText(t){return this.p.innerText=t,this}getImgSrc(){return this.D}setImgSrc(t){return this.I.src=null!=t?t:"",this.I.style.display=t?"block":"none",this.M(),this}getDestination(){return this.C}O(){const t=this.u.parentElement;t&&this.W(t)}$(){e(this.u,"style",""),this.u.classList.remove("ns-fs")}k(t){const s=t.parentNode;s&&(this.W(s),s.replaceChild(this.u,t),this.v.appendChild(t))}j(){this.u.classList.add("ns-fs"),((t,s,i=!1)=>{t&&s&&(s.hasChildNodes()&&i?s.insertBefore(t,s.firstChild):s.appendChild(t))})(this.u,document.body,!0)}B(t){this.F.getFromDestinationNode(t).filter((t=>t.getId()!==this.getId())).forEach((t=>t.delete()))}moveTo(t){try{this.O(),this.C=NanosplashRepository.h(t),this.B(this.C),this.C===document.body?this.j():(this.$(),this.k(this.C)),this.T()}catch(t){this.delete(),this.F.debug&&console.warn(t)}}H(t){Array.from(this.v.childNodes).forEach(t)}W(t){this.H((s=>t.insertBefore(s,this.u)))}P(){[this.p,this.m,this.g,this.I,this.N,this.v,this.S,this.u].forEach((t=>t.remove()))}delete(){this.O(),this.P(),this.F.delete(this)}}class NanosplashFactory{static V(t,s,i,e){var n;return t||(t=new SplashInstance(s,i,e)),t.setText(i).setImgSrc(null!=(n=t.getImgSrc())?n:e)}static q(t,s){return i=>(s=NanosplashFactory.V(s,t,i),t.G.set(s.getId(),s),s.moveTo(document.body),NanosplashRepository.o(s))}static J(t,s){return(...i)=>((s=NanosplashFactory.V(s,t,"")).moveTo(document.body),(async()=>{for(const[t,[e,n]]of i.entries())s.setText(n),await e;s.delete()})(),NanosplashRepository.o(s))}static K(t,s){return i=>(s=NanosplashFactory.V(s,t,""),{show:e=>(t.G.set(s.getId(),s),s.moveTo(document.body),s.setText(e),i.finally((()=>s.delete())),NanosplashRepository.o(s))})}}const n=class{constructor(t){var s;this.debug=void 0===(null==t?void 0:t.debug)?n.L:t.U,this.D=null==t?void 0:t.D,this.U=void 0===(null==t?void 0:t.U)?n.X:t.U,this.fontSize=null!=(s=null==t?void 0:t.fontSize)?s:"18px",this.G=new Map}setImgSrc(t){return this.D=t,this}showSpinner(t){return this.U=t,this}setFontSize(t){return this.fontSize=t,this}getImgSrc(){return this.D}spinnerIsVisible(){return this.U}getFontSize(){return this.fontSize}show(t){return NanosplashFactory.q(this,new SplashInstance(this,t,this.D))(t)}progress(...t){return NanosplashFactory.J(this,new SplashInstance(this,"",this.D))(...t)}while(t){return NanosplashFactory.K(this,new SplashInstance(this,"",this.D))(t)}Y(t){const s=this.G.size,i=Array.from(this.G.values());for(let e=s-1;e>=0;e--){const s=i[e];if(!t(s.getId(),s,e))break}}delete(t){this.G.delete(t.getId())}hideAll(){this.G.forEach((t=>t.delete()))}hide(s){try{if(s){const i=s instanceof Node,e=t=>{Array.from(this.G.values()).filter((s=>s.getDestination()===t)).forEach((t=>t.delete()))};if("string"==typeof s){const i=this.G.get(s);if(i)return void i.delete();{const i=t(s);throw i&&e(i),new Exception(`The CSS selector (${s}) points to a non-existing DOM element.`)}}if(!i)throw new IllegalArgumentException("The ref argument must be either a string or Node",s);e(s)}else{const t=this.G.size;this.Y(((s,i,e)=>{const n=e===t-1;return n&&i.delete(),n}))}}catch(t){this.debug&&console.warn(t)}}getFromDestinationNode(t){return Array.from(this.G.values()).filter((s=>s.getDestination()===t))}};let h=n;h.A="Nanosplash",h.X=!0,h.L=!0,module.exports=h;
|
|
@@ -1,22 +1,3 @@
|
|
|
1
|
-
var __defProp = Object.defineProperty;
|
|
2
|
-
var __defProps = Object.defineProperties;
|
|
3
|
-
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
4
|
-
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
5
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
|
-
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
7
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
8
|
-
var __spreadValues = (a, b) => {
|
|
9
|
-
for (var prop in b || (b = {}))
|
|
10
|
-
if (__hasOwnProp.call(b, prop))
|
|
11
|
-
__defNormalProp(a, prop, b[prop]);
|
|
12
|
-
if (__getOwnPropSymbols)
|
|
13
|
-
for (var prop of __getOwnPropSymbols(b)) {
|
|
14
|
-
if (__propIsEnum.call(b, prop))
|
|
15
|
-
__defNormalProp(a, prop, b[prop]);
|
|
16
|
-
}
|
|
17
|
-
return a;
|
|
18
|
-
};
|
|
19
|
-
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
20
1
|
var style = /* @__PURE__ */ (() => ".ns-blur,body .ns-fs~*{filter:blur(5px);overflow:hidden}.ns-wrapper{position:relative}.ns-fs{left:0;min-height:100vh;min-width:100%;position:fixed;top:0;z-index:2}.ns-window{align-items:center;background-color:#fffc;display:flex;height:100%;justify-content:center;left:0;position:absolute;top:0;width:100%;z-index:1}.ns-img{margin-bottom:2em;max-height:9rem;width:9rem}.ns-text-container{align-items:center}.ns-text,.ns-text-container{display:flex;justify-content:center}.ns-text{color:#5a6685}.ns-spinner{display:flex;height:1em;margin-left:1em;width:1em}.ns-spinner>svg{stroke-width:8;-webkit-animation:Rotate 2s linear infinite;animation:Rotate 2s linear infinite;height:inherit;position:relative;width:inherit}.ns-spinner .path{stroke:#5a6685;stroke-linecap:round;-webkit-animation:Dash 1.5s ease-in-out infinite;animation:Dash 1.5s ease-in-out infinite}@-webkit-keyframes Rotate{to{transform:rotate(1turn)}}@keyframes Rotate{to{transform:rotate(1turn)}}@-webkit-keyframes Dash{0%{stroke-dasharray:1,150;stroke-dashoffset:0}50%{stroke-dasharray:90,150;stroke-dashoffset:-35}to{stroke-dasharray:90,150;stroke-dashoffset:-124}}@keyframes Dash{0%{stroke-dasharray:1,150;stroke-dashoffset:0}50%{stroke-dasharray:90,150;stroke-dashoffset:-35}to{stroke-dasharray:90,150;stroke-dashoffset:-124}}\n")();
|
|
21
2
|
function get(selector) {
|
|
22
3
|
return document.querySelector(selector);
|
|
@@ -33,18 +14,42 @@ function addClass(node, ...classes) {
|
|
|
33
14
|
function setAttr(node, attribute, value) {
|
|
34
15
|
node.setAttribute(attribute, value);
|
|
35
16
|
}
|
|
17
|
+
class Exception extends Error {
|
|
18
|
+
constructor(message, cause) {
|
|
19
|
+
super(message);
|
|
20
|
+
this.name = this.constructor.name;
|
|
21
|
+
this.cause = cause;
|
|
22
|
+
}
|
|
23
|
+
}
|
|
24
|
+
class DestinationException extends Exception {
|
|
25
|
+
constructor(message, destination, cause) {
|
|
26
|
+
super(message);
|
|
27
|
+
this.destination = destination;
|
|
28
|
+
this.cause = cause;
|
|
29
|
+
}
|
|
30
|
+
}
|
|
31
|
+
class IllegalArgumentException extends Exception {
|
|
32
|
+
constructor(message, argument) {
|
|
33
|
+
super(message);
|
|
34
|
+
this.argument = argument;
|
|
35
|
+
}
|
|
36
|
+
}
|
|
36
37
|
class NanosplashRepository {
|
|
37
38
|
static destinationToNode(destination) {
|
|
38
39
|
if (typeof destination === "string") {
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
40
|
+
try {
|
|
41
|
+
const element = get(destination);
|
|
42
|
+
if (!element) {
|
|
43
|
+
throw new Exception(`No DOM match with ${destination}`);
|
|
44
|
+
}
|
|
45
|
+
return element;
|
|
46
|
+
} catch (e) {
|
|
47
|
+
throw new DestinationException(`Destination (${destination}) is either invalid or non-existing in DOM`, destination, e);
|
|
42
48
|
}
|
|
43
|
-
return element;
|
|
44
49
|
} else if (destination instanceof Node) {
|
|
45
50
|
return destination;
|
|
46
51
|
}
|
|
47
|
-
throw new
|
|
52
|
+
throw new IllegalArgumentException(`Destination (${destination}) must be either a Node or a CSS selector`, destination);
|
|
48
53
|
}
|
|
49
54
|
static createContextualApiObject(splash) {
|
|
50
55
|
const ctx = {
|
|
@@ -56,12 +61,13 @@ class NanosplashRepository {
|
|
|
56
61
|
getImgSrc: () => splash.getImgSrc(),
|
|
57
62
|
setImgSrc: (src) => splash.setImgSrc(src)
|
|
58
63
|
};
|
|
59
|
-
return
|
|
64
|
+
return {
|
|
65
|
+
...ctx,
|
|
60
66
|
inside: (selector) => {
|
|
61
67
|
splash.moveTo(selector);
|
|
62
68
|
return ctx;
|
|
63
69
|
}
|
|
64
|
-
}
|
|
70
|
+
};
|
|
65
71
|
}
|
|
66
72
|
static createNanosplashSpinnerElement() {
|
|
67
73
|
const div = mk("div");
|
|
@@ -91,8 +97,8 @@ class SplashInstance {
|
|
|
91
97
|
this.imgSrc = imgSrc;
|
|
92
98
|
this.nsImageElement.src = (_a = this.imgSrc) != null ? _a : "";
|
|
93
99
|
this.nsImageElement.alt = Nanosplash.APP_NAME;
|
|
94
|
-
this.nsRootElement.style.fontSize = ns.
|
|
95
|
-
this.nsSpinnerElement.style.display = ns.
|
|
100
|
+
this.nsRootElement.style.fontSize = ns.getFontSize();
|
|
101
|
+
this.nsSpinnerElement.style.display = ns.spinnerIsVisible() ? "flex" : "none";
|
|
96
102
|
this.assembleNSComponent();
|
|
97
103
|
this.setImgSrc(imgSrc);
|
|
98
104
|
}
|
|
@@ -165,20 +171,27 @@ class SplashInstance {
|
|
|
165
171
|
replaceSplashInstancesHavingSameDestination(destinationNode) {
|
|
166
172
|
const fnNotSameInstance = (v) => v.getId() !== this.getId();
|
|
167
173
|
const fnDelete = (v) => v.delete();
|
|
168
|
-
this.nsInstance.
|
|
174
|
+
this.nsInstance.getFromDestinationNode(destinationNode).filter(fnNotSameInstance).forEach(fnDelete);
|
|
169
175
|
}
|
|
170
176
|
moveTo(destination) {
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
177
|
+
try {
|
|
178
|
+
this.cleanAndRestore();
|
|
179
|
+
this.destinationNode = NanosplashRepository.destinationToNode(destination);
|
|
180
|
+
this.replaceSplashInstancesHavingSameDestination(this.destinationNode);
|
|
181
|
+
const targetIsBody = this.destinationNode === document.body;
|
|
182
|
+
if (targetIsBody) {
|
|
183
|
+
this.moveWithFullscreenStrategy();
|
|
184
|
+
} else {
|
|
185
|
+
this.resetFullscreenAttributes();
|
|
186
|
+
this.moveWithRegularStrategy(this.destinationNode);
|
|
187
|
+
}
|
|
188
|
+
this.assembleNSComponent();
|
|
189
|
+
} catch (e) {
|
|
190
|
+
this.delete();
|
|
191
|
+
if (this.nsInstance.debug) {
|
|
192
|
+
console.warn(e);
|
|
193
|
+
}
|
|
180
194
|
}
|
|
181
|
-
this.assembleNSComponent();
|
|
182
195
|
}
|
|
183
196
|
forEachWrappedNode(callback) {
|
|
184
197
|
Array.from(this.nsWrapperElement.childNodes).forEach(callback);
|
|
@@ -249,14 +262,36 @@ class NanosplashFactory {
|
|
|
249
262
|
};
|
|
250
263
|
}
|
|
251
264
|
}
|
|
252
|
-
class
|
|
265
|
+
const _Nanosplash = class {
|
|
253
266
|
constructor(options) {
|
|
254
|
-
var _a
|
|
255
|
-
this.
|
|
256
|
-
this.
|
|
257
|
-
this.
|
|
267
|
+
var _a;
|
|
268
|
+
this.debug = (options == null ? void 0 : options.debug) === void 0 ? _Nanosplash.DEBUG : options.spinner;
|
|
269
|
+
this.imgSrc = options == null ? void 0 : options.imgSrc;
|
|
270
|
+
this.spinner = (options == null ? void 0 : options.spinner) === void 0 ? _Nanosplash.SPINNER_DEFAULT_VISIBILITY : options.spinner;
|
|
271
|
+
this.fontSize = (_a = options == null ? void 0 : options.fontSize) != null ? _a : "18px";
|
|
258
272
|
this.instances = /* @__PURE__ */ new Map();
|
|
259
273
|
}
|
|
274
|
+
setImgSrc(value) {
|
|
275
|
+
this.imgSrc = value;
|
|
276
|
+
return this;
|
|
277
|
+
}
|
|
278
|
+
showSpinner(value) {
|
|
279
|
+
this.spinner = value;
|
|
280
|
+
return this;
|
|
281
|
+
}
|
|
282
|
+
setFontSize(value) {
|
|
283
|
+
this.fontSize = value;
|
|
284
|
+
return this;
|
|
285
|
+
}
|
|
286
|
+
getImgSrc() {
|
|
287
|
+
return this.imgSrc;
|
|
288
|
+
}
|
|
289
|
+
spinnerIsVisible() {
|
|
290
|
+
return this.spinner;
|
|
291
|
+
}
|
|
292
|
+
getFontSize() {
|
|
293
|
+
return this.fontSize;
|
|
294
|
+
}
|
|
260
295
|
show(text) {
|
|
261
296
|
return NanosplashFactory.createShowFunction(this, new SplashInstance(this, text, this.imgSrc))(text);
|
|
262
297
|
}
|
|
@@ -270,11 +305,6 @@ class Nanosplash {
|
|
|
270
305
|
const n = this.instances.size;
|
|
271
306
|
const instances = Array.from(this.instances.values());
|
|
272
307
|
for (let i = n - 1; i >= 0; i--) {
|
|
273
|
-
console.log({
|
|
274
|
-
size: n,
|
|
275
|
-
lastIdx: n - 1,
|
|
276
|
-
currentIdx: i
|
|
277
|
-
});
|
|
278
308
|
const instance = instances[i];
|
|
279
309
|
const id = instance.getId();
|
|
280
310
|
if (!callback(id, instance, i)) {
|
|
@@ -288,29 +318,54 @@ class Nanosplash {
|
|
|
288
318
|
hideAll() {
|
|
289
319
|
this.instances.forEach((instance) => instance.delete());
|
|
290
320
|
}
|
|
291
|
-
hide(
|
|
292
|
-
|
|
293
|
-
|
|
294
|
-
|
|
295
|
-
|
|
321
|
+
hide(ref) {
|
|
322
|
+
try {
|
|
323
|
+
if (ref) {
|
|
324
|
+
const isString = typeof ref === "string";
|
|
325
|
+
const isNode = ref instanceof Node;
|
|
326
|
+
const deleteInstancesWhereDestination = (destination) => {
|
|
327
|
+
Array.from(this.instances.values()).filter((v) => v.getDestination() === destination).forEach((v) => v.delete());
|
|
328
|
+
};
|
|
329
|
+
if (isString) {
|
|
330
|
+
const splashInstance = this.instances.get(ref);
|
|
331
|
+
if (splashInstance) {
|
|
332
|
+
splashInstance.delete();
|
|
333
|
+
return;
|
|
334
|
+
} else {
|
|
335
|
+
const element = get(ref);
|
|
336
|
+
if (element) {
|
|
337
|
+
deleteInstancesWhereDestination(element);
|
|
338
|
+
}
|
|
339
|
+
throw new Exception(`The CSS selector (${ref}) points to a non-existing DOM element.`);
|
|
340
|
+
}
|
|
341
|
+
} else if (isNode) {
|
|
342
|
+
deleteInstancesWhereDestination(ref);
|
|
343
|
+
} else {
|
|
344
|
+
throw new IllegalArgumentException("The ref argument must be either a string or Node", ref);
|
|
345
|
+
}
|
|
296
346
|
} else {
|
|
297
|
-
|
|
347
|
+
const n = this.instances.size;
|
|
348
|
+
this.lifoIterate((_, splashInstance, i) => {
|
|
349
|
+
const remove = i === n - 1;
|
|
350
|
+
if (remove) {
|
|
351
|
+
splashInstance.delete();
|
|
352
|
+
}
|
|
353
|
+
return remove;
|
|
354
|
+
});
|
|
355
|
+
}
|
|
356
|
+
} catch (e) {
|
|
357
|
+
if (this.debug) {
|
|
358
|
+
console.warn(e);
|
|
298
359
|
}
|
|
299
|
-
} else {
|
|
300
|
-
const n = this.instances.size;
|
|
301
|
-
this.lifoIterate((_, splashInstance, i) => {
|
|
302
|
-
const remove = i === n - 1;
|
|
303
|
-
if (remove) {
|
|
304
|
-
splashInstance.delete();
|
|
305
|
-
}
|
|
306
|
-
return remove;
|
|
307
|
-
});
|
|
308
360
|
}
|
|
309
361
|
}
|
|
310
|
-
|
|
362
|
+
getFromDestinationNode(node) {
|
|
311
363
|
const fnSameDestinationNode = (v) => v.getDestination() === node;
|
|
312
364
|
return Array.from(this.instances.values()).filter(fnSameDestinationNode);
|
|
313
365
|
}
|
|
314
|
-
}
|
|
366
|
+
};
|
|
367
|
+
let Nanosplash = _Nanosplash;
|
|
315
368
|
Nanosplash.APP_NAME = "Nanosplash";
|
|
316
|
-
|
|
369
|
+
Nanosplash.SPINNER_DEFAULT_VISIBILITY = true;
|
|
370
|
+
Nanosplash.DEBUG = true;
|
|
371
|
+
export { Nanosplash as default };
|
|
File without changes
|
package/docs/index.html
CHANGED
|
@@ -17,6 +17,21 @@
|
|
|
17
17
|
<div class="w-100 min-h-screen flex flex-col justify-center items-center">
|
|
18
18
|
<div class="text-4xl text-slate-900 drop-shadow-lg">Nanosplash</div>
|
|
19
19
|
<div class="text-pink-500 mt-3 font-mono text-sm">ns.show('text').inside('#id')</div>
|
|
20
|
+
<div class="flex gap-5">
|
|
21
|
+
<div
|
|
22
|
+
id="demo"
|
|
23
|
+
class="bg-pink-500 text-pink-200 p-3 cursor-pointer hover:text-white rounded-xl shadow-xl mt-8"
|
|
24
|
+
>
|
|
25
|
+
<i class="lni lni-play"></i>
|
|
26
|
+
Display demo
|
|
27
|
+
</div>
|
|
28
|
+
<a
|
|
29
|
+
href="#example"
|
|
30
|
+
class="bg-slate-500 text-slate-200 p-3 cursor-pointer hover:text-white rounded-xl shadow-xl mt-8"
|
|
31
|
+
>
|
|
32
|
+
Show examples
|
|
33
|
+
</a>
|
|
34
|
+
</div>
|
|
20
35
|
<div class="flex flex-col space-y-2 my-10">
|
|
21
36
|
<div class="flex space-x-2 justify-center">
|
|
22
37
|
<img src="https://badgen.net/npm/v/nanosplash" />
|
|
@@ -40,9 +55,9 @@
|
|
|
40
55
|
<a href="https://www.npmjs.com/package/nanosplash" target="_blank"><i class="lni lni-npm text-4xl hover:text-pink-500 px-5"></i></a>
|
|
41
56
|
<a href="https://github.com/isakhauge/nanosplash" target="_blank"><i class="lni lni-github-original text-2xl hover:text-pink-500 px-5"></i></a>
|
|
42
57
|
</div>
|
|
43
|
-
<a class="mt-10 text-pink-300 hover:text-pink-500" href="/typedoc">API Reference Documentation</a>
|
|
58
|
+
<a class="mt-10 text-pink-300 hover:text-pink-500" href="https://rawcdn.githack.com/isakhauge/nanosplash/0a6cdef58b0e47c0cad911952b1a329df58d2c24/docs/typedoc/index.html">API Reference Documentation</a>
|
|
44
59
|
</div>
|
|
45
|
-
<div class="grid grid-cols-1 xl:grid-cols-2 gap-1">
|
|
60
|
+
<div id="example" class="grid grid-cols-1 xl:grid-cols-2 gap-1">
|
|
46
61
|
<div id="a" class="p-20 bg-slate-100 flex flex-col items-center">
|
|
47
62
|
<div class="text-xl mb-10">Give user progress feedback</div>
|
|
48
63
|
<div class="text-white bg-slate-800 p-5 rounded-xl shadow-2xl font-mono text-sm break-all">
|
|
@@ -62,9 +77,7 @@
|
|
|
62
77
|
<div id="c" class="p-20 bg-slate-100 flex flex-col items-center">
|
|
63
78
|
<div class="text-xl mb-10">Display fullscreen</div>
|
|
64
79
|
<div class="text-white bg-slate-800 p-5 rounded-xl shadow-2xl font-mono text-sm break-all">
|
|
65
|
-
|
|
66
|
-
splash.moveTo('#myDiv')<br>
|
|
67
|
-
splash.remove()
|
|
80
|
+
ns.show('Fullscreen text')
|
|
68
81
|
</div>
|
|
69
82
|
</div>
|
|
70
83
|
<div id="d" class="p-20 bg-slate-100 flex flex-col items-center">
|
|
@@ -72,26 +85,45 @@
|
|
|
72
85
|
<div class="text-white bg-slate-800 p-5 rounded-xl shadow-2xl font-mono text-sm break-all">
|
|
73
86
|
ns.show('Loading component A').inside('#a')<br>
|
|
74
87
|
ns.show('Loading component B').inside('#b')<br>
|
|
75
|
-
ns.show('Loading component C').inside('#c')
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
88
|
+
ns.show('Loading component C').inside('#c')
|
|
89
|
+
</div>
|
|
90
|
+
</div>
|
|
91
|
+
<div id="e" class="p-20 bg-slate-100 flex flex-col items-center">
|
|
92
|
+
<div class="text-xl mb-10">Move splash instance to another destination</div>
|
|
93
|
+
<div class="text-white bg-slate-800 p-5 rounded-xl shadow-2xl font-mono text-sm break-all">
|
|
94
|
+
const splash = ns.show('Loading').inside('#a')<br>
|
|
95
|
+
splash.moveTo('#b')
|
|
96
|
+
</div>
|
|
97
|
+
</div>
|
|
98
|
+
<div id="f" class="p-20 bg-slate-100 flex flex-col items-center">
|
|
99
|
+
<div class="text-xl mb-10">Hide splash instances</div>
|
|
100
|
+
<div class="text-white bg-slate-800 p-5 rounded-xl shadow-2xl font-mono text-sm break-all">
|
|
101
|
+
// Hides one instance at a time, in a LIFO-fashion.<br>
|
|
102
|
+
ns.hide()<br><br>
|
|
103
|
+
// Hides all instances.<br>
|
|
104
|
+
ns.hideAll()
|
|
79
105
|
</div>
|
|
80
106
|
</div>
|
|
81
107
|
</div>
|
|
82
108
|
<footer>
|
|
83
109
|
|
|
84
110
|
<script>
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
111
|
+
window.addEventListener('load', () => {
|
|
112
|
+
document.getElementById('demo').onclick = function () {
|
|
113
|
+
const wait = ms => new Promise(r => setTimeout(r, ms))
|
|
114
|
+
window.ns.progress(
|
|
115
|
+
[wait(2000), 'Loading data from API'],
|
|
116
|
+
[wait(4000), 'Restructuring'],
|
|
117
|
+
[wait(6000), 'Indexing'],
|
|
118
|
+
[wait(8000), 'Give this repo a star']
|
|
119
|
+
)
|
|
120
|
+
}
|
|
121
|
+
document.getElementById('copy').onclick = function () {
|
|
122
|
+
const text = document.querySelector('[data-copy]').innerText
|
|
123
|
+
navigator.clipboard.writeText(text)
|
|
124
|
+
alert('Copied to clipboard!')
|
|
125
|
+
}
|
|
126
|
+
})
|
|
95
127
|
</script>
|
|
96
128
|
</footer>
|
|
97
129
|
<style>body{min-height:100vh}</style>
|
package/docs/nanosplash.iife.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
|
|
2
|
-
`)();function
|
|
1
|
+
(function(){"use strict";const w=function(){const e=document.createElement("link").relList;if(e&&e.supports&&e.supports("modulepreload"))return;for(const s of document.querySelectorAll('link[rel="modulepreload"]'))i(s);new MutationObserver(s=>{for(const r of s)if(r.type==="childList")for(const m of r.addedNodes)m.tagName==="LINK"&&m.rel==="modulepreload"&&i(m)}).observe(document,{childList:!0,subtree:!0});function t(s){const r={};return s.integrity&&(r.integrity=s.integrity),s.referrerpolicy&&(r.referrerPolicy=s.referrerpolicy),s.crossorigin==="use-credentials"?r.credentials="include":s.crossorigin==="anonymous"?r.credentials="omit":r.credentials="same-origin",r}function i(s){if(s.ep)return;s.ep=!0;const r=t(s);fetch(s.href,r)}};var y=(()=>`.ns-blur,body .ns-fs~*{filter:blur(5px);overflow:hidden}.ns-wrapper{position:relative}.ns-fs{left:0;min-height:100vh;min-width:100%;position:fixed;top:0;z-index:2}.ns-window{align-items:center;background-color:#fffc;display:flex;height:100%;justify-content:center;left:0;position:absolute;top:0;width:100%;z-index:1}.ns-img{margin-bottom:2em;max-height:9rem;width:9rem}.ns-text-container{align-items:center}.ns-text,.ns-text-container{display:flex;justify-content:center}.ns-text{color:#5a6685}.ns-spinner{display:flex;height:1em;margin-left:1em;width:1em}.ns-spinner>svg{stroke-width:8;-webkit-animation:Rotate 2s linear infinite;animation:Rotate 2s linear infinite;height:inherit;position:relative;width:inherit}.ns-spinner .path{stroke:#5a6685;stroke-linecap:round;-webkit-animation:Dash 1.5s ease-in-out infinite;animation:Dash 1.5s ease-in-out infinite}@-webkit-keyframes Rotate{to{transform:rotate(1turn)}}@keyframes Rotate{to{transform:rotate(1turn)}}@-webkit-keyframes Dash{0%{stroke-dasharray:1,150;stroke-dashoffset:0}50%{stroke-dasharray:90,150;stroke-dashoffset:-35}to{stroke-dasharray:90,150;stroke-dashoffset:-124}}@keyframes Dash{0%{stroke-dasharray:1,150;stroke-dashoffset:0}50%{stroke-dasharray:90,150;stroke-dashoffset:-35}to{stroke-dasharray:90,150;stroke-dashoffset:-124}}
|
|
2
|
+
`)();function g(n){return document.querySelector(n)}function p(n,e,t=!1){n&&e&&(e.hasChildNodes()&&t?e.insertBefore(n,e.firstChild):e.appendChild(n))}const a=n=>document.createElement(n);function o(n,...e){n.classList.add(...e)}function E(n,e,t){n.setAttribute(e,t)}class d extends Error{constructor(e,t){super(e),this.name=this.constructor.name,this.cause=t}}class I extends d{constructor(e,t,i){super(e),this.destination=t,this.cause=i}}class S extends d{constructor(e,t){super(e),this.argument=t}}class h{static destinationToNode(e){if(typeof e=="string")try{const t=g(e);if(!t)throw new d(`No DOM match with ${e}`);return t}catch(t){throw new I(`Destination (${e}) is either invalid or non-existing in DOM`,e,t)}else if(e instanceof Node)return e;throw new S(`Destination (${e}) must be either a Node or a CSS selector`,e)}static createContextualApiObject(e){const t={getId:()=>e.getId(),remove:()=>e.delete(),moveTo:i=>e.moveTo(i),getText:()=>e.getText(),setText:i=>e.setText(i),getImgSrc:()=>e.getImgSrc(),setImgSrc:i=>e.setImgSrc(i)};return{...t,inside:i=>(e.moveTo(i),t)}}static createNanosplashSpinnerElement(){const e=a("div");return o(e,"ns-spinner"),e.innerHTML=`
|
|
3
3
|
<svg viewBox="0 0 50 50">
|
|
4
4
|
<circle class="path" cx="25" cy="25" r="20" fill="none"></circle>
|
|
5
5
|
</svg>
|
|
6
|
-
`,e}}class
|
|
6
|
+
`,e}}class u{constructor(e,t,i){var s;this.nsRootElement=a("div"),this.nsTextElement=a("div"),this.nsTextContainerElement=a("div"),this.nsSpinnerElement=h.createNanosplashSpinnerElement(),this.nsWindowElement=a("div"),this.nsWrapperElement=a("div"),this.nsContentElement=a("div"),this.nsImageElement=a("img"),this.id=Math.random().toString(36).substring(2),this.nsInstance=e,this.nsTextElement.innerText=t,this.imgSrc=i,this.nsImageElement.src=(s=this.imgSrc)!=null?s:"",this.nsImageElement.alt=l.APP_NAME,this.nsRootElement.style.fontSize=e.getFontSize(),this.nsSpinnerElement.style.display=e.spinnerIsVisible()?"flex":"none",this.assembleNSComponent(),this.setImgSrc(i)}assignCSSClasses(){o(this.nsContentElement,"ns-container"),o(this.nsWrapperElement,"ns-blur"),o(this.nsImageElement,"ns-img"),o(this.nsTextElement,"ns-text"),o(this.nsTextContainerElement,"ns-text-container"),o(this.nsSpinnerElement,"ns-spinner"),o(this.nsWindowElement,"ns","ns-window"),o(this.nsRootElement,"ns-wrapper")}assembleElementStructure(){this.nsTextContainerElement.append(this.nsTextElement,this.nsSpinnerElement),this.nsContentElement.append(this.nsImageElement,this.nsTextContainerElement),this.nsWindowElement.append(this.nsContentElement),this.nsRootElement.append(this.nsWrapperElement,this.nsWindowElement)}assembleNSComponent(){this.nsRootElement.id=this.getId(),E(this.nsRootElement,"data-ctx","nanosplash"),this.assembleElementStructure(),this.assignCSSClasses()}getId(){return this.id}getText(){return this.nsTextElement.innerText}setText(e){return this.nsTextElement.innerText=e,this}getImgSrc(){return this.imgSrc}setImgSrc(e){return this.nsImageElement.src=e!=null?e:"",this.nsImageElement.style.display=e?"block":"none",this.assembleElementStructure(),this}getDestination(){return this.destinationNode}cleanAndRestore(){const e=this.nsRootElement.parentElement;e&&this.restoreDOMStructure(e)}resetFullscreenAttributes(){E(this.nsRootElement,"style",""),this.nsRootElement.classList.remove("ns-fs")}moveWithRegularStrategy(e){const t=e.parentNode;t&&(this.restoreDOMStructure(t),t.replaceChild(this.nsRootElement,e),this.nsWrapperElement.appendChild(e))}moveWithFullscreenStrategy(){this.nsRootElement.classList.add("ns-fs"),p(this.nsRootElement,document.body,!0)}replaceSplashInstancesHavingSameDestination(e){const t=s=>s.getId()!==this.getId(),i=s=>s.delete();this.nsInstance.getFromDestinationNode(e).filter(t).forEach(i)}moveTo(e){try{this.cleanAndRestore(),this.destinationNode=h.destinationToNode(e),this.replaceSplashInstancesHavingSameDestination(this.destinationNode),this.destinationNode===document.body?this.moveWithFullscreenStrategy():(this.resetFullscreenAttributes(),this.moveWithRegularStrategy(this.destinationNode)),this.assembleNSComponent()}catch(t){this.delete(),this.nsInstance.debug&&console.warn(t)}}forEachWrappedNode(e){Array.from(this.nsWrapperElement.childNodes).forEach(e)}restoreDOMStructure(e){this.forEachWrappedNode(t=>e.insertBefore(t,this.nsRootElement))}removeElementsFromDOM(){[this.nsTextElement,this.nsSpinnerElement,this.nsTextContainerElement,this.nsImageElement,this.nsContentElement,this.nsWrapperElement,this.nsWindowElement,this.nsRootElement].forEach(e=>e.remove())}delete(){this.cleanAndRestore(),this.removeElementsFromDOM(),this.nsInstance.delete(this)}}class c{static ensureInstance(e,t,i,s){var r;return e||(e=new u(t,i,s)),e.setText(i).setImgSrc((r=e.getImgSrc())!=null?r:s)}static createShowFunction(e,t){return i=>(t=c.ensureInstance(t,e,i),e.instances.set(t.getId(),t),t.moveTo(document.body),h.createContextualApiObject(t))}static createProgressFunction(e,t){return(...i)=>(t=c.ensureInstance(t,e,""),t.moveTo(document.body),(async()=>{for(const[s,[r,m]]of i.entries())t.setText(m),await r;t.delete()})(),h.createContextualApiObject(t))}static createWhileFunction(e,t){return i=>(t=c.ensureInstance(t,e,""),{show(s){return e.instances.set(t.getId(),t),t.moveTo(document.body),t.setText(s),i.finally(()=>t.delete()),h.createContextualApiObject(t)}})}}const f=class{constructor(n){var e;this.debug=(n==null?void 0:n.debug)===void 0?f.DEBUG:n.spinner,this.imgSrc=n==null?void 0:n.imgSrc,this.spinner=(n==null?void 0:n.spinner)===void 0?f.SPINNER_DEFAULT_VISIBILITY:n.spinner,this.fontSize=(e=n==null?void 0:n.fontSize)!=null?e:"18px",this.instances=new Map}setImgSrc(n){return this.imgSrc=n,this}showSpinner(n){return this.spinner=n,this}setFontSize(n){return this.fontSize=n,this}getImgSrc(){return this.imgSrc}spinnerIsVisible(){return this.spinner}getFontSize(){return this.fontSize}show(n){return c.createShowFunction(this,new u(this,n,this.imgSrc))(n)}progress(...n){return c.createProgressFunction(this,new u(this,"",this.imgSrc))(...n)}while(n){return c.createWhileFunction(this,new u(this,"",this.imgSrc))(n)}lifoIterate(n){const e=this.instances.size,t=Array.from(this.instances.values());for(let i=e-1;i>=0;i--){const s=t[i],r=s.getId();if(!n(r,s,i))break}}delete(n){this.instances.delete(n.getId())}hideAll(){this.instances.forEach(n=>n.delete())}hide(n){try{if(n){const e=typeof n=="string",t=n instanceof Node,i=s=>{Array.from(this.instances.values()).filter(r=>r.getDestination()===s).forEach(r=>r.delete())};if(e){const s=this.instances.get(n);if(s){s.delete();return}else{const r=g(n);throw r&&i(r),new d(`The CSS selector (${n}) points to a non-existing DOM element.`)}}else if(t)i(n);else throw new S("The ref argument must be either a string or Node",n)}else{const e=this.instances.size;this.lifoIterate((t,i,s)=>{const r=s===e-1;return r&&i.delete(),r})}}catch(e){this.debug&&console.warn(e)}}getFromDestinationNode(n){const e=t=>t.getDestination()===n;return Array.from(this.instances.values()).filter(e)}};let l=f;l.APP_NAME="Nanosplash",l.SPINNER_DEFAULT_VISIBILITY=!0,l.DEBUG=!0,window.addEventListener("load",()=>{window.Nanosplash=l,window.ns=new l})})();
|