From 703c8bfc5b642e06267610149c981f05ea7c3572 Mon Sep 17 00:00:00 2001
From: sudoer777 <78781902+sudoer777@users.noreply.github.com>
Date: Tue, 8 Mar 2022 10:38:28 -0700
Subject: [PATCH] Add loading screen for index

---
 public/scripts/index.js      | 5 +++++
 public/stylesheets/index.css | 4 ++++
 views/index.pug              | 3 ++-
 3 files changed, 11 insertions(+), 1 deletion(-)

diff --git a/public/scripts/index.js b/public/scripts/index.js
index 6813bba..de182c7 100644
--- a/public/scripts/index.js
+++ b/public/scripts/index.js
@@ -1,6 +1,7 @@
 import * as Data from "./data.js";
 import * as Form from "./form.js";
 
+const dropdownsDiv = document.getElementById('dropdowns-div');
 const sportDropdown = document.getElementById('sport-dropdown');
 const seasonDropdown = document.getElementById('year-dropdown');
 const genderDropdown = document.getElementById('gender-dropdown');
@@ -11,6 +12,7 @@ const gamesTableHeader = document.getElementById('games-table-header');
 const noScoresMessage = document.getElementById('no-scores-message');
 const addScoreButton = document.getElementById('add-score-button');
 const manageButton = document.getElementById('manage-button');
+const loadingSpan = document.getElementById('loading');
 
 
 
@@ -42,6 +44,9 @@ async function initializeForm() {
     divisionDropdown.onchange = loadTable;
     teamDropdown.onchange = loadTable;
 
+    loadingSpan.textContent = '';
+    dropdownsDiv.style.visibility = 'visible';
+
     loadTable();
 
 
diff --git a/public/stylesheets/index.css b/public/stylesheets/index.css
index eb71b13..bf0a4ae 100644
--- a/public/stylesheets/index.css
+++ b/public/stylesheets/index.css
@@ -32,3 +32,7 @@ tr {
 #login-button {
     margin-left: auto;
 }
+
+#dropdowns-div {
+    visibility: hidden;
+}
\ No newline at end of file
diff --git a/views/index.pug b/views/index.pug
index a1b7d2d..1a22bbe 100644
--- a/views/index.pug
+++ b/views/index.pug
@@ -11,7 +11,8 @@ block actions
 
 
 block content
-    div
+    span#loading Loading...
+    div#dropdowns-div
         span(class='form-section')
             label Year
             span(class='form-section-input')