web-mojo 2.1.46

package/dist/loader.es.js

@@ -0,0 +1,115 @@
+(function() {
+  if (document.getElementById("mojo-initial-loader")) return;
+  const n = (() => {
+    const e = document.body.classList;
+    return e.contains("mojo-loader-theme-futuristic") ? "futuristic" : e.contains("mojo-loader-theme-minimal") ? "minimal" : e.contains("mojo-loader-theme-dark") ? "dark" : e.contains("mojo-loader-theme-light") ? "light" : e.contains("mojo-loader-theme-corporate") ? "corporate" : e.contains("mojo-loader-theme-playful") ? "playful" : "default";
+  })(), m = `
+        .mojo-loader-body { overflow: hidden; }
+        .mojo-loader-container {
+            position: fixed; top: 0; left: 0; width: 100%; height: 100%;
+            z-index: 9999; display: flex; align-items: center; justify-content: center;
+            transition: opacity 0.3s ease-in-out;
+            /* Default Theme (Purple) */
+            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+        }
+        .mojo-loader-content {
+            background: rgba(255, 255, 255, 0.95); padding: 3rem; border-radius: 1rem;
+            text-align: center; box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
+            backdrop-filter: blur(10px); max-width: 400px; margin: 2rem;
+        }
+        .mojo-loader-spinner { width: 3rem; height: 3rem; border-width: 0.25em; color: #667eea; }
+        .mojo-loader-fade-out { opacity: 0; }
+
+        /* --- Standard Themes --- */
+        .mojo-loader-theme-dark .mojo-loader-container { background: linear-gradient(135deg, #2d3748 0%, #1a202c 100%); }
+        .mojo-loader-theme-dark .mojo-loader-content { background: rgba(45, 55, 72, 0.95); color: #e2e8f0; }
+        .mojo-loader-theme-dark .mojo-loader-content .text-dark { color: #e2e8f0 !important; }
+        .mojo-loader-theme-dark .mojo-loader-content .text-muted { color: #a0aec0 !important; }
+        .mojo-loader-theme-dark .mojo-loader-spinner { color: #718096; }
+        .mojo-loader-theme-light .mojo-loader-container { background: linear-gradient(135deg, #e2e8f0 0%, #f7fafc 100%); }
+        .mojo-loader-theme-light .mojo-loader-spinner { color: #a0aec0; }
+        .mojo-loader-theme-corporate .mojo-loader-container { background: linear-gradient(135deg, #3182ce 0%, #2c5282 100%); }
+        .mojo-loader-theme-corporate .mojo-loader-spinner { color: #63b3ed; }
+        .mojo-loader-theme-playful .mojo-loader-container { background: linear-gradient(135deg, #f6ad55 0%, #ed8936 100%); }
+        .mojo-loader-theme-playful .mojo-loader-spinner { color: #fbd38d; }
+
+        /* --- Animation Theme: Futuristic --- */
+        .mojo-loader-theme-futuristic .mojo-loader-container { background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%); }
+        .mojo-loader-theme-futuristic .mojo-loader-content { background: rgba(30, 41, 59, 0.9); color: #94a3b8; }
+        .mojo-loader-theme-futuristic .mojo-loader-content .text-dark { color: #e2e8f0 !important; }
+        .mojo-loader-theme-futuristic .mojo-loader-content .text-muted { color: #64748b !important; }
+        .mojo-loader-pulse-container { width: 60px; height: 60px; margin: 0 auto 1.5rem; position: relative; }
+        .mojo-loader-hexagon {
+            position: absolute; top: 0; left: 0; width: 100%; height: 100%;
+            background-color: #0ea5e9;
+            clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
+            animation: pulse 2s ease-in-out infinite;
+        }
+        .mojo-loader-hexagon:nth-child(2) { animation-delay: 0.5s; }
+        @keyframes pulse {
+            0%, 100% { transform: scale(0.8); opacity: 0.5; }
+            50% { transform: scale(1); opacity: 1; }
+        }
+
+        /* --- Animation Theme: Minimal --- */
+        .mojo-loader-theme-minimal .mojo-loader-container { background-color: #f8f9fa; }
+        .mojo-loader-theme-minimal .mojo-loader-content { background: #fff; box-shadow: 0 4px 6px rgba(0,0,0,0.05); }
+        .mojo-loader-dots-container { display: flex; justify-content: center; align-items: center; height: 60px; margin-bottom: 1rem; }
+        .mojo-loader-dot {
+            width: 12px; height: 12px; margin: 0 4px;
+            background-color: #6c757d; border-radius: 50%;
+            animation: bounce 1.4s infinite ease-in-out both;
+        }
+        .mojo-loader-dot:nth-child(1) { animation-delay: -0.32s; }
+        .mojo-loader-dot:nth-child(2) { animation-delay: -0.16s; }
+        @keyframes bounce {
+            0%, 80%, 100% { transform: scale(0); }
+            40% { transform: scale(1.0); }
+        }
+    `, s = `
+        <div class="mojo-loader-container" id="mojo-initial-loader">
+            <div class="mojo-loader-content">
+                ${(() => {
+    switch (n) {
+      case "futuristic":
+        return `
+                    <div class="mojo-loader-pulse-container">
+                        <div class="mojo-loader-hexagon"></div>
+                        <div class="mojo-loader-hexagon"></div>
+                    </div>`;
+      case "minimal":
+        return `
+                    <div class="mojo-loader-dots-container">
+                        <div class="mojo-loader-dot"></div>
+                        <div class="mojo-loader-dot"></div>
+                        <div class="mojo-loader-dot"></div>
+                    </div>`;
+      default:
+        return '<div class="spinner-border mojo-loader-spinner mb-3" role="status"><span class="visually-hidden">Loading...</span></div>';
+    }
+  })()}
+                <h4 class="text-dark mb-2">Initializing</h4>
+                <p class="text-muted mb-3" id="mojo-loading-message">Loading application...</p>
+                ${n !== "minimal" ? `
+                <div class="progress" style="height: 4px">
+                    <div class="progress-bar progress-bar-striped progress-bar-animated" role="progressbar" style="width: 0%" id="mojo-loading-progress"></div>
+                </div>` : ""}
+            </div>
+        </div>
+    `;
+  document.head.insertAdjacentHTML("beforeend", `<style>${m}</style>`), document.body.insertAdjacentHTML("beforeend", s), document.body.classList.add("mojo-loader-body");
+  const r = document.getElementById("mojo-initial-loader"), t = document.getElementById("mojo-loading-progress"), o = document.getElementById("mojo-loading-message"), d = ["Connecting...", "Loading components...", "Preparing interface...", "Finalizing..."];
+  let i = 0, a = 0;
+  const l = () => {
+    a += Math.random() * 12 + 3, a > 90 && (a = 90), t && (t.style.width = `${a}%`), Math.random() < 0.3 && i < d.length - 1 && (i++, o && (o.textContent = d[i])), a < 90 && setTimeout(l, 250 + Math.random() * 400);
+  };
+  window.hideInitialLoader = function() {
+    r && (t && (t.style.width = "100%", t.classList.remove("progress-bar-striped", "progress-bar-animated")), o && (o.textContent = "Ready!"), document.body.classList.remove("mojo-loader-body"), setTimeout(() => {
+      r.classList.add("mojo-loader-fade-out"), setTimeout(() => r.remove(), 300);
+    }, 200));
+  }, setTimeout(l, 200), setTimeout(() => {
+    document.getElementById("mojo-initial-loader") && o && (o.textContent = "This is taking longer than usual...");
+  }, 1e4), setTimeout(() => {
+    document.getElementById("mojo-initial-loader") && (console.warn("Loading timeout - forcing loader hide."), window.hideInitialLoader());
+  }, 3e4);
+})();

package/dist/loader.umd.js

@@ -0,0 +1,85 @@
+(function(r){typeof define=="function"&&define.amd?define(r):r()})(function(){"use strict";(function(){if(document.getElementById("mojo-initial-loader"))return;const d=(()=>{const e=document.body.classList;return e.contains("mojo-loader-theme-futuristic")?"futuristic":e.contains("mojo-loader-theme-minimal")?"minimal":e.contains("mojo-loader-theme-dark")?"dark":e.contains("mojo-loader-theme-light")?"light":e.contains("mojo-loader-theme-corporate")?"corporate":e.contains("mojo-loader-theme-playful")?"playful":"default"})(),s=`
+        .mojo-loader-body { overflow: hidden; }
+        .mojo-loader-container {
+            position: fixed; top: 0; left: 0; width: 100%; height: 100%;
+            z-index: 9999; display: flex; align-items: center; justify-content: center;
+            transition: opacity 0.3s ease-in-out;
+            /* Default Theme (Purple) */
+            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+        }
+        .mojo-loader-content {
+            background: rgba(255, 255, 255, 0.95); padding: 3rem; border-radius: 1rem;
+            text-align: center; box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
+            backdrop-filter: blur(10px); max-width: 400px; margin: 2rem;
+        }
+        .mojo-loader-spinner { width: 3rem; height: 3rem; border-width: 0.25em; color: #667eea; }
+        .mojo-loader-fade-out { opacity: 0; }
+
+        /* --- Standard Themes --- */
+        .mojo-loader-theme-dark .mojo-loader-container { background: linear-gradient(135deg, #2d3748 0%, #1a202c 100%); }
+        .mojo-loader-theme-dark .mojo-loader-content { background: rgba(45, 55, 72, 0.95); color: #e2e8f0; }
+        .mojo-loader-theme-dark .mojo-loader-content .text-dark { color: #e2e8f0 !important; }
+        .mojo-loader-theme-dark .mojo-loader-content .text-muted { color: #a0aec0 !important; }
+        .mojo-loader-theme-dark .mojo-loader-spinner { color: #718096; }
+        .mojo-loader-theme-light .mojo-loader-container { background: linear-gradient(135deg, #e2e8f0 0%, #f7fafc 100%); }
+        .mojo-loader-theme-light .mojo-loader-spinner { color: #a0aec0; }
+        .mojo-loader-theme-corporate .mojo-loader-container { background: linear-gradient(135deg, #3182ce 0%, #2c5282 100%); }
+        .mojo-loader-theme-corporate .mojo-loader-spinner { color: #63b3ed; }
+        .mojo-loader-theme-playful .mojo-loader-container { background: linear-gradient(135deg, #f6ad55 0%, #ed8936 100%); }
+        .mojo-loader-theme-playful .mojo-loader-spinner { color: #fbd38d; }
+
+        /* --- Animation Theme: Futuristic --- */
+        .mojo-loader-theme-futuristic .mojo-loader-container { background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%); }
+        .mojo-loader-theme-futuristic .mojo-loader-content { background: rgba(30, 41, 59, 0.9); color: #94a3b8; }
+        .mojo-loader-theme-futuristic .mojo-loader-content .text-dark { color: #e2e8f0 !important; }
+        .mojo-loader-theme-futuristic .mojo-loader-content .text-muted { color: #64748b !important; }
+        .mojo-loader-pulse-container { width: 60px; height: 60px; margin: 0 auto 1.5rem; position: relative; }
+        .mojo-loader-hexagon {
+            position: absolute; top: 0; left: 0; width: 100%; height: 100%;
+            background-color: #0ea5e9;
+            clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
+            animation: pulse 2s ease-in-out infinite;
+        }
+        .mojo-loader-hexagon:nth-child(2) { animation-delay: 0.5s; }
+        @keyframes pulse {
+            0%, 100% { transform: scale(0.8); opacity: 0.5; }
+            50% { transform: scale(1); opacity: 1; }
+        }
+
+        /* --- Animation Theme: Minimal --- */
+        .mojo-loader-theme-minimal .mojo-loader-container { background-color: #f8f9fa; }
+        .mojo-loader-theme-minimal .mojo-loader-content { background: #fff; box-shadow: 0 4px 6px rgba(0,0,0,0.05); }
+        .mojo-loader-dots-container { display: flex; justify-content: center; align-items: center; height: 60px; margin-bottom: 1rem; }
+        .mojo-loader-dot {
+            width: 12px; height: 12px; margin: 0 4px;
+            background-color: #6c757d; border-radius: 50%;
+            animation: bounce 1.4s infinite ease-in-out both;
+        }
+        .mojo-loader-dot:nth-child(1) { animation-delay: -0.32s; }
+        .mojo-loader-dot:nth-child(2) { animation-delay: -0.16s; }
+        @keyframes bounce {
+            0%, 80%, 100% { transform: scale(0); }
+            40% { transform: scale(1.0); }
+        }
+    `,c=`
+        <div class="mojo-loader-container" id="mojo-initial-loader">
+            <div class="mojo-loader-content">
+                ${(()=>{switch(d){case"futuristic":return`
+                    <div class="mojo-loader-pulse-container">
+                        <div class="mojo-loader-hexagon"></div>
+                        <div class="mojo-loader-hexagon"></div>
+                    </div>`;case"minimal":return`
+                    <div class="mojo-loader-dots-container">
+                        <div class="mojo-loader-dot"></div>
+                        <div class="mojo-loader-dot"></div>
+                        <div class="mojo-loader-dot"></div>
+                    </div>`;default:return'<div class="spinner-border mojo-loader-spinner mb-3" role="status"><span class="visually-hidden">Loading...</span></div>'}})()}
+                <h4 class="text-dark mb-2">Initializing</h4>
+                <p class="text-muted mb-3" id="mojo-loading-message">Loading application...</p>
+                ${d!=="minimal"?`
+                <div class="progress" style="height: 4px">
+                    <div class="progress-bar progress-bar-striped progress-bar-animated" role="progressbar" style="width: 0%" id="mojo-loading-progress"></div>
+                </div>`:""}
+            </div>
+        </div>
+    `;document.head.insertAdjacentHTML("beforeend",`<style>${s}</style>`),document.body.insertAdjacentHTML("beforeend",c),document.body.classList.add("mojo-loader-body");const i=document.getElementById("mojo-initial-loader"),t=document.getElementById("mojo-loading-progress"),o=document.getElementById("mojo-loading-message"),l=["Connecting...","Loading components...","Preparing interface...","Finalizing..."];let n=0,a=0;const m=()=>{a+=Math.random()*12+3,a>90&&(a=90),t&&(t.style.width=`${a}%`),Math.random()<.3&&n<l.length-1&&(n++,o&&(o.textContent=l[n])),a<90&&setTimeout(m,250+Math.random()*400)};window.hideInitialLoader=function(){i&&(t&&(t.style.width="100%",t.classList.remove("progress-bar-striped","progress-bar-animated")),o&&(o.textContent="Ready!"),document.body.classList.remove("mojo-loader-body"),setTimeout(()=>{i.classList.add("mojo-loader-fade-out"),setTimeout(()=>i.remove(),300)},200))},setTimeout(m,200),setTimeout(()=>{document.getElementById("mojo-initial-loader")&&o&&(o.textContent="This is taking longer than usual...")},1e4),setTimeout(()=>{document.getElementById("mojo-initial-loader")&&(console.warn("Loading timeout - forcing loader hide."),window.hideInitialLoader())},3e4)})()});