From 009a81dbc14211c6ae1f3fab655ac822c65228d1 Mon Sep 17 00:00:00 2001
From: Lucas Patenaude <LUPA7501@colorado.edu>
Date: Wed, 24 Apr 2024 01:11:21 -0600
Subject: [PATCH] Updated registration screen added

---
 .../css/navigation-bar/registration.css       | 22 ++++++++++
 .../resources/js/navigation-bar/user/login.js |  7 ++++
 .../js/navigation-bar/user/register.js        | 12 ++++++
 .../js/registration/league-and-team-select.js | 41 -------------------
 .../src/views/partials/footer.hbs             |  1 +
 ProjectSourceCode/src/views/partials/head.hbs |  1 +
 .../views/partials/navigation-bar/login.hbs   |  2 +-
 .../src/views/partials/navigation-bar/nav.hbs |  4 ++
 .../navigation-bar}/register.hbs              |  4 +-
 9 files changed, 50 insertions(+), 44 deletions(-)
 create mode 100644 ProjectSourceCode/src/resources/css/navigation-bar/registration.css
 create mode 100644 ProjectSourceCode/src/resources/js/navigation-bar/user/register.js
 delete mode 100644 ProjectSourceCode/src/resources/js/registration/league-and-team-select.js
 rename ProjectSourceCode/src/views/{pages => partials/navigation-bar}/register.hbs (83%)

diff --git a/ProjectSourceCode/src/resources/css/navigation-bar/registration.css b/ProjectSourceCode/src/resources/css/navigation-bar/registration.css
new file mode 100644
index 0000000..a2b9b50
--- /dev/null
+++ b/ProjectSourceCode/src/resources/css/navigation-bar/registration.css
@@ -0,0 +1,22 @@
+#register-container {
+    display: none;
+}
+
+#register-page {
+    width: 600px;
+    height: fit-content;
+    position: fixed;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    margin: auto;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    z-index: 5;
+    background: linear-gradient(to bottom, white, rgb(245, 245, 245), rgb(227, 227, 227));
+    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.5);
+    border: 1px solid gray;
+    border-radius: 8px;
+}
diff --git a/ProjectSourceCode/src/resources/js/navigation-bar/user/login.js b/ProjectSourceCode/src/resources/js/navigation-bar/user/login.js
index 3864c70..d156f06 100644
--- a/ProjectSourceCode/src/resources/js/navigation-bar/user/login.js
+++ b/ProjectSourceCode/src/resources/js/navigation-bar/user/login.js
@@ -5,6 +5,13 @@ $(document).ready(function() {
     // Toggle the visibility of the login container
     $('#login-container').toggle();
   });
+
+  $('#register-page-login-button').click(function() {
+    event.preventDefault(); // Prevent the default action of following the link
+
+    $('#register-container').hide();
+    $('#login-container').toggle();
+  });
   
   
 });
diff --git a/ProjectSourceCode/src/resources/js/navigation-bar/user/register.js b/ProjectSourceCode/src/resources/js/navigation-bar/user/register.js
new file mode 100644
index 0000000..7271241
--- /dev/null
+++ b/ProjectSourceCode/src/resources/js/navigation-bar/user/register.js
@@ -0,0 +1,12 @@
+$(document).ready(function () {
+  
+    // Listen for click event on the register button
+    $('#register-button').click(function (event) {
+      event.preventDefault(); // Prevent the default action of following the link
+  
+      $('#login-container').hide();
+      // Show the register container
+      $('#register-container').show();
+    });
+  });
+  
\ No newline at end of file
diff --git a/ProjectSourceCode/src/resources/js/registration/league-and-team-select.js b/ProjectSourceCode/src/resources/js/registration/league-and-team-select.js
deleted file mode 100644
index 71113fe..0000000
--- a/ProjectSourceCode/src/resources/js/registration/league-and-team-select.js
+++ /dev/null
@@ -1,41 +0,0 @@
-
-document.addEventListener("DOMContentLoaded", function() {
-
-
-    const league_select = document.getElementById('league_dropdown');
-    const team_select = document.getElementById('team_dropdown');
-  
-    league_select.addEventListener('change', updateTeamSelect);
-  
-    function updateTeamSelect() {
-      var selectedLeague = league_select.value;
-      var teamSelect = team_select;
-      
-      // Clear existing options
-      teamSelect.innerHTML = "";
-      
-      // Add options based on the selected value from the first select element
-      if (selectedLeague === "La Liga") {
-        // Add options for La Liga
-        addOption(teamSelect, "Option 1 for LL", "option1A");
-        addOption(teamSelect, "Option 2 for LL", "option2A");
-      } else if (selectedLeague === "Serie A") {
-        // Add options for Serie A
-        addOption(teamSelect, "Team 1 in Serie A", "option1B");
-        addOption(teamSelect, "Team 2 in Serie A", "option2B");
-      } else {
-        // Add options for Bundesliga
-        addOption(teamSelect, "Option 1 for Bun", "option1C");
-        addOption(teamSelect, "Option 2 for Bun", "option2C");
-      }
-    }
-  
-    function addOption(selectElement, text, value) {
-      var option = document.createElement("option");
-      option.text = text;
-      option.value = value;
-      selectElement.add(option);
-    }
-  });
-  
-  
\ No newline at end of file
diff --git a/ProjectSourceCode/src/views/partials/footer.hbs b/ProjectSourceCode/src/views/partials/footer.hbs
index d652968..6759434 100644
--- a/ProjectSourceCode/src/views/partials/footer.hbs
+++ b/ProjectSourceCode/src/views/partials/footer.hbs
@@ -9,6 +9,7 @@
         <!-- Navigation Bar Scripts -->
         <script src="/js/navigation-bar/navigation-bar-follow.js"></script>
         <script src="/js/navigation-bar/user/login.js"></script>
+        <script src="/js/navigation-bar/user/register.js"></script>
 
         <!-- Homepage Scripts -->
         <script src="/routes/league-pages/redirect-to-league-url.js"></script>
diff --git a/ProjectSourceCode/src/views/partials/head.hbs b/ProjectSourceCode/src/views/partials/head.hbs
index 604aeac..b01fed0 100644
--- a/ProjectSourceCode/src/views/partials/head.hbs
+++ b/ProjectSourceCode/src/views/partials/head.hbs
@@ -15,6 +15,7 @@
   <!-- Navigation Bar Stylesheets -->
   <link rel="stylesheet" type="text/css" href="/css/navigation-bar/navigation-bar.css">
   <link rel="stylesheet" type="text/css" href="/css/navigation-bar/login.css">
+  <link rel="stylesheet" type="text/css" href="/css/navigation-bar/registration.css">
 
     <!-- Scoreboard Header Stylesheets -->
     <link rel="stylesheet" type="text/css" href="/css/navigation-bar/scoreboard-header/scoreboard.css">
diff --git a/ProjectSourceCode/src/views/partials/navigation-bar/login.hbs b/ProjectSourceCode/src/views/partials/navigation-bar/login.hbs
index 64d7202..d5cdd4e 100644
--- a/ProjectSourceCode/src/views/partials/navigation-bar/login.hbs
+++ b/ProjectSourceCode/src/views/partials/navigation-bar/login.hbs
@@ -24,6 +24,6 @@
 
         </form>
 
-        <p class="mt-3">Don't have an account? <a href="/register">Register</a></p>
+        <p class="mt-3">Don't have an account? <a id="register-button" href="/home">Register</a></p>
       </div>
     </div>
diff --git a/ProjectSourceCode/src/views/partials/navigation-bar/nav.hbs b/ProjectSourceCode/src/views/partials/navigation-bar/nav.hbs
index 2249bc1..78b3547 100644
--- a/ProjectSourceCode/src/views/partials/navigation-bar/nav.hbs
+++ b/ProjectSourceCode/src/views/partials/navigation-bar/nav.hbs
@@ -74,3 +74,7 @@
   {{> navigation-bar/login}}
 </div>
 {{/if}}
+
+<div class="container" id="register-container">
+  {{> navigation-bar/register}}
+</div>
\ No newline at end of file
diff --git a/ProjectSourceCode/src/views/pages/register.hbs b/ProjectSourceCode/src/views/partials/navigation-bar/register.hbs
similarity index 83%
rename from ProjectSourceCode/src/views/pages/register.hbs
rename to ProjectSourceCode/src/views/partials/navigation-bar/register.hbs
index c3f3928..30a24b3 100644
--- a/ProjectSourceCode/src/views/pages/register.hbs
+++ b/ProjectSourceCode/src/views/partials/navigation-bar/register.hbs
@@ -1,4 +1,4 @@
-<div class="register-page">
+<div class="register-page" id="register-page">
   <div class="form-container">
 
     <h1 class="mt-5 mb-4">Register</h1>
@@ -22,7 +22,7 @@
     </form>
     <!--- END OF FORM --->
 
-    <p class="mt-3">Already have an account? <a href="/login">Login</a></p>
+    <p class="mt-3">Already have an account? <a id="register-page-login-button" href="/login">Login</a></p>
 
   </div>
 </div>