diff --git a/public/assets/css/generated-pages/club-pages/club-page-layouts.css b/public/assets/css/generated-pages/club-pages/club-page-layouts.css index db5cd96..9f84751 100644 --- a/public/assets/css/generated-pages/club-pages/club-page-layouts.css +++ b/public/assets/css/generated-pages/club-pages/club-page-layouts.css @@ -1,35 +1,20 @@ /* Main Contents Container (Below Header) */ -#club-page-contents-container -{ - display: flex; - flex-direction: row; +#club-page-contents-container { + display: flex; + flex-direction: row; } - /* Child Containers */ - - /* Left 20% of #club-page-contents-container */ - #club-information-container - { - width: 20%; - - display: flex; - flex-direction: column; - } - - /* Right 80% of #club-page-contents-container */ - #club-stats-and-players-container - { - width: 80%; - } - - - - - - - - - +/* Child Containers */ +/* Left 20% of #club-page-contents-container */ +#club-information-container { + width: 20%; + display: flex; + flex-direction: column; +} +/* Right 80% of #club-page-contents-container */ +#club-stats-and-players-container { + width: 80%; +} diff --git a/public/assets/css/generated-pages/club-pages/club-page-styling.css b/public/assets/css/generated-pages/club-pages/club-page-styling.css index 596d237..5f5c524 100644 --- a/public/assets/css/generated-pages/club-pages/club-page-styling.css +++ b/public/assets/css/generated-pages/club-pages/club-page-styling.css @@ -1,23 +1,20 @@ -#club-information-container -{ - margin-right: 20px; +#club-information-container { + margin-right: 20px; } -#club-favorite-button -{ - width: 35px; - transform: skewX(20deg); - margin-right: 25px; - filter: drop-shadow(0px 0px 8px rgba(0, 0, 0, 0.3)); - filter: outline(2px solid red); +#club-favorite-button { + width: 35px; + transform: skewX(20deg); + margin-right: 25px; + filter: drop-shadow(0px 0px 8px rgba(0, 0, 0, 0.3)); + filter: outline(2px solid red); } -#club-favorite-button:hover -{ - cursor: pointer; +#club-favorite-button:hover { + cursor: pointer; } #competition-logo { - width: 60px; - margin-right: 10px; -} \ No newline at end of file + width: 60px; + margin-right: 10px; +} diff --git a/public/assets/css/generated-pages/generated-pages-styling.css b/public/assets/css/generated-pages/generated-pages-styling.css index 18dcfdb..61c3050 100644 --- a/public/assets/css/generated-pages/generated-pages-styling.css +++ b/public/assets/css/generated-pages/generated-pages-styling.css @@ -5,18 +5,18 @@ */ .page-container { - /* --- SIZE CONTAINER --- */ - width: 100%; /* Set the width to the full width of screen */ - padding: 10px 100px; /* Create some distance between page boundries and elements */ - - /* --- FORMAT CHILD ITEMS (Table and Leading Scorers Cards) --- */ - display: flex; /* Enable flexbox layout */ - flex-direction: column; /* Arrange child elements vertically */ + /* --- SIZE CONTAINER --- */ + width: 100%; /* Set the width to the full width of screen */ + padding: 10px 100px; /* Create some distance between page boundries and elements */ + + /* --- FORMAT CHILD ITEMS (Table and Leading Scorers Cards) --- */ + display: flex; /* Enable flexbox layout */ + flex-direction: column; /* Arrange child elements vertically */ } .page-content-container { - display: flex; - flex-direction: row; + display: flex; + flex-direction: row; } /* @@ -26,114 +26,114 @@ */ /* Stylization for League Information Header Card */ -.information-container -{ - /* --- POSITION CONTAINER --- */ - align-items: center; /* Center content vertically */ - margin: 20px; +.information-container { + /* --- POSITION CONTAINER --- */ + align-items: center; /* Center content vertically */ + margin: 20px; - /* --- SIZE CONTAINER --- */ - height: 100px; - width: fit-content; - padding: 10px 20px; /* Adjust padding as needed */ + /* --- SIZE CONTAINER --- */ + height: 100px; + width: fit-content; + padding: 10px 20px; /* Adjust padding as needed */ - /* --- STYLE CONTAINER --- */ - background: linear-gradient(to right, white, rgb(245, 245, 245), rgb(227, 227, 227)); /* Gradient from white to gray */ - transform: skewX(-20deg); /* Skew the banner to create a triangular side */ - box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.4); + /* --- STYLE CONTAINER --- */ + background: linear-gradient( + to right, + white, + rgb(245, 245, 245), + rgb(227, 227, 227) + ); /* Gradient from white to gray */ + transform: skewX(-20deg); /* Skew the banner to create a triangular side */ + box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.4); - /* --- FORMAT CHILD ITEMS (logo, league name, flag) --- */ - display: flex; /* Enable flexbox layout */ - flex-direction: row; /* Arrange child elements horizontally */ + /* --- FORMAT CHILD ITEMS (logo, league name, flag) --- */ + display: flex; /* Enable flexbox layout */ + flex-direction: row; /* Arrange child elements horizontally */ } /* Adds Red Diagonal Strip at the end of the #league-information-container */ -.information-container::after -{ - content: ''; - position: absolute; - top: 0; - right: 0; - bottom: 0; - width: 8px; /* Width of the red strip */ - background-color: red; /* Red color */ +.information-container::after { + content: ""; + position: absolute; + top: 0; + right: 0; + bottom: 0; + width: 8px; /* Width of the red strip */ + background-color: red; /* Red color */ } - /* +/* =========================== LEAGUE INFORMATION CHILD ITEMS =========================== */ - /* Styling for League Logo in League Information Header */ - #generated-page-header-logo - { - margin: 0px 30px; - transform: skewX(20deg); /* Skew the banner to create a triangular side */ - height: 80%; - } +/* Styling for League Logo in League Information Header */ +#generated-page-header-logo { + margin: 0px 30px; + transform: skewX(20deg); /* Skew the banner to create a triangular side */ + height: 80%; +} - /* Styling for League Title in League Information Header */ - #generated-page-header-title - { - transform: skewX(20deg); /* Skew the banner to create a triangular side */ - margin-right: 20px; - } +/* Styling for League Title in League Information Header */ +#generated-page-header-title { + transform: skewX(20deg); /* Skew the banner to create a triangular side */ + margin-right: 20px; +} - /* Styling for Flag in League Information Header */ - #generated-page-header-flag - { - transform: skewX(20deg); /* Skew the banner to create a triangular side */ - height: 20px; - margin-right: 130px; - } +/* Styling for Flag in League Information Header */ +#generated-page-header-flag { + transform: skewX(20deg); /* Skew the banner to create a triangular side */ + height: 20px; + margin-right: 130px; +} /* ============================================= CARDS IN PAGE BODY ============================================= */ - + /* Styling for All Card Containers on Generated Pages */ -.card-container -{ - /* --- POSITION CONTAINER --- */ - margin: 0 10px; - margin-bottom: 20px; +.card-container { + /* --- POSITION CONTAINER --- */ + margin: 0 10px; + margin-bottom: 20px; - /* --- SIZE CONTAINER --- */ - padding: 15px; + /* --- SIZE CONTAINER --- */ + padding: 15px; - /* --- STYLE CONTAINER --- */ - background: linear-gradient(to top, rgb(216, 216, 216), rgb(236, 236, 236), rgb(241, 240, 240)); - border: 1px solid gray; - box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.5); + /* --- STYLE CONTAINER --- */ + background: linear-gradient( + to top, + rgb(216, 216, 216), + rgb(236, 236, 236), + rgb(241, 240, 240) + ); + border: 1px solid gray; + box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.5); } /* Styling for All Tables on Generated Pages */ -table -{ - width: 100%; - padding: 15px; +table { + width: 100%; + padding: 15px; - /* Table Header Styling */ - th - { - border-bottom: 3px solid red; /* Add red bottom border */ - } + /* Table Header Styling */ + th { + border-bottom: 3px solid red; /* Add red bottom border */ + } - /* Data in Row Style */ - td - { - padding: 5px; - } + /* Data in Row Style */ + td { + padding: 5px; + } } /* Styling for All Tables Designated to Alternate on Generated Pages */ -.alternating-table tbody tr:nth-child(odd) -{ - /* Every Odd Row in Table Style */ - background-color: #d2d2d2; /* Light gray for odd rows */ +.alternating-table tbody tr:nth-child(odd) { + /* Every Odd Row in Table Style */ + background-color: #d2d2d2; /* Light gray for odd rows */ } /* @@ -143,28 +143,24 @@ table */ /* Hover Styling for All Card Containers on Generated Pages */ -.card-container:hover -{ - transform: scale(1.01); /* Scale the row by 1.1 on hover */ - box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.3); +.card-container:hover { + transform: scale(1.01); /* Scale the row by 1.1 on hover */ + box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.3); } /* Hover Styling for All Tables Designated to Alternate on Generated Pages */ -.alternating-table tbody tr:hover -{ - /* Create border around row on hover */ - border: 1px solid lightgray; - border-radius: 10px; +.alternating-table tbody tr:hover { + /* Create border around row on hover */ + border: 1px solid lightgray; + border-radius: 10px; - /* Make club logo larger on hover */ - #league-table-club-logo - { - width: 32px; - } + /* Make club logo larger on hover */ + #league-table-club-logo { + width: 32px; + } - /* Undeline club name on hover */ - #league-table-club-name-column - { - text-decoration: underline; /* Add underline effect */ - } -} \ No newline at end of file + /* Undeline club name on hover */ + #league-table-club-name-column { + text-decoration: underline; /* Add underline effect */ + } +} diff --git a/public/assets/css/homepage/homepage.css b/public/assets/css/homepage/homepage.css index edf1235..a32bea4 100644 --- a/public/assets/css/homepage/homepage.css +++ b/public/assets/css/homepage/homepage.css @@ -6,7 +6,7 @@ /* Styling for text at top of the page */ #leagues-header { - font-family: 'Scottsdale-Italic'; + font-family: "Scottsdale-Italic"; display: inline-block; /* Ensure the width is based on content */ border-bottom: 1.5px solid #999696; /* Adjust the color and thickness as needed */ } @@ -24,7 +24,12 @@ height: 150px; margin: 20px; text-align: center; /* Center the content horizontally */ - background: linear-gradient(to right, white, rgb(245, 245, 245), rgb(227, 227, 227)); /* Gradient from white to gray */ + background: linear-gradient( + to right, + white, + rgb(245, 245, 245), + rgb(227, 227, 227) + ); /* Gradient from white to gray */ padding: 10px; /* Adjust padding as needed */ position: relative; /* Needed for absolute positioning */ overflow: hidden; /* Hide the overflowing skewed content */ @@ -45,14 +50,13 @@ transform: skewX(20deg); /* Skew the banner to create a triangular side */ } - #league-card:hover { transform: skewX(-20deg) scale(1.05); /* Increase scale on hover to make it pop */ box-shadow: 0 0 20px rgba(0, 0, 0, 0.3); /* Add box-shadow on hover for depth effect */ } #league-card::after { - content: ''; + content: ""; position: absolute; top: 0; right: 0; @@ -61,7 +65,6 @@ background-color: red; /* Red color */ } - #logo { width: 30%; /* Set width for logo */ max-height: 100px; @@ -77,5 +80,3 @@ max-height: 80px; max-width: 250px; } - - diff --git a/public/assets/js/club-page/favorite-button.js b/public/assets/js/club-page/favorite-button.js index 3d0651c..593ad75 100644 --- a/public/assets/js/club-page/favorite-button.js +++ b/public/assets/js/club-page/favorite-button.js @@ -1,73 +1,71 @@ -document.addEventListener("DOMContentLoaded", function() { - var favoriteButton = document.getElementById("club-favorite-button"); - if (favoriteButton) { - favoriteButton.addEventListener("click", function() { - var userID = document.getElementById("userID").value; - var teamID = document.getElementById("teamID").value; - var teamName = document.getElementById("teamName").value; - var teamLogo = document.getElementById("teamLogo").value; - - if (favoriteButton.src.includes("/favorited.png")) { - removeFavoriteTeam(userID, teamID); - } else { - addFavoriteTeam(userID, teamID, teamName, teamLogo); - } - }); - } +document.addEventListener("DOMContentLoaded", function () { + var favoriteButton = document.getElementById("club-favorite-button"); + if (favoriteButton) { + favoriteButton.addEventListener("click", function () { + var userID = document.getElementById("userID").value; + var teamID = document.getElementById("teamID").value; + var teamName = document.getElementById("teamName").value; + var teamLogo = document.getElementById("teamLogo").value; + + if (favoriteButton.src.includes("/favorited.png")) { + removeFavoriteTeam(userID, teamID); + } else { + addFavoriteTeam(userID, teamID, teamName, teamLogo); + } + }); + } }); -async function addFavoriteTeam(userID, teamID, teamName, teamLogo){ - try { - const response = await fetch('/favteam/add', { - method: 'POST', - headers: { - 'Content-Type': 'application/json' - }, - body: JSON.stringify({ - userID: userID, - teamID: teamID, - teamName: teamName, - teamLogo: teamLogo - }) - }); +async function addFavoriteTeam(userID, teamID, teamName, teamLogo) { + try { + const response = await fetch("/favteam/add", { + method: "POST", + headers: { + "Content-Type": "application/json", + }, + body: JSON.stringify({ + userID: userID, + teamID: teamID, + teamName: teamName, + teamLogo: teamLogo, + }), + }); - if (!response.ok) { - throw new Error('Failed to add favorite team'); - } + if (!response.ok) { + throw new Error("Failed to add favorite team"); + } - if (response.status === 200) { - console.log('New favorite team added successfully.'); - var favoriteButton = document.getElementById("club-favorite-button"); - favoriteButton.src = "/img/club-page/favorited.png"; - location.reload(); // Refresh the page - } - - } catch (error) { - console.error('Error adding favorite team:', error); - } + if (response.status === 200) { + console.log("New favorite team added successfully."); + var favoriteButton = document.getElementById("club-favorite-button"); + favoriteButton.src = "/img/club-page/favorited.png"; + location.reload(); // Refresh the page + } + } catch (error) { + console.error("Error adding favorite team:", error); + } } async function removeFavoriteTeam(userID, teamID) { - try { - const response = await fetch('/favteam/remove', { - method: 'POST', - headers: { - 'Content-Type': 'application/json' - }, - body: JSON.stringify({ - userID: userID, - teamID: teamID - }) - }); - - if (response.status === 200) { - console.log('Favorite team removed successfully.'); - var favoriteButton = document.getElementById("club-favorite-button"); - favoriteButton.src = "/img/club-page/unfavorited.png"; - location.reload(); // Refresh the page - } + try { + const response = await fetch("/favteam/remove", { + method: "POST", + headers: { + "Content-Type": "application/json", + }, + body: JSON.stringify({ + userID: userID, + teamID: teamID, + }), + }); - } catch (error) { - console.error('Error removing favorite team:', error); - } + if (response.status === 200) { + console.log("Favorite team removed successfully."); + var favoriteButton = document.getElementById("club-favorite-button"); + favoriteButton.src = "/img/club-page/unfavorited.png"; + location.reload(); // Refresh the page + } + } catch (error) { + console.error("Error removing favorite team:", error); + } } diff --git a/public/assets/js/league-page/change-goal-difference-color.js b/public/assets/js/league-page/change-goal-difference-color.js index 200a052..ad082b3 100644 --- a/public/assets/js/league-page/change-goal-difference-color.js +++ b/public/assets/js/league-page/change-goal-difference-color.js @@ -1,29 +1,26 @@ -document.addEventListener("DOMContentLoaded", function() { - var goalDifferenceCells = document.querySelectorAll("#league-table-goal-difference-column"); // Selecting the cells in the goal_difference column +document.addEventListener("DOMContentLoaded", function () { + var goalDifferenceCells = document.querySelectorAll( + "#league-table-goal-difference-column" + ); // Selecting the cells in the goal_difference column - goalDifferenceCells.forEach(function(cell) { - var goalDifference = parseInt(cell.textContent); - var color; + goalDifferenceCells.forEach(function (cell) { + var goalDifference = parseInt(cell.textContent); + var color; - if (goalDifference < 0) - { - // Gradually darken the text color for negative goal differences - var darkenFactor = Math.ceil(goalDifference / -10); // Calculate the darken factor - var shade = Math.max(0, 255 - darkenFactor * 25); // Calculate the shade of red - color = "rgb(" + shade + ", 0, 0)"; // Create the color value - } - else if (goalDifference > 0) - { - // Gradually darken the text color for positive goal differences - var darkenFactor = Math.floor(goalDifference / 10); // Calculate the darken factor - var shade = Math.max(0, 155 - darkenFactor * 15); // Adjusted the starting point to make greens darker - color = "rgb(0, " + shade + ", 0)"; // Create the color value - } - else - { - color = "inherit"; // If goal difference is 0, leave text color unchanged - } + if (goalDifference < 0) { + // Gradually darken the text color for negative goal differences + var darkenFactor = Math.ceil(goalDifference / -10); // Calculate the darken factor + var shade = Math.max(0, 255 - darkenFactor * 25); // Calculate the shade of red + color = "rgb(" + shade + ", 0, 0)"; // Create the color value + } else if (goalDifference > 0) { + // Gradually darken the text color for positive goal differences + var darkenFactor = Math.floor(goalDifference / 10); // Calculate the darken factor + var shade = Math.max(0, 155 - darkenFactor * 15); // Adjusted the starting point to make greens darker + color = "rgb(0, " + shade + ", 0)"; // Create the color value + } else { + color = "inherit"; // If goal difference is 0, leave text color unchanged + } - cell.style.color = color; // Apply the calculated color - }); + cell.style.color = color; // Apply the calculated color + }); }); diff --git a/public/assets/js/navigation-bar/navigation-bar-follow.js b/public/assets/js/navigation-bar/navigation-bar-follow.js index 461bb8d..b3fcf63 100644 --- a/public/assets/js/navigation-bar/navigation-bar-follow.js +++ b/public/assets/js/navigation-bar/navigation-bar-follow.js @@ -2,44 +2,44 @@ // Function to add sticky behavior to the navbar function makeNavbarSticky() { - // Get the navigation bar element - var navbar = document.getElementById("navigation-bar-container"); - var accountPane = document.querySelector(".account-portal-container"); // Use querySelector instead of getElementByClassName + // Get the navigation bar element + var navbar = document.getElementById("navigation-bar-container"); + var accountPane = document.querySelector(".account-portal-container"); // Use querySelector instead of getElementByClassName - // Get the initial offset of the navbar from the top of the page - var navbarOffset = navbar.offsetTop; + // Get the initial offset of the navbar from the top of the page + var navbarOffset = navbar.offsetTop; - // Function to add sticky behavior when scrolling - function stickyNavbar() { - // Check if the current scroll position is greater than or equal to the initial offset of the navbar - if (window.pageYOffset >= navbarOffset) { - // Add the 'fixed-top' class to make the navbar sticky - navbar.classList.add("fixed-top"); - // Add padding to the body to prevent content from jumping when the navbar becomes sticky - document.body.style.paddingTop = navbar.offsetHeight + "px"; - - // Adjust the position of the account pane - accountPane.style.position = "fixed"; // Make the account pane fixed - accountPane.style.top = navbar.offsetHeight + 20 + 'px'; // Move the account pane below the navbar - } else { - // Remove the 'fixed-top' class to make the navbar non-sticky - navbar.classList.remove("fixed-top"); - // Reset the padding of the body - document.body.style.paddingTop = 0; - accountPane.style.position = "absolute"; // Make the account pane fixed - - // Set the top position of the account pane to be 150px off the top - accountPane.style.top = "160px"; - } - } + // Function to add sticky behavior when scrolling + function stickyNavbar() { + // Check if the current scroll position is greater than or equal to the initial offset of the navbar + if (window.pageYOffset >= navbarOffset) { + // Add the 'fixed-top' class to make the navbar sticky + navbar.classList.add("fixed-top"); + // Add padding to the body to prevent content from jumping when the navbar becomes sticky + document.body.style.paddingTop = navbar.offsetHeight + "px"; - // Call the stickyNavbar function when the page is scrolled - window.onscroll = function() { - stickyNavbar(); - }; + // Adjust the position of the account pane + accountPane.style.position = "fixed"; // Make the account pane fixed + accountPane.style.top = navbar.offsetHeight + 20 + "px"; // Move the account pane below the navbar + } else { + // Remove the 'fixed-top' class to make the navbar non-sticky + navbar.classList.remove("fixed-top"); + // Reset the padding of the body + document.body.style.paddingTop = 0; + accountPane.style.position = "absolute"; // Make the account pane fixed + + // Set the top position of the account pane to be 150px off the top + accountPane.style.top = "160px"; + } + } + + // Call the stickyNavbar function when the page is scrolled + window.onscroll = function () { + stickyNavbar(); + }; } // Call the makeNavbarSticky function when the page loads -window.onload = function() { - makeNavbarSticky(); +window.onload = function () { + makeNavbarSticky(); }; diff --git a/public/assets/js/navigation-bar/user/delete-account-favorite-club.js b/public/assets/js/navigation-bar/user/delete-account-favorite-club.js index 5953307..7ec44fa 100644 --- a/public/assets/js/navigation-bar/user/delete-account-favorite-club.js +++ b/public/assets/js/navigation-bar/user/delete-account-favorite-club.js @@ -1,36 +1,37 @@ -document.addEventListener("DOMContentLoaded", function() { - var deleteButtons = document.querySelectorAll("#account-delete-favorite-team-button-hover"); - deleteButtons.forEach(function(deleteButton) { - deleteButton.addEventListener("click", function() { - var userID = deleteButton.getAttribute("userID"); - var teamID = deleteButton.getAttribute("teamID"); - - if (deleteButton.src.includes("/delete-club-hover.png")) { - removeAccountFavoriteTeam(userID, teamID); - } - }); - }); +document.addEventListener("DOMContentLoaded", function () { + var deleteButtons = document.querySelectorAll( + "#account-delete-favorite-team-button-hover" + ); + deleteButtons.forEach(function (deleteButton) { + deleteButton.addEventListener("click", function () { + var userID = deleteButton.getAttribute("userID"); + var teamID = deleteButton.getAttribute("teamID"); + + if (deleteButton.src.includes("/delete-club-hover.png")) { + removeAccountFavoriteTeam(userID, teamID); + } + }); + }); }); async function removeAccountFavoriteTeam(userID, teamID) { - try { - const response = await fetch('/favteam/remove', { - method: 'POST', - headers: { - 'Content-Type': 'application/json' - }, - body: JSON.stringify({ - userID: userID, - teamID: teamID - }) - }); - - if (response.status === 200) { - console.log('Favorite team removed successfully.'); - location.reload(); // Refresh the page - } + try { + const response = await fetch("/favteam/remove", { + method: "POST", + headers: { + "Content-Type": "application/json", + }, + body: JSON.stringify({ + userID: userID, + teamID: teamID, + }), + }); - } catch (error) { - console.error('Error removing favorite team:', error); - } + if (response.status === 200) { + console.log("Favorite team removed successfully."); + location.reload(); // Refresh the page + } + } catch (error) { + console.error("Error removing favorite team:", error); + } } diff --git a/public/assets/js/navigation-bar/user/login-and-register-page-linking.js b/public/assets/js/navigation-bar/user/login-and-register-page-linking.js index 384638f..da5e938 100644 --- a/public/assets/js/navigation-bar/user/login-and-register-page-linking.js +++ b/public/assets/js/navigation-bar/user/login-and-register-page-linking.js @@ -1,41 +1,34 @@ -$(document).ready(function() { +$(document).ready(function () { + // When #user is clicked + $("#user-profile-button").click(function () { + $("#register-screen-container").hide(); + // Toggle the visibility of the login container + $("#login-pane").toggle(); + }); - // When #user is clicked - $('#user-profile-button').click(function() { - - $('#register-screen-container').hide(); - // Toggle the visibility of the login container - $('#login-pane').toggle(); - }); - - $('#register-page-login-button').click(function (event) { - event.preventDefault(); // Prevent the default action of following the link - - $('#register-screen-container').hide(); - $('#login-pane').show(); - }); + $("#register-page-login-button").click(function (event) { + event.preventDefault(); // Prevent the default action of following the link + $("#register-screen-container").hide(); + $("#login-pane").show(); + }); }); $(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 + // Listen for click event on the register button + $("#register-button").click(function (event) { + event.preventDefault(); // Prevent the default action of following the link - $('#login-pane').hide(); - // Show the register container - $('#register-screen-container').show(); - }); - + $("#login-pane").hide(); + // Show the register container + $("#register-screen-container").show(); + }); }); -$(document).ready(function() { - - // When #user is clicked - $('#user-profile-button').click(function() { - - // Toggle the visibility of the login container - $('#account-pane').toggle(); - }); -}); \ No newline at end of file +$(document).ready(function () { + // When #user is clicked + $("#user-profile-button").click(function () { + // Toggle the visibility of the login container + $("#account-pane").toggle(); + }); +}); diff --git a/public/views/partials/navigation-bar/user-menu/login.hbs b/public/views/partials/navigation-bar/user-menu/login.hbs index 975449a..f29fb80 100644 --- a/public/views/partials/navigation-bar/user-menu/login.hbs +++ b/public/views/partials/navigation-bar/user-menu/login.hbs @@ -1,6 +1,8 @@
+
+

Login

diff --git a/src/middleware/clubs-page/get-current-club-information.js b/src/middleware/clubs-page/get-current-club-information.js index 4e2d8ca..26e23e3 100644 --- a/src/middleware/clubs-page/get-current-club-information.js +++ b/src/middleware/clubs-page/get-current-club-information.js @@ -1,74 +1,77 @@ -const axios = require('axios'); +const axios = require("axios"); // Middleware function to fetch clubs data const fetchClubsData = async (req, res, next) => { - try { - // Extract club ID from the URL - const clubID = req.params.clubID; + try { + // Extract club ID from the URL + const clubID = req.params.clubID; - // Make GET request to the API endpoint using the club ID - const response = await axios.get(`http://api.football-data.org/v4/teams/${clubID}/?offset=&limit=`, { - headers: { - 'X-Auth-Token': '0aa1ed31245d4a36b1ef5a79150324b3', // Add your API key here - }, - }); + // Make GET request to the API endpoint using the club ID + const response = await axios.get( + `http://api.football-data.org/v4/teams/${clubID}/?offset=&limit=`, + { + headers: { + "X-Auth-Token": "0aa1ed31245d4a36b1ef5a79150324b3", // Add your API key here + }, + } + ); - // Extract relevant data from the API response - const clubData = response.data; - // res.locals.user = users - // Attach the data to res.locals - res.locals.club = { - area: { - id: clubData.area.id, - name: clubData.area.name, - code: clubData.area.code, - club_flag: clubData.area.flag, - }, - club_id: clubData.id, - name: clubData.name, - shortName: clubData.shortName, - tla: clubData.tla, - crest: clubData.crest, - address: clubData.address, - website: clubData.website, - founded: clubData.founded, - clubColors: clubData.clubColors, - venue: clubData.venue, - runningCompetitions: clubData.runningCompetitions.map(competition => ({ - id: competition.id, - name: competition.name, - code: competition.code, - type: competition.type, - emblem: competition.emblem - })), - coach: { - id: clubData.coach.id, - firstName: clubData.coach.firstName, - lastName: clubData.coach.lastName, - name: clubData.coach.name, - dateOfBirth: clubData.coach.dateOfBirth, - nationality: clubData.coach.nationality, - contract: { - start: clubData.coach.contract.start, - until: clubData.coach.contract.until - } - }, - squad: clubData.squad.map(player => ({ - id: player.id, - name: player.name, - position: player.position, - dateOfBirth: player.dateOfBirth, - nationality: player.nationality - })), - staff: clubData.staff, - lastUpdated: clubData.lastUpdated - }; - next(); - } catch (error) { - console.error('Error fetching clubs data:', error); - res.locals.club = null; // Set to null if there's an error - next(); // Call next middleware or route handler - } + // Extract relevant data from the API response + const clubData = response.data; + // res.locals.user = users + // Attach the data to res.locals + res.locals.club = { + area: { + id: clubData.area.id, + name: clubData.area.name, + code: clubData.area.code, + club_flag: clubData.area.flag, + }, + club_id: clubData.id, + name: clubData.name, + shortName: clubData.shortName, + tla: clubData.tla, + crest: clubData.crest, + address: clubData.address, + website: clubData.website, + founded: clubData.founded, + clubColors: clubData.clubColors, + venue: clubData.venue, + runningCompetitions: clubData.runningCompetitions.map((competition) => ({ + id: competition.id, + name: competition.name, + code: competition.code, + type: competition.type, + emblem: competition.emblem, + })), + coach: { + id: clubData.coach.id, + firstName: clubData.coach.firstName, + lastName: clubData.coach.lastName, + name: clubData.coach.name, + dateOfBirth: clubData.coach.dateOfBirth, + nationality: clubData.coach.nationality, + contract: { + start: clubData.coach.contract.start, + until: clubData.coach.contract.until, + }, + }, + squad: clubData.squad.map((player) => ({ + id: player.id, + name: player.name, + position: player.position, + dateOfBirth: player.dateOfBirth, + nationality: player.nationality, + })), + staff: clubData.staff, + lastUpdated: clubData.lastUpdated, + }; + next(); + } catch (error) { + console.error("Error fetching clubs data:", error); + res.locals.club = null; // Set to null if there's an error + next(); // Call next middleware or route handler + } }; module.exports = fetchClubsData; diff --git a/src/routes/club-pages/generate-club-routes.js b/src/routes/club-pages/generate-club-routes.js index d813205..d797b09 100644 --- a/src/routes/club-pages/generate-club-routes.js +++ b/src/routes/club-pages/generate-club-routes.js @@ -1,17 +1,15 @@ -const express = require('express'); +const express = require("express"); const app = express(); // generate-league-routes.js // Define a function to generate league routes module.exports = function generateClubRoutes(app) { - // Define a route to handle requests to "/league/:leagueName" - app.get('/club/:clubID', (req, res) => { - // Extract the league name from the URL parameters - const clubID = req.params.clubID; - // Render the league page template using Handlebars - res.render('pages/club-page', { clubID: clubID, }); - }); + // Define a route to handle requests to "/league/:leagueName" + app.get("/club/:clubID", (req, res) => { + // Extract the league name from the URL parameters + const clubID = req.params.clubID; + // Render the league page template using Handlebars + res.render("pages/club-page", { clubID: clubID }); + }); }; - - diff --git a/src/routes/club-pages/redirect-to-club-url.js b/src/routes/club-pages/redirect-to-club-url.js index d3ebcc5..6799294 100644 --- a/src/routes/club-pages/redirect-to-club-url.js +++ b/src/routes/club-pages/redirect-to-club-url.js @@ -1,17 +1,21 @@ // Add click event listener to club logos -document.querySelectorAll('#league-table-club-logo, #league-table-club-name-column, #league-top-scorers-logo, #league-top-scorers-club-name-column').forEach(element => { - element.addEventListener('click', (event) => { - // Get the club ID from the clicked club logo's clubID attribute - const clubId = element.getAttribute('clubID'); - redirectToClubPage(clubId); - }); -}); +document + .querySelectorAll( + "#league-table-club-logo, #league-table-club-name-column, #league-top-scorers-logo, #league-top-scorers-club-name-column" + ) + .forEach((element) => { + element.addEventListener("click", (event) => { + // Get the club ID from the clicked club logo's clubID attribute + const clubId = element.getAttribute("clubID"); + redirectToClubPage(clubId); + }); + }); // Function to redirect to the club page function redirectToClubPage(clubID) { - // Append the club ID to the URL - var url = "/club/" + clubID; + // Append the club ID to the URL + var url = "/club/" + clubID; - // Redirect to the club page - window.location.href = url; + // Redirect to the club page + window.location.href = url; } diff --git a/src/routes/league-pages/generate-league-routes.js b/src/routes/league-pages/generate-league-routes.js index ae7a9ff..7295674 100644 --- a/src/routes/league-pages/generate-league-routes.js +++ b/src/routes/league-pages/generate-league-routes.js @@ -1,17 +1,15 @@ -const express = require('express'); +const express = require("express"); const app = express(); // generate-league-routes.js // Define a function to generate league routes module.exports = function generateLeagueRoutes(app) { - // Define a route to handle requests to "/league/:leagueName" - app.get('/league/:leagueID', (req, res) => { - // Extract the league name from the URL parameters - const leagueID = req.params.leagueID; - // Render the league page template using Handlebars - res.render('pages/leagues-page', { leagueID: leagueID, user: user}); - }); + // Define a route to handle requests to "/league/:leagueName" + app.get("/league/:leagueID", (req, res) => { + // Extract the league name from the URL parameters + const leagueID = req.params.leagueID; + // Render the league page template using Handlebars + res.render("pages/leagues-page", { leagueID: leagueID, user: user }); + }); }; - - diff --git a/src/routes/league-pages/get-team-names-for-registry.js b/src/routes/league-pages/get-team-names-for-registry.js index 920bf33..c99487b 100644 --- a/src/routes/league-pages/get-team-names-for-registry.js +++ b/src/routes/league-pages/get-team-names-for-registry.js @@ -1,21 +1,21 @@ -const axios = require('axios'); +const axios = require("axios"); const fetchTeamNames = async (selectedLeague) => { - try { - const response = await axios({ - url: `http://api.football-data.org/v4/competitions/${selectedLeague}/teams`, - method: 'GET', - headers: { - 'X-Auth-Token': '0aa1ed31245d4a36b1ef5a79150324b3', - }, - }); - - const teams = response.data.teams.map(team => team.name); - return teams; - } catch (error) { - console.error('Error fetching teams data:', error); - return []; - } + try { + const response = await axios({ + url: `http://api.football-data.org/v4/competitions/${selectedLeague}/teams`, + method: "GET", + headers: { + "X-Auth-Token": "0aa1ed31245d4a36b1ef5a79150324b3", + }, + }); + + const teams = response.data.teams.map((team) => team.name); + return teams; + } catch (error) { + console.error("Error fetching teams data:", error); + return []; + } }; module.exports = fetchTeamNames; diff --git a/src/routes/league-pages/redirect-to-league-url.js b/src/routes/league-pages/redirect-to-league-url.js index 7200b4b..1d93d87 100644 --- a/src/routes/league-pages/redirect-to-league-url.js +++ b/src/routes/league-pages/redirect-to-league-url.js @@ -1,7 +1,7 @@ function redirectToLeaguePage(leagueID) { - // Append the league name to the URL - var url = "/league/" + leagueID; - - // Redirect to the league page - window.location.href = url; -} \ No newline at end of file + // Append the league name to the URL + var url = "/league/" + leagueID; + + // Redirect to the league page + window.location.href = url; +}