diff --git a/client/html/pages/home/index.html b/client/html/pages/home/index.html index a6e8360..9f32920 100644 --- a/client/html/pages/home/index.html +++ b/client/html/pages/home/index.html @@ -120,11 +120,7 @@

- Profile Image +
diff --git a/client/js/home.js b/client/js/home.js index be88f7a..3b7144a 100644 --- a/client/js/home.js +++ b/client/js/home.js @@ -12,6 +12,7 @@ $(document).ready(function () { }, success: function (response) { $('#profile-username').text(`Welcome, ${username}`); + loadUserAvatar(); fetchUserBlurb(); fetchFriendsList(); fetchAndDisplayGames(); @@ -44,6 +45,70 @@ $(document).ready(function () { }); } + function loadUserAvatar() { + const token = localStorage.getItem('token'); + const userId = localStorage.getItem('userId'); + + if (!token || !userId) { + console.error('Missing token or userId'); + return; + } + + $.ajax({ + url: '/api/avatar', + method: 'GET', + headers: { + Authorization: `Bearer ${token}`, + 'Cache-Control': 'no-cache' + }, + success: function(response) { + console.log('Avatar data received:', response); + if (response && response.avatarRender && response.avatarRender.shirt) { + const avatarHtml = ` + User Avatar + + `; + $('#avatar-container').html(avatarHtml); + } else { + $('#avatar-container').html(` +
+
+

My Avatar

+
+
+

No avatar configured yet.

+ Create Avatar +
+
+ `); + } + }, + error: function(xhr, status, error) { + console.error('Error loading avatar:', { + error: error, + status: status, + response: xhr.responseText, + userId: userId + }); + $('#avatar-container').html(` +
+
+

Error Loading Avatar

+
+
+

Unable to load avatar. Please try again later.

+ Go to Avatar Page +
+
+ `); + } + }); +} + function displayBlurb(blurb) { const blurbHtml = `

${blurb ? escapeHtml(blurb) : 'No blurb set.'}

@@ -148,35 +213,22 @@ $(document).ready(function () {
- ${games - .slice(0, 4) - .map( - (game) => ` + ${games.slice(0, 4).map((game) => `
- ${ - game.year - ? `${game.year}` - : 'No Year' - } + ${game.year ? ` + ${game.year}` : 'No Year'} - ${ - game.title - } + ${game.title}
-

${ - game.title - }

-

Creator: ${game.creator.username}

+

${game.title}

+

Creator: ${game.creator.username}

` - ) - .join('')} + ).join('')}
View All Games diff --git a/client/js/user-profile.js b/client/js/user-profile.js index 6efce05..82c8ee2 100644 --- a/client/js/user-profile.js +++ b/client/js/user-profile.js @@ -26,17 +26,27 @@ $(document).ready(function () { Authorization: `Bearer ${token}`, }, success: function (user) { + if (!user || !user.username) { + console.error('Invalid user data received:', user); + $('#user-profile').html('

Error: Invalid user data received.

'); + return; + } console.log('User profile data received:', user); // Add this line currentUser = user; - fetchUserStatus(username).then((isOnline) => { - user.isOnline = isOnline; - fetchForumPostCount(user._id).then((postCount) => { - user.forumPostCount = postCount; - displayUserProfile(user); - }); - }); - document.getElementById('profile-title').textContent = `${user.username}'s Profile - Valkyrie`; - }, + updateFriendshipUI({ + isFriend: user.isFriend, + friendRequestSent: user.friendRequestSent, + friendRequestReceived: user.friendRequestReceived + }); + fetchUserStatus(username).then((isOnline) => { + user.isOnline = isOnline; + fetchForumPostCount(user._id).then((postCount) => { + user.forumPostCount = postCount; + displayUserProfile(user); + }); + }); + document.getElementById('profile-title').textContent = `${user.username}'s Profile - Valkyrie`; + }, error: function (xhr, status, error) { console.error('Error fetching user profile:', xhr.responseText); $('#user-profile').html('

Error fetching user profile. Please try again.

'); @@ -77,6 +87,12 @@ $(document).ready(function () { } function displayUserProfile(user) { + if (!user || !user.username) { + console.error('Invalid user data:', user); + $('#user-info').html('
Error loading user profile. Invalid user data.
'); + return; + } + console.log('Displaying profile for user:', { userId: user.userId, hasAvatarRender: !!user.avatarRender, @@ -237,6 +253,9 @@ $(document).ready(function () { Authorization: `Bearer ${token}`, }, success: function (response) { + currentUser.isFriend = response.isFriend; + currentUser.friendRequestSent = response.friendRequestSent; + currentUser.friendRequestReceived = response.friendRequestReceived; displayUserProfile(response); }, error: function (xhr, status, error) { @@ -250,7 +269,8 @@ $(document).ready(function () { sendAjaxRequest( '/api/friends/send-friend-request/' + userId, 'POST', - 'Friend request sent successfully' + 'Friend request sent successfully', + currentUser.username ); } @@ -258,7 +278,8 @@ $(document).ready(function () { sendAjaxRequest( '/api/friends/accept-friend-request/' + userId, 'POST', - 'Friend request accepted' + 'Friend request accepted', + currentUser.username ); } @@ -266,7 +287,8 @@ $(document).ready(function () { sendAjaxRequest( '/api/friends/decline-friend-request/' + userId, 'POST', - 'Friend request declined' + 'Friend request declined', + currentUser.username ); } @@ -274,11 +296,12 @@ $(document).ready(function () { sendAjaxRequest( '/api/friends/unfriend/' + userId, 'POST', - 'Unfriended successfully' + 'Unfriended successfully', + currentUser.username ); } - function sendAjaxRequest(url, method, successMessage) { + function sendAjaxRequest(url, method, successMessage, userId) { const token = localStorage.getItem('token'); $.ajax({ url: url, @@ -291,19 +314,10 @@ $(document).ready(function () { checkFriendshipStatus(userId); }, error: function (xhr, status, error) { - if ( - xhr.responseJSON && - xhr.responseJSON.error === - 'You have already received a friend request from this user' - ) { - alert( - 'You have already received a friend request from this user. Please check your friend requests.' - ); + if (xhr.responseJSON && xhr.responseJSON.error === 'You have already received a friend request from this user') { + alert('You have already received a friend request from this user. Please check your friend requests.'); } else { - alert( - 'Error: ' + - (xhr.responseJSON ? xhr.responseJSON.error : 'Unknown error') - ); + alert('Error: ' + (xhr.responseJSON ? xhr.responseJSON.error : 'Unknown error')); } checkFriendshipStatus(userId); }, @@ -315,9 +329,7 @@ $(document).ready(function () { const blurbContainer = $('#blurb-container'); blurbContainer.html(`

Edit About Me

- +

0/500

@@ -645,6 +657,7 @@ $(document).ready(function () { } function escapeHtml(unsafe) { + if (!unsafe) return ''; return unsafe .replace(/&/g, '&') .replace(/ + Unfriend + + + `; } else if (status.friendRequestReceived) { - actionButton = ` - - - `; + actionButton = ` + + + `; } else if (status.friendRequestSent) { - actionButton = ''; + actionButton = ` + + + `; } else { - actionButton = ` - - - `; + actionButton = ` + + + `; } $('#action-button-container').html(actionButton); initFriendActions(); - } */ +} }); function formatDate(dateString) { diff --git a/server/functions/api/routes/friends.js b/server/functions/api/routes/friends.js index ef821a9..c3f4999 100644 --- a/server/functions/api/routes/friends.js +++ b/server/functions/api/routes/friends.js @@ -80,20 +80,20 @@ router.post( // Add this new route after the existing friend-related routes router.get( - '/friendship-status/:userId', + '/friendship-status/:username', authenticateToken, async (req, res) => { try { - const currentUser = await User.findById({ userId: req.user.userId }); + const currentUser = await User.findOne({ userId: req.user.userId }); const targetUser = await User.findOne({ username: req.params.username }); if (!targetUser) { return res.status(404).json({ error: 'User not found' }); } - const isFriend = currentUser.friends.includes(targetUser.userId); - const friendRequestSent = targetUser.friendRequests.includes(currentUser.userId); - const friendRequestReceived = currentUser.friendRequests.includes(targetUser.userId); + const isFriend = currentUser.friends.some(id => id.equals(targetUser._id)); + const friendRequestSent = targetUser.friendRequests.some(id => id.equals(currentUser._id)); + const friendRequestReceived = currentUser.friendRequests.some(id => id.equals(targetUser._id)); res.json({ isFriend, diff --git a/server/functions/api/routes/user.js b/server/functions/api/routes/user.js index 07f9efd..a10eee4 100644 --- a/server/functions/api/routes/user.js +++ b/server/functions/api/routes/user.js @@ -30,9 +30,9 @@ router.get('/user/:username', authenticateToken, async (req, res) => { avatarRenderDetails: user.avatarRender }); - const isFriend = currentUser.friends.includes(user.userId); - const friendRequestSent = user.friendRequests.includes(currentUser.userId); - const friendRequestReceived = currentUser.friendRequests.includes(user.userId); + const isFriend = currentUser.friends.some(id => id.equals(user._id)); + const friendRequestSent = user.friendRequests.some(id => id.equals(currentUser._id)); + const friendRequestReceived = currentUser.friendRequests.some(id => id.equals(user._id)); delete user.friendRequests; delete user.friends;