estreui 1.2.2 → 1.2.4

package/scripts/boot.js

@@ -13,7 +13,7 @@ const isSamsungMobile = isSamsungBrowser && isMobile;
 
 
 window.isLog = true;
-window.isDebug = true;
+window.isDebug = location.host.replace("class.mangoedu.co.kr", "").length > 0;
 window.isVerbose = false;
 Object.defineProperty(window, "isLogging", {
     "get": function () { return this.isLog || this.isDebug; },
@@ -44,7 +44,7 @@ const updateInsets = function (e) {
         root.style.setProperty('--fvw', `${width}px`);
         root.style.setProperty('--fvh', `${height}px`);
     }
-
+    
     const vvpw = vvp.width;
     const vvph = vvp.height;
     const vvpt = vvp.offsetTop;
@@ -86,7 +86,6 @@ if (isAppleMobile) {
     document.documentElement.style.setProperty('--viewport-inset-bottom', 'var(--safe-area-inset-bottom)');
 }
 
-
 const releaseInsetForApp = () => {
     const insets = window.safeAreaInsets;
 
@@ -112,20 +111,39 @@ window.addEventListener('safeAreaInsetsChanged', function () {
 releaseInsetForApp();
 
 
-// Service Worker
-
+/**
+ * Service Worker management handler.
+ * Tracks the registration/install/waiting/activation lifecycle and performs cache management via messaging protocol.
+ * 4-tier cache strategy: Application / Common / Static / Stony.
+ * @type {Object}
+ */
 const serviceWorkerHandler = {
+    /** @type {ServiceWorkerRegistration|null} Service worker registration object. */
     registeration: null,
+    /** @type {ServiceWorker|null} Installing worker. */
     installing: null,
+    /** @type {ServiceWorker|null} Waiting worker. */
     waiting: null,
+    /** @type {ServiceWorker|null} Activating worker. */
     activating: null,
+    /** @type {ServiceWorker|null} Activated worker. */
     activated: null,
+    /** @type {boolean|null} Whether this is a fresh install. */
     isInitialSetup: null,
 
+    /** @type {ServiceWorkerContainer} navigator.serviceWorker. */
     get service() { return navigator.serviceWorker; },
+    /** @type {ServiceWorker|null} Current controller. */
     get controller() { return this.service?.controller; },
+    /** @type {ServiceWorker|null} Latest worker (in order: controller → activated → activating → waiting → installing). */
     get worker() { return this.controller ?? this.activated ?? this.activating ?? this.waiting ?? this.installing; },
 
+    /**
+     * Sends a message to the worker.
+     * @param {ServiceWorker|null} worker - Target worker. If null, uses current worker.
+     * @param {Object} message - Message object to send.
+     * @param {Transferable[]} [transfer] - Transferable objects.
+     */
     postMessage(worker, message, transfer) {
         (worker ?? this.worker)?.postMessage(message, transfer);
     },
@@ -152,6 +170,7 @@ const serviceWorkerHandler = {
         }
     },
 
+    /** Checks for service worker updates. @returns {Promise<ServiceWorker|false|null|undefined>} */
     async update() {
         if (this.registeration == null) return null;
         try {
@@ -171,6 +190,7 @@ const serviceWorkerHandler = {
 
     registerationOnInstalling(worker) {
         this.installing = worker;
+        // this.controller?.let(it => this.clearCache(it));
         this.onInstalling?.(worker);
     },
 
@@ -231,7 +251,7 @@ const serviceWorkerHandler = {
     controllerChangeListener(event) {
         if (isVerbosely) console.log("Service Worker controller changed:", event, "\n", serviceWorkerHandler.service.controller);
         else if (isLogging) console.log("Service Worker controller changed:", event.scriptURL);
-        serviceWorkerHandler.controllerOnChanged(event);
+        serviceWorkerHandler.controllerOnChanged(event);        
     },
 
     messageListener(event) {
@@ -247,7 +267,7 @@ const serviceWorkerHandler = {
                     }
                 }
                 break;
-
+            
             default:
                 if (isVerbosely) console.log("Received message with unknown type '" + event.data.type + "'", event);
                 else if (isLogging) console.log("Received message with unknown type '" + event.data.type + "'");
@@ -255,6 +275,14 @@ const serviceWorkerHandler = {
         }
     },
 
+    /**
+     * Sends a request to the worker and receives the response via callback.
+     * @param {string} type - Request type.
+     * @param {Object} [content={}] - Request content.
+     * @param {Function} [onSuccess] - Success callback.
+     * @param {Function} [onError] - Error callback.
+     * @param {ServiceWorker} [worker=this.worker] - Target worker.
+     */
     async sendRequest(type, content = {}, onSuccess, onError, worker = this.worker) {
         if (worker != null) {
             const sequence = this.issueRequestSequence;
@@ -263,20 +291,30 @@ const serviceWorkerHandler = {
         } else onError?.("Service Worker is not exist.");
     },
 
+    /**
+     * Sends a request to the worker and awaits the response as a Promise.
+     * @param {string} type - Request type.
+     * @param {Object} [content={}] - Request content.
+     * @param {ServiceWorker} [worker=this.worker] - Target worker.
+     * @returns {Promise<*>}
+     */
     sendRequestForWait(type, content = {}, worker = this.worker) {
         return new Promise((resolve, reject) => {
             this.sendRequest(type, content, resolve, reject, worker);
         });
     },
 
+    /** Requests the waiting worker to activate immediately. @param {ServiceWorker} [worker=this.waiting] */
     skipWaiting(worker = this.waiting) {
         worker?.postMessage({ type: "SKIP_WAITING" });
     },
 
+    /** Requests the active worker to immediately control all clients. @param {ServiceWorker} [worker=this.activated] */
     clientsClaim(worker = this.activated) {
         worker?.postMessage({ type: "CLIENTS_CLAIM" });
     },
 
+    /** Deletes the Application cache. @param {ServiceWorker} [worker] @returns {Promise<*>} */
     async clearCache(worker = this.worker) {
         try {
             return await this.sendRequestForWait("clearCache", {}, worker);
@@ -285,6 +323,7 @@ const serviceWorkerHandler = {
         }
     },
 
+    /** Deletes the Common cache. @param {ServiceWorker} [worker] @returns {Promise<*>} */
     async clearCommonCache(worker = this.worker) {
         try {
             return await this.sendRequestForWait("clearCommonCache", {}, worker);
@@ -293,6 +332,7 @@ const serviceWorkerHandler = {
         }
     },
 
+    /** Deletes the Static cache. @param {ServiceWorker} [worker] @returns {Promise<*>} */
     async clearStaticCache(worker = this.worker) {
         try {
             return await this.sendRequestForWait("clearStaticCache", {}, worker);
@@ -301,6 +341,7 @@ const serviceWorkerHandler = {
         }
     },
 
+    /** Deletes the Stony cache. @param {ServiceWorker} [worker] @returns {Promise<*>} */
     async clearStonyCache(worker = this.worker) {
         try {
             return await this.sendRequestForWait("clearStonyCache", {}, worker);
@@ -309,6 +350,7 @@ const serviceWorkerHandler = {
         }
     },
 
+    /** Deletes all caches (Application + Common + Static + Stony). @param {ServiceWorker} [worker] @returns {Promise<*>} */
     async clearAllCaches(worker = this.worker) {
         try {
             return await this.sendRequestForWait("clearAllCaches", {}, worker);
@@ -317,6 +359,7 @@ const serviceWorkerHandler = {
         }
     },
 
+    /** Retrieves the worker version info. @param {ServiceWorker} [worker] @returns {Promise<*>} */
     async getVersion(worker = this.worker) {
         try {
             return await this.sendRequestForWait("getVersion", {}, worker);
@@ -325,10 +368,12 @@ const serviceWorkerHandler = {
         }
     },
 
+    /** Retrieves the version of the waiting worker. @returns {Promise<*>} */
     getVersionWaiting() {
         return this.getVersion(this.waiting);
     },
 
+    /** Retrieves the number of entries in the Application cache. @param {ServiceWorker} [worker] @returns {Promise<number>} */
     async getApplicationCount(worker = this.controller) {
         try {
             return worker != null ? await this.sendRequestForWait("getApplicationCount", {}, worker) : 0;
@@ -351,6 +396,9 @@ if ("serviceWorker" in navigator) {
 
     const serviceWorkerOnWaiting = (worker) => {
         if (worker) {
+            // console.log("Service Worker is waiting to activate.");
+            // registration.waiting.postMessage({ type: "SKIP_WAITING" });
+
             if (isLogging) console.log("Service Worker is waiting:", worker.scriptURL);
             else if (isVerbosely) console.log("Service Worker is waiting:", worker);
             serviceWorkerHandler.registerationOnWaiting(worker);
@@ -374,72 +422,64 @@ if ("serviceWorker" in navigator) {
     };
 
     // window.addEventListener("load", () => {
-    navigator.serviceWorker.register("./serviceWorker.js", {
-        // scope: "/", // When use service worker file out of location of index.html, have to set scope with HTTP Server response Header 'Service-Worker-Allowed: /'
-        updateViaCache: "none",
-
-        // vv PWA required set HTTP server response headers vv
-        // Cache-Control: no-cache
-        // Pragma: no-cache
-        // Expires: 0
-    }).then(registration => {
-        serviceWorkerHandler.registeration = registration;
-        if (isLogging) console.log("Service Worker registered with scope:", registration.scope);
-
-        serviceWorkerOnInstalling(registration.installing);
-        serviceWorkerOnWaiting(registration.waiting);
-
-        registration.addEventListener("statechange", () => {
-            const activated = registration.active;
-            const constoller = navigator.serviceWorker.controller;
-            if (activated) {
-                if (isLogging) console.log("Service Worker state changed to:", activated.state);
-                serviceWorkerOnActive(registration.active, controller != null && activated != controller);
-            }
-        });
+        navigator.serviceWorker.register("./scripts/serviceWorker.js", { scope: "/", updateViaCache: "none" }).then(registration => {
+            serviceWorkerHandler.registeration = registration;
+            if (isLogging) console.log("Service Worker registered with scope:", registration.scope);
+
+            serviceWorkerOnInstalling(registration.installing);
+            serviceWorkerOnWaiting(registration.waiting);
+
+            registration.addEventListener("statechange", () => {
+                const activated = registration.active;
+                const constoller = navigator.serviceWorker.controller;
+                if (activated) {
+                    if (isLogging) console.log("Service Worker state changed to:", activated.state);
+                    serviceWorkerOnActive(registration.active, controller != null && activated != controller);
+                }
+            });
 
-        serviceWorkerOnActive(registration.active);
-        serviceWorkerHandler.isInitialSetup = registration.active == null;
-
-        registration.addEventListener("updatefound", () => {
-            const newWorker = registration.installing;
-            if (isLogging) console.log("New Service Worker found:", newWorker.scriptURL);
-            else if (isVerbosely) console.log("New Service Worker found:", newWorker);
-            serviceWorkerOnInstalling(newWorker);
-
-            newWorker.addEventListener("statechange", () => {
-                if (isLogging) console.log("New Service Worker state changed to:", newWorker.state);
-                switch (newWorker.state) {
-                    case "installed":
-                        if (isLogging) console.log("New Service Worker installed and waiting to activate.");
-                        const controllerExist = navigator.serviceWorker.controller;
-                        const isWaiting = registration.waiting == newWorker;
-                        serviceWorkerHandler.registerationOnUpdated();
-                        if (isWaiting) {
-                            if (controllerExist) {
-                                serviceWorkerOnWaiting(newWorker);
-                            } else {
-                                // do nothing (first install)
+            serviceWorkerOnActive(registration.active);
+            serviceWorkerHandler.isInitialSetup = registration.active == null;
+
+            registration.addEventListener("updatefound", () => {
+                const newWorker = registration.installing;
+                if (isLogging) console.log("New Service Worker found:", newWorker.scriptURL);
+                else if (isVerbosely) console.log("New Service Worker found:", newWorker);
+                serviceWorkerOnInstalling(newWorker);
+
+                newWorker.addEventListener("statechange", () => {
+                    if (isLogging) console.log("New Service Worker state changed to:", newWorker.state);
+                    switch (newWorker.state) {
+                        case "installed":
+                            if (isLogging) console.log("New Service Worker installed and waiting to activate.");
+                            const controllerExist = navigator.serviceWorker.controller;
+                            const isWaiting = registration.waiting == newWorker;
+                            serviceWorkerHandler.registerationOnUpdated();
+                            if (isWaiting) {
+                                if (controllerExist) {
+                                    serviceWorkerOnWaiting(newWorker);
+                                } else {
+                                    // do nothing (first install)
+                                }
                             }
-                        }
-                        break;
+                            break;
 
-                    case "activating":
-                        serviceWorkerOnActivating(newWorker, true);
-                        break;
+                        case "activating":
+                            serviceWorkerOnActivating(newWorker, true);
+                            break;
 
-                    case "activated":
-                        serviceWorkerOnActive(newWorker, true);
-                        break;
-                }
+                        case "activated":
+                            serviceWorkerOnActive(newWorker, true);
+                            break;
+                    }
 
-                if (newWorker == navigator.serviceWorker.controller) {
-                    if (isLogging) console.log("New Service Worker is attached.");
-                }
+                    if (newWorker == navigator.serviceWorker.controller) {
+                        if (isLogging) console.log("New Service Worker is attached.");
+                    }
+                });
             });
+        }).catch(error => {
+            console.error("Service Worker registration failed:", error);
         });
-    }).catch(error => {
-        console.error("Service Worker registration failed:", error);
-    });
     // });
 }