Skip to content

Commit

Permalink
Merge pull request #1201 from Subhajit-2023-44/2
Browse files Browse the repository at this point in the history 
Add Edit Profile Feature in Profile Page done ! #1197 🟢🌟
  • Loading branch information
@vimistify
vimistify authored Nov 8, 2024
2 parents d869fc8 + 7859bf9 commit 1d22285
Show file tree
Hide file tree
Showing 4 changed files with 501 additions and 61 deletions.
32 changes: 27 additions & 5 deletions index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -468,12 +468,34 @@
<span>Nearby</span></a>
</li>

<!-- Profile Icon -->
<li class="nav-item no-underline">

<!-- Profile Icon -->
<li class="nav-item no-underline">
<a href="./profile.html" class="profile-link" style="display: flex; align-items: center; text-decoration: none;">
<img src="https://i.postimg.cc/NFFmtc9K/xnz-Mst5-V-400x400.jpg" alt="Profile Icon" style="width: 30px; height: 30px; border-radius: 50%; margin-right: 4px;">
</a>
</li>
<img id="homeProfileImage" src="https://i.postimg.cc/NFFmtc9K/xnz-Mst5-V-400x400.jpg"
alt="Profile Icon"
style="width: 30px; height: 30px; border-radius: 50%; margin-right: 4px;">
</a>
</li>

<script>

document.addEventListener("DOMContentLoaded", function() {
// Retrieve the saved avatar from localStorage
const savedAvatar = localStorage.getItem("selectedAvatar");

// If an avatar is saved, update the profile image
if (savedAvatar) {
const homeProfileImage = document.getElementById("homeProfileImage");
if (homeProfileImage) {
homeProfileImage.src = savedAvatar;
}
}
});


</script>


<style>

Expand Down
111 changes: 79 additions & 32 deletions profile.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,14 +2,12 @@
<html lang="en">

<head>

<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
<link rel="stylesheet" href="testp.css"> <!-- Link to your CSS file -->

<script src="testp.js" defer></script>

<title>Profile Page</title>

</head>
Expand All @@ -19,35 +17,38 @@
<div class="profile-container">

<div class="content-section">
<h2>Your Profile</h2>
<h2>Your Profile</h2>
<a href="index.html">
<i class="fas fa-home"></i>
</a>
<div class="profile-card">
<div class="profile-header">
<img src="https://i.postimg.cc/NFFmtc9K/xnz-Mst5-V-400x400.jpg" alt="Profile Image" class="profile-image">
<!-- Profile image will be set dynamically -->
<img id="profileImage" src="https://i.postimg.cc/NFFmtc9K/xnz-Mst5-V-400x400.jpg" alt="Profile Image" class="profile-image">

<div class="profile-info">
<h3 class="profile-name">Joan Reed</h3>
<p class="profile-email">Role: Patient</p>
<p class="profile-email">Email: [email protected]</p>
<p class="profile-phone">Phone: +987 654 3210</p>
<p id="last-active">Emergency Contact: +983 928 1988</p>
<p class="profile-bio">Date of Birth: 02/02/02</p>
<p class="profile-bio">Gender: Male</p>
<p id="last-active">Preferred Language: Hindi</p>
<p id="last-active">Last active: 31/10/2024, 11:12 PM</p>

<!-- Profile info will be set dynamically -->
<h3 id="profileName" class="profile-name">Joan Reed</h3>
<p id="profileRole" class="profile-role">Role: Patient</p>
<p id="profileEmail" class="profile-email">Email: [email protected]</p>
<p id="profilePhone" class="profile-phone">Phone: +987 654 3210</p>
<p id="profileEmergencyContact" class="profile-emergency-contact">Emergency Contact: +983 928 1988</p>
<p id="profileDOB" class="profile-dob">Date of Birth: 02/02/02</p>
<p id="profileGender" class="profile-gender">Gender: Male</p>
<p id="profileLanguage" class="profile-language">Preferred Language: Hindi</p>
<p id="last-active" class="profile-bio">Last active: </p>
</div>

</div>
<a href="profileedit.html">
<button class="edit-profile-btn edit_profiled">Edit Profile</button>
</a>

</div>

</div>

<!-- Account Details and other sections remain the same -->
<div class="content-section">

<h2>Account Details</h2>
<div class="profile-details">
<div class="profile-detail-card" id="profileCard">
Expand All @@ -58,48 +59,94 @@ <h3>Address</h3>

<div class="profile-detail-card">
<h3>Change Password</h3>
<p>*********63</p>
<button class="edit-profile-btn">Change</button></a>
<p>*****63</p>
<button class="edit-profile-btn">Change</button>
</div>

<div class="profile-detail-card">
<h3>Privacy Settings</h3>
<p>Visibility Status: Public</p>
<a href="#">
<button class="edit-profile-btn">Edit</button></a>
<button class="edit-profile-btn">Edit</button>
</a>
</div>

<div class="profile-detail-card">
<h3>Medical History</h3>
<p>Last Checkup: October 2024</p>
<a href="#">
<button class="edit-profile-btn">View</button></a>
<button class="edit-profile-btn">View</button>
</a>
</div>

</div>

</div>

<section class="content-section">

<h2>Notifications</h2>
<div class="card">
<p>[October 31, 2024] You have an upcoming appointment with Dr. Jane Smith on November 03, 2024.</p>

<button class="edit-profile-btn">View Notification</button>
</div>
<div class="card">
<p>[October 30, 2024] Your annual check-up was successful. Please continue your current medication and schedule a follow-up appointment in 6 months.</p>

<p>Your profile has been updated successfully!</p>
<button class="edit-profile-btn">View Notification</button>
</div>
<div class="card">
<p>[October 29, 2024] Your profile has been updated successfully!</p>

<p>Joshef Roy has sent you a friend request. Accept or decline?</p>
<button class="edit-profile-btn">View Notification</button>
</div>

</section>

</div>

<script>

document.addEventListener("DOMContentLoaded", function() {
// Load saved profile information from localStorage
const savedName = localStorage.getItem("profileName");
const savedRole = localStorage.getItem("profileRole");
const savedEmail = localStorage.getItem("profileEmail");
const savedPhone = localStorage.getItem("profilePhone");
const savedEmergencyContact = localStorage.getItem("emergencyContact");
const savedDOB = localStorage.getItem("dob");
const savedGender = localStorage.getItem("gender");
const savedPreferredLanguage = localStorage.getItem("preferredLanguage");
const savedAvatar = localStorage.getItem("selectedAvatar");
const savedLastActive = localStorage.getItem("lastActive"); // Load last active time

// Update profile information if it exists in localStorage
if (savedName) {
document.getElementById("profileName").textContent = savedName;
}
if (savedRole) {
document.getElementById("profileRole").textContent = `Role: ${savedRole}`;
}
if (savedEmail) {
document.getElementById("profileEmail").textContent = `Email: ${savedEmail}`;
}
if (savedPhone) {
document.getElementById("profilePhone").textContent = `Phone: ${savedPhone}`;
}
if (savedEmergencyContact) {
document.getElementById("profileEmergencyContact").textContent = `Emergency Contact: ${savedEmergencyContact}`;
}
if (savedDOB) {
document.getElementById("profileDOB").textContent = `Date of Birth: ${savedDOB}`;
}
if (savedGender) {
document.getElementById("profileGender").textContent = `Gender: ${savedGender}`;
}
if (savedPreferredLanguage) {
document.getElementById("profileLanguage").textContent = `Preferred Language: ${savedPreferredLanguage}`;
}

if (savedAvatar) {
document.getElementById("profileImage").src = savedAvatar;
}
});

</script>

</body>

</html>


Loading

0 comments on commit 1d22285

Please sign in to comment.