Migrate loading/loading to TypeScript

2023-12-31 17:07:19 -08:00
parent 99430fc263
commit 5de700fb8f
4 changed files with 47 additions and 85 deletions
@@ -0,0 +1,37 @@
+import './loading.scss';
+
+let loader: HTMLDivElement | undefined;
+
+function createLoader(): HTMLDivElement {
+    const elem = document.createElement('div');
+    elem.setAttribute('dir', 'ltr');
+    elem.classList.add('docspinner');
+    elem.classList.add('mdl-spinner');
+
+    elem.innerHTML = '<div class="mdl-spinner__layer mdl-spinner__layer-1"><div class="mdl-spinner__circle-clipper mdl-spinner__left"><div class="mdl-spinner__circle mdl-spinner__circleLeft"></div></div><div class="mdl-spinner__circle-clipper mdl-spinner__right"><div class="mdl-spinner__circle mdl-spinner__circleRight"></div></div></div><div class="mdl-spinner__layer mdl-spinner__layer-2"><div class="mdl-spinner__circle-clipper mdl-spinner__left"><div class="mdl-spinner__circle mdl-spinner__circleLeft"></div></div><div class="mdl-spinner__circle-clipper mdl-spinner__right"><div class="mdl-spinner__circle mdl-spinner__circleRight"></div></div></div><div class="mdl-spinner__layer mdl-spinner__layer-3"><div class="mdl-spinner__circle-clipper mdl-spinner__left"><div class="mdl-spinner__circle mdl-spinner__circleLeft"></div></div><div class="mdl-spinner__circle-clipper mdl-spinner__right"><div class="mdl-spinner__circle mdl-spinner__circleRight"></div></div></div><div class="mdl-spinner__layer mdl-spinner__layer-4"><div class="mdl-spinner__circle-clipper mdl-spinner__left"><div class="mdl-spinner__circle mdl-spinner__circleLeft"></div></div><div class="mdl-spinner__circle-clipper mdl-spinner__right"><div class="mdl-spinner__circle mdl-spinner__circleRight"></div></div></div>';
+
+    document.body.appendChild(elem);
+    return elem;
+}
+
+export function show() {
+    if (!loader) {
+        loader = createLoader();
+    }
+    loader.classList.add('mdlSpinnerActive');
+}
+
+export function hide() {
+    if (loader) {
+        loader.classList.remove('mdlSpinnerActive');
+    }
+}
+
+const loading = {
+    show,
+    hide
+};
+
+window.Loading = loading;
+
+export default loading;