-
Notifications
You must be signed in to change notification settings - Fork 285
/
profile.html
152 lines (126 loc) · 6.15 KB
/
profile.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
<!DOCTYPE html>
<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>
<body>
<div class="profile-container">
<div class="content-section">
<h2>Your Profile</h2>
<a href="index.html">
<i class="fas fa-home"></i>
</a>
<div class="profile-card">
<div class="profile-header">
<!-- 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">
<!-- 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">
<h3>Address</h3>
<p id="addressText" contenteditable="false">789 Pine Lane, Austin, TX 73301</p>
<a href="#"><button class="edit-profile-btn">Edit</button></a>
</div>
<div class="profile-detail-card">
<h3>Change Password</h3>
<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>
</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>
</div>
</div>
</div>
<section class="content-section">
<h2>Notifications</h2>
<div class="card">
<p>Your profile has been updated successfully!</p>
<button class="edit-profile-btn">View Notification</button>
</div>
<div class="card">
<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>