add loading symbol to panel since it takes a while

insanj · Dec 29, 2020 · 7dc8dce · 7dc8dce
1 parent 1df268b
commit 7dc8dce
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 2 deletions.
diff --git a/public/index.html b/public/index.html
@@ -17,7 +17,7 @@
 	<body>
 		<div id="sammy-panel">
 			<div class="panel-header">
-				sammy.best
+				sammy.best <div id="sammy-loadin">[loadin, gimme just a moment]</div>
 			</div>
 
 			<div class="panel-subtitle">

diff --git a/public/main.js b/public/main.js
@@ -394,7 +394,6 @@ turnAllMaterials = (thing, hex='ffacac', checkSelected=true) => {
     }
 }
 
-
 let fadeAllMaterials = (thing, opacity) => {};
 fadeAllMaterials = (thing, opacity) => {
     if (!thing) {
@@ -511,6 +510,11 @@ function loadSammy() {
         // }
 
         playSammySoundtrack();
+
+        const loadinDiv = document.getElementById('sammy-loadin');
+        if (loadinDiv) {
+            loadinDiv.outerHTML = '';
+        }
     }).catch(error => {
         alert(error);
     });

diff --git a/public/sammy.css b/public/sammy.css
@@ -163,6 +163,19 @@ footer a {
     /* text-shadow: 0px -1px 1px rgba(255,255,250,0.1); */
 }
 
+#sammy-loadin {
+    display: inline-block;
+    vertical-align: top;
+
+    font-size: 10px;
+    font-weight: 400;
+    line-height: 1;
+    overflow: hidden;
+
+    width: 60px;
+    height: 24px;
+}
+
 .panel-subtitle {
     line-height: 1;
     padding: 0px 6px 0px 16px;