-
Notifications
You must be signed in to change notification settings - Fork 4
/
editProfile.html
161 lines (144 loc) · 8.49 KB
/
editProfile.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
151
152
153
154
155
156
157
158
159
160
161
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Edit Profile</title>
<link rel="stylesheet" href="./style/editProfile.css">
</head>
<body>
<div id="jnavbar">
<a href="index.html"><img src="./icons/download.svg" alt=""></a>
<div id="explore">
<button id="explore_button">Explore <span class="iconify" data-icon="dashicons:arrow-left-alt2" style="font-size: 12px;" data-rotate="270deg"></span></button>
<div id="explore_option">
<div class="faltu_div_on_navbar"></div>
<div class="left_explore_option">
<ul>
<li>Goals</li>
<li>Take a free course</li>
<li><p>Earn a Degree</p><span class="iconify" data-icon="dashicons:arrow-left-alt2" style="font-size: 18px;" data-rotate="180deg"></span>
<!-- <div class="right_explore_option">
</div> -->
</li>
<li><p>Earn a Certificate</p><span class="iconify" data-icon="dashicons:arrow-left-alt2" style="font-size: 18px;" data-rotate="180deg"></span></li>
<li><p>Advance your career</p><span class="iconify" data-icon="dashicons:arrow-left-alt2" style="font-size: 18px;" data-rotate="180deg"></span></li>
<li>Find your new career</li>
<li>Train your team</li>
</ul>
<ul>
<li>Subjects</li>
<li><p>Data Science</p><span class="iconify" data-icon="dashicons:arrow-left-alt2" style="font-size: 18px;" data-rotate="180deg"></span></li>
<li><p>Business</p><span class="iconify" data-icon="dashicons:arrow-left-alt2" style="font-size: 18px;" data-rotate="180deg"></span></li>
<li><p>Computer Science</p><span class="iconify" data-icon="dashicons:arrow-left-alt2" style="font-size: 18px;" data-rotate="180deg"></span></li>
<li><p>Information Technology</p><span class="iconify" data-icon="dashicons:arrow-left-alt2" style="font-size: 18px;" data-rotate="180deg"></span></li>
<li><p>Language Learning</p><span class="iconify" data-icon="dashicons:arrow-left-alt2" style="font-size: 18px;" data-rotate="180deg"></span></li>
<li><p>Health</p><span class="iconify" data-icon="dashicons:arrow-left-alt2" style="font-size: 18px;" data-rotate="180deg"></span></li>
<li><p>Personal Development</p><span class="iconify" data-icon="dashicons:arrow-left-alt2" style="font-size: 18px;" data-rotate="180deg"></span></li>
<li><p>Physical Science and Engineering</p><span class="iconify" data-icon="dashicons:arrow-left-alt2" style="font-size: 18px;" data-rotate="180deg"></span></li>
<li><p>Social Sciences</p><span class="iconify" data-icon="dashicons:arrow-left-alt2" style="font-size: 18px;" data-rotate="180deg"></span></li>
<li><p>Arts and Humanities</p><span class="iconify" data-icon="dashicons:arrow-left-alt2" style="font-size: 18px;" data-rotate="180deg"></span></li>
<li><p>Math and Logic</p><span class="iconify" data-icon="dashicons:arrow-left-alt2" style="font-size: 18px;" data-rotate="180deg"></span></li>
</ul>
<button>Browse all subjects</button>
</div>
</div>
</div>
<input id="input_of_navbar" type="text" placeholder="What do you want to learn?">
<button id="search"><span class="iconify" data-icon="eva:search-outline" data-width="20"></span></button>
<p><a href="">Online Degrees</a></p>
<p><a href="">Find your New Career</a></p>
<p><a href="">For Enterprise</a></p>
<p><a href="">For Universities</a></p>
<p><a id="log_in_text" href="">Log In</a></p>
<button id="join_for_free">Your Profile</button>
</div>
<div id="bgcolor">
<div class="box">
<div class="profile_box">
<p>Edit my profile</p>
<button><a href="">View Profile</a></button>
</div>
<div class="intro">
<p class="text1">Details About you</p>
<p>Let the Coursera community of other learners and instructors recognize you.</p>
</div>
<div class="formdiv">
<form action="">
<div class="flex">
<h4>Full Name</h4>
<input type="text" id="name">
</div>
<div class="flex">
<h4>Profile Photo</h4>
<div class="imgupload" >
<!-- <button type="file" class="btn">Upload Photo</button> -->
<input type="file" id="file" value="Upload Photo"class="btn" accept="image/png, image/jpeg" ></input>
<p>Maximum size of 1MB. JPG, GIF, or PNG.</p>
</div>
</div>
<div class="formdiv">
<table>
<tr>
<td>Location</td>
<td><input type="text" id="address" class="name"placeholder="Tell us the city"></td>
</tr>
<tr>
<td>Gender</td>
<td><input type="text" id="gender" class="name" placeholder="Tell us about your top skills"></td>
</tr>
<tr>
<td>Phone Number</td>
<td><input type="text" id="phone" class="name"placeholder="Enter number here"></td>
</tr>
<tr>
<td>Details Privacy</td>
<td><input type="text" class="name"placeholder="Only me"></td>
</tr>
</table>
</div>
</form>
</div>
<hr class="line">
<button class="btn2" id="SaveProfile"><a href="Login.html">Save Profile</a></button>
</div>
</div>
</body>
</html>
<script>
document.getElementById("SaveProfile").addEventListener("click", save)
let url=`https://coursera-backend-nodejs.herokuapp.com/edit-profile/${JSON.parse(localStorage.getItem("userID"))}`
let token= JSON.parse(localStorage.getItem("Course-eraToken"))
async function save(event){
event.preventDefault()
let fullname=document.getElementById("name").value||""
let address=document.getElementById("address").value||""
let phone=document.getElementById("phone").value||""
let gender=document.getElementById("gender").value||""
let profilepic= document.getElementById("file").value||""
// console.log(profilepic)
const result= await fetch(url,{
method:"PATCH",
headers:{
'Content-Type':'application/json',
"enctype":"multipart/form-data",
Authorization:JSON.parse(localStorage.getItem("Course-eraToken"))
},
body:
JSON.stringify({
fullname,
profilepic,
address,
gender,
phone
}),
}).then((res)=>{
return res.json()
})
console.log(result)
if(!result.error){
window.location.href="index.html"
}
}
</script>