From 6faec75ae2f2c184767a63610082fced3892caa9 Mon Sep 17 00:00:00 2001 From: Vishal Vunnam Date: Wed, 17 Apr 2024 18:06:45 -0600 Subject: [PATCH] added js and worked on Login feature(still in progress) --- ProjectSourceCode/docker-compose.yaml | 2 +- ProjectSourceCode/src/index.js | 41 ++++++++++++++++++- ProjectSourceCode/src/init_data/create.sql | 4 +- .../js/account-info/favorite-team.js | 0 .../resources/js/club-page/favorite-button.js | 32 ++++++++++++++- .../js/registration/league-and-team-select.js | 1 + .../get-current-club-information.js | 1 - .../get-current-league-information.js | 4 +- .../routes/club-pages/generate-club-routes.js | 2 +- .../league-pages/generate-league-routes.js | 5 ++- .../get-team-names-for-registry.js | 2 +- .../src/views/pages/clubs-page.hbs | 2 +- ProjectSourceCode/src/views/pages/home.hbs | 10 ++--- .../partials/navigation-bar/accountinfo.hbs | 6 +++ .../src/views/partials/navigation-bar/nav.hbs | 10 +++-- 15 files changed, 99 insertions(+), 23 deletions(-) create mode 100644 ProjectSourceCode/src/resources/js/account-info/favorite-team.js create mode 100644 ProjectSourceCode/src/views/partials/navigation-bar/accountinfo.hbs diff --git a/ProjectSourceCode/docker-compose.yaml b/ProjectSourceCode/docker-compose.yaml index eca8a77..ba88fc4 100644 --- a/ProjectSourceCode/docker-compose.yaml +++ b/ProjectSourceCode/docker-compose.yaml @@ -33,6 +33,6 @@ services: volumes: - ../ProjectSourceCode:/home/node/app # Mount ProjectSourceCode directory - ../ProjectSourceCode/node_modules:/home/node/app/node_modules # Mount node_modules directory - command: 'npm run testandrun' + command: 'npm run start' volumes: group-project: \ No newline at end of file diff --git a/ProjectSourceCode/src/index.js b/ProjectSourceCode/src/index.js index 825ddc7..21c071e 100644 --- a/ProjectSourceCode/src/index.js +++ b/ProjectSourceCode/src/index.js @@ -155,13 +155,15 @@ app.post('/login', async (req, res) => { // Render the login page with the message parameter return res.render('pages/home', { message: 'Password does not match' }); } - + else{ // Save user information in the session variable req.session.user = user; req.session.save(); + console.log(user); // Redirect user to the home page res.redirect('/home'); + } } catch (error) { // Direct user to login screen if no user is found with matching password res.redirect('/register'); @@ -203,7 +205,8 @@ app.post('/register', async (req, res) => { *************************/ app.get('/home', (req, res) => { - res.render('pages/home'); + const loggedIn = req.session.user ? true : false; + res.render('pages/home', { loggedIn: loggedIn, user: req.session.user}); }); /************************ @@ -222,6 +225,40 @@ generateLeagueRoutes(app); const generateClubRoutes = require('./resources/routes/club-pages/generate-club-routes'); generateClubRoutes(app); +/************************ + Favorite Team Database +*************************/ + +// Function to add a new row to the FavoriteTeams table +// database configuration + +app.post('/courses/add', async (req, res) => { + const { userID, teamID, teamName, teamLogo } = req.body; + + try { + const { team_count } = await db.one( + 'SELECT COUNT(*) AS team_count FROM FavoriteTeams WHERE UserID = $1', + [userID] + ); + if (team_count >= 5) { + console.log('User has reached the maximum number of favorite teams.'); + return res.status(400).json({ message: 'User has reached the maximum number of favorite teams.' }); + } + + const query = { + text: 'INSERT INTO FavoriteTeams (UserID, TeamID, TeamName, TeamLogo) VALUES ($1, $2, $3, $4)', + values: [userID, teamID, teamName, teamLogo], + }; + + await db.none(query); + console.log('New favorite team added successfully.'); + return res.status(200).json({ message: 'New favorite team added successfully.' }); + } catch (error) { + console.error('Error adding favorite team:', error); + return res.status(500).json({ error: 'Error adding favorite team' }); + } +}); + // ***************************************************** // // ***************************************************** diff --git a/ProjectSourceCode/src/init_data/create.sql b/ProjectSourceCode/src/init_data/create.sql index de888d7..33d061f 100644 --- a/ProjectSourceCode/src/init_data/create.sql +++ b/ProjectSourceCode/src/init_data/create.sql @@ -5,8 +5,8 @@ CREATE TABLE users ( ); CREATE TABLE FavoriteTeams ( - UserID INT REFERENCES users(UserID) ON DELETE CASCADE ON UPDATE CASCADE, + UserID INT, TeamID INT, TeamName VARCHAR(50), - PRIMARY KEY (UserID, TeamID) + TeamLogo VARCHAR(100) ); diff --git a/ProjectSourceCode/src/resources/js/account-info/favorite-team.js b/ProjectSourceCode/src/resources/js/account-info/favorite-team.js new file mode 100644 index 0000000..e69de29 diff --git a/ProjectSourceCode/src/resources/js/club-page/favorite-button.js b/ProjectSourceCode/src/resources/js/club-page/favorite-button.js index 3969016..bfee40a 100644 --- a/ProjectSourceCode/src/resources/js/club-page/favorite-button.js +++ b/ProjectSourceCode/src/resources/js/club-page/favorite-button.js @@ -2,7 +2,35 @@ document.addEventListener("DOMContentLoaded", function() { var favoriteButton = document.getElementById("club-favorite-button"); if (favoriteButton) { favoriteButton.addEventListener("click", function() { - favoriteButton.src = "/img/club-page/favorited.png"; + if (favoriteButton.src.includes("/favorited.png")) { + favoriteButton.src = "/img/club-page/unfavorited.png"; + } else { + favoriteButton.src = "/img/club-page/favorited.png"; + addFavoriteTeam(1, 65, 'Manchester City FC', 'https://crests.football-data.org/65.png'); + + } }); } -}); + }); +async function addFavoriteTeam(userID, teamID, teamName, teamLogo) { + try { + const response = await fetch('/courses/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'); + } + console.log('New favorite team added successfully.'); + } catch (error) { + console.error('Error adding favorite team:', error); + } +} \ 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 index 2b9304c..71113fe 100644 --- a/ProjectSourceCode/src/resources/js/registration/league-and-team-select.js +++ b/ProjectSourceCode/src/resources/js/registration/league-and-team-select.js @@ -37,4 +37,5 @@ document.addEventListener("DOMContentLoaded", function() { selectElement.add(option); } }); + \ No newline at end of file diff --git a/ProjectSourceCode/src/resources/middleware/clubs-page/get-current-club-information.js b/ProjectSourceCode/src/resources/middleware/clubs-page/get-current-club-information.js index c28ec43..de9dc15 100644 --- a/ProjectSourceCode/src/resources/middleware/clubs-page/get-current-club-information.js +++ b/ProjectSourceCode/src/resources/middleware/clubs-page/get-current-club-information.js @@ -63,7 +63,6 @@ const fetchClubsData = async (req, res, next) => { staff: clubData.staff, lastUpdated: clubData.lastUpdated }; - next(); } catch (error) { console.error('Error fetching clubs data:', error); diff --git a/ProjectSourceCode/src/resources/middleware/leagues-page/get-current-league-information.js b/ProjectSourceCode/src/resources/middleware/leagues-page/get-current-league-information.js index 09eaf0f..d8726c9 100644 --- a/ProjectSourceCode/src/resources/middleware/leagues-page/get-current-league-information.js +++ b/ProjectSourceCode/src/resources/middleware/leagues-page/get-current-league-information.js @@ -17,6 +17,8 @@ const fetchLeaguesData = async (req, res, next) => { const leagueData = response.data; // Attach the data to res.locals + res.locals.username = req.session.user.username; + console.log(req.session.user) res.locals.league = { area: { league_flag: leagueData.area.flag, @@ -39,7 +41,7 @@ const fetchLeaguesData = async (req, res, next) => { draws: team.draw, goal_difference: team.goalDifference, points: team.points - })) + })), }; next(); } catch (error) { diff --git a/ProjectSourceCode/src/resources/routes/club-pages/generate-club-routes.js b/ProjectSourceCode/src/resources/routes/club-pages/generate-club-routes.js index c3ea81c..070c8d2 100644 --- a/ProjectSourceCode/src/resources/routes/club-pages/generate-club-routes.js +++ b/ProjectSourceCode/src/resources/routes/club-pages/generate-club-routes.js @@ -11,7 +11,7 @@ module.exports = function generateClubRoutes(app) { const clubID = req.params.clubID; // Render the league page template using Handlebars - res.render('pages/club-page', { clubID: clubID }); + res.render('pages/club-page', { clubID: clubID, user:user }); }); }; diff --git a/ProjectSourceCode/src/resources/routes/league-pages/generate-league-routes.js b/ProjectSourceCode/src/resources/routes/league-pages/generate-league-routes.js index 8dca5e8..0ee5d3d 100644 --- a/ProjectSourceCode/src/resources/routes/league-pages/generate-league-routes.js +++ b/ProjectSourceCode/src/resources/routes/league-pages/generate-league-routes.js @@ -8,10 +8,11 @@ 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 + console.log("jskjfhskjhdfkjh") const leagueID = req.params.leagueID; - + const user = req.session.user; // Render the league page template using Handlebars - res.render('pages/leagues-page', { leagueID: leagueID }); + res.render('pages/leagues-page', { leagueID: leagueID, user: user}); }); }; diff --git a/ProjectSourceCode/src/resources/routes/league-pages/get-team-names-for-registry.js b/ProjectSourceCode/src/resources/routes/league-pages/get-team-names-for-registry.js index 9f61dac..920bf33 100644 --- a/ProjectSourceCode/src/resources/routes/league-pages/get-team-names-for-registry.js +++ b/ProjectSourceCode/src/resources/routes/league-pages/get-team-names-for-registry.js @@ -9,7 +9,7 @@ const fetchTeamNames = async (selectedLeague) => { 'X-Auth-Token': '0aa1ed31245d4a36b1ef5a79150324b3', }, }); - + const teams = response.data.teams.map(team => team.name); return teams; } catch (error) { diff --git a/ProjectSourceCode/src/views/pages/clubs-page.hbs b/ProjectSourceCode/src/views/pages/clubs-page.hbs index fb35c60..4ebfc17 100644 --- a/ProjectSourceCode/src/views/pages/clubs-page.hbs +++ b/ProjectSourceCode/src/views/pages/clubs-page.hbs @@ -5,7 +5,7 @@

{{club.name}}

{{club.name}} Flag - Favorite Button + Favorite Button
diff --git a/ProjectSourceCode/src/views/pages/home.hbs b/ProjectSourceCode/src/views/pages/home.hbs index 8fe6d22..23f8549 100644 --- a/ProjectSourceCode/src/views/pages/home.hbs +++ b/ProjectSourceCode/src/views/pages/home.hbs @@ -4,17 +4,17 @@ diff --git a/ProjectSourceCode/src/views/partials/navigation-bar/accountinfo.hbs b/ProjectSourceCode/src/views/partials/navigation-bar/accountinfo.hbs new file mode 100644 index 0000000..930abe5 --- /dev/null +++ b/ProjectSourceCode/src/views/partials/navigation-bar/accountinfo.hbs @@ -0,0 +1,6 @@ + + \ No newline at end of file diff --git a/ProjectSourceCode/src/views/partials/navigation-bar/nav.hbs b/ProjectSourceCode/src/views/partials/navigation-bar/nav.hbs index 38357c1..744a5b4 100644 --- a/ProjectSourceCode/src/views/partials/navigation-bar/nav.hbs +++ b/ProjectSourceCode/src/views/partials/navigation-bar/nav.hbs @@ -48,10 +48,12 @@
- +{{#if user}} +
+ {{> navigation-bar/accountinfo}} +
+{{else}}
{{> navigation-bar/login}}
- - - +{{/if}}