fix, refactor loading screen toggle

orbaone · Mar 3, 2021 · 8bc4f79 · 8bc4f79
1 parent 1afd438
commit 8bc4f79
Show file tree

Hide file tree

Showing 3 changed files with 15 additions and 7 deletions.
diff --git a/packages/core/src/elements/iframe.ts b/packages/core/src/elements/iframe.ts
@@ -1,6 +1,6 @@
 import { iframeStyles } from "../styles/styles";
 
-import { loadingDiv } from "../helpers/elements";
+import { removeLoadingScreen } from "../helpers/utils";
 
 import {ORBA_ONE_MESSAGE_CHANNEL,ORBA_ONE_SUCCESS,ORBA_ONE_CANCEL} from "./constants";
 
@@ -51,7 +51,7 @@ export function iframeManager(
         if (iframe) {
             window.removeEventListener(ORBA_ONE_MESSAGE_CHANNEL, handler);
             document.body.style.overflowY = "auto";
-            document.body.removeChild(loadingDiv);
+            removeLoadingScreen();
             document.body.removeChild(iframe);
         }
     }

diff --git a/packages/core/src/helpers/utils.ts b/packages/core/src/helpers/utils.ts
@@ -1,4 +1,6 @@
 import { OrbaOneConfig } from "./types";
+import { iframeLoader } from "../styles/templates";
+import { loadingDiv } from "../helpers/elements";
 
 export function isDomElement(obj: any): obj is HTMLElement | Element {
     //! check if obj is not null explicitly because null is a type of object
@@ -57,3 +59,11 @@ export function getSessionUrl(verificationUrl: string, apiKey: string, applicant
     return `${verificationUrl}?publicKey=${apiKey}&applicantId=${applicantId}&steps=${steps.join("&steps=")}`;
 }
 
+export function showLoadingScreen() {
+    loadingDiv.innerHTML = iframeLoader;
+    document.body.appendChild(loadingDiv);
+}
+
+export function removeLoadingScreen() {
+    document.body.removeChild(loadingDiv);
+}
diff --git a/packages/core/src/index.ts b/packages/core/src/index.ts
@@ -1,19 +1,17 @@
 import { createButton } from "./elements/button";
 import { createIframe } from "./elements/iframe";
 import { verificationUrl } from "./helpers/defaultConfig";
-import { loadingDiv } from "./helpers/elements";
 import { OrbaOneConfig } from "./helpers/types";
-import { iframeLoader } from "./styles/templates";
 import { getSessionUrl, isValidConfig } from "./helpers/utils";
+import { showLoadingScreen } from "./helpers/utils";
 
 function initializeVerification(config: OrbaOneConfig, button: ReturnType<typeof createButton>): void {
     const { apiKey, applicantId, onSuccess, onCancelled, onError, steps } = config;
 
     //Set Loading state
     button.setState("loading");
-    loadingDiv.innerHTML = iframeLoader;
-
-    document.body.appendChild(loadingDiv);
+    showLoadingScreen();
+
     const url = getSessionUrl(verificationUrl, apiKey, applicantId, steps);
     const iframe = createIframe(url, applicantId, onSuccess, onCancelled, onError, (state) => {
         button.setState(state);