refactor(offline): simplify code and remove abort

dewanakl · Dec 19, 2024 · 5df2447 · 5df2447
1 parent c7d277b
commit 5df2447
Show file tree

Hide file tree

Showing 4 changed files with 15 additions and 31 deletions.
diff --git a/dashboard.html b/dashboard.html
@@ -358,13 +358,7 @@ <h6 class="fw-bold m-0 p-0" id="count-like">
     </main>
 
     <!-- Offline -->
-    <div class="fixed-top" id="offline-mode" style="opacity: 0; z-index: 1057;">
-        <div class="d-flex justify-content-center mx-auto">
-            <div class="d-flex justify-content-center align-items-center rounded-pill my-2 bg-danger shadow">
-                <small class="text-center py-1 px-2 mx-1 text-white" style="font-size: 0.8rem;"></small>
-            </div>
-        </div>
-    </div>
+    <div class="fixed-top" id="offline-mode" style="opacity: 0; z-index: 1057;"></div>
 
     <!-- Modal login -->
     <div class="modal fade" id="loginModal" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="loginModalLabel" aria-hidden="true">

diff --git a/index.html b/index.html
@@ -552,13 +552,7 @@ <h2 class="font-esthetic mb-4" style="font-size: 2.5rem;">Wahyu &amp; Riski</h2>
     </div>
 
     <!-- Offline -->
-    <div class="fixed-top" id="offline-mode" style="opacity: 0; z-index: 1057;">
-        <div class="d-flex justify-content-center mx-auto">
-            <div class="d-flex justify-content-center align-items-center rounded-pill my-2 bg-danger shadow">
-                <small class="text-center py-1 px-2 mx-1 text-white" style="font-size: 0.8rem;"></small>
-            </div>
-        </div>
-    </div>
+    <div class="fixed-top" id="offline-mode" style="opacity: 0; z-index: 1057;"></div>
 
     <!-- Modal Image -->
     <div class="modal fade" id="modal-image" tabindex="-1">

diff --git a/js/offline.js b/js/offline.js
@@ -2,7 +2,6 @@ export const offline = (() => {
 
     let alert = null;
     let online = true;
-    let abort = [];
 
     const show = (isUp = true) => new Promise((res) => {
         let op = parseFloat(alert.style.opacity);
@@ -87,7 +86,6 @@ export const offline = (() => {
         setOffline();
         show();
         changeState();
-        abort.forEach((a) => a());
     };
 
     const onOnline = () => {
@@ -100,14 +98,19 @@ export const offline = (() => {
 
     const isOnline = () => online;
 
-    const addAbort = (callback) => {
-        abort.push(callback);
-    };
-
     const init = () => {
         window.addEventListener('online', onOnline);
         window.addEventListener('offline', onOffline);
         alert = document.getElementById('offline-mode');
+
+        if (alert.childElementCount === 0) {
+            alert.innerHTML = `
+            <div class="d-flex justify-content-center mx-auto">
+                <div class="d-flex justify-content-center align-items-center rounded-pill my-2 bg-danger shadow">
+                    <small class="text-center py-1 px-2 mx-1 text-white" style="font-size: 0.8rem;"></small>
+                </div>
+            </div>`;
+        }
     };
 
     return {

diff --git a/js/request.js b/js/request.js
@@ -1,5 +1,4 @@
 import { dto } from './dto.js';
-import { offline } from './offline.js';
 import { session } from './session.js';
 
 export const HTTP_GET = 'GET';
@@ -10,19 +9,13 @@ export const HTTP_DELETE = 'DELETE';
 
 export const request = (method, path) => {
 
-    const controller = new AbortController();
-    const header = new Headers({
-        'Accept': 'application/json',
-        'Content-Type': 'application/json'
-    });
-
-    offline.addAbort(() => controller.abort());
-
     let url = document.body.getAttribute('data-url');
     let req = {
         method: String(method).toUpperCase(),
-        headers: header,
-        signal: controller.signal,
+        headers: new Headers({
+            'Accept': 'application/json',
+            'Content-Type': 'application/json'
+        }),
     };
 
     if (url.slice(-1) === '/') {