-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathmain.html
118 lines (102 loc) · 4.33 KB
/
main.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
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>NotFacebook</title>
<!-- Bootstrap CSS -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-giJF6kkoqNQ00vy+HMDP7azOuL0xtbfIcaT9wjKHr8RbDVddVHyTfAAsrekwKmP1" crossorigin="anonymous">
<!-- Custom CSS -->
<link rel="stylesheet" type="text/css" href="css/style-site.css">
<script type="text/javascript" src="js/code.js" ></script>
<script>
if (readCookie() === null) {
window.location.href = "index.html";
}
</script>
</head>
<body onload="hideEdit()">
<!-- Creates logo border -->
<div class="mt-4">
<span class="border logo">
<span class = "not">Not</span>
<span class = "facebook">Facebook</span>
</span>
</div>
<!-- Search for a contact -->
<div class="container">
<div class="row">
<div class = "col md-5">
<div class="form-group pt-5 pb-5 mb-5">
<label for="contactSearch">
<h3></h3>
</label>
<input type="contact" class="form-control searchbar" id="contactSearch" placeholder="Search for contact" name="searchVar">
</div>
</div>
<span class="col">
<input type="image" id="contactSearchButton" src="media/glass.png" height="40px" class="glassImage" onclick="searchAccount()">
</span>
<button type="button" class="btn btn-success buttonadd" onclick=window.location.href="addContact.html">New Contact</button>
<span>
<button type="button" class="btn btn-danger logout" onclick="doLogout()">log out</button>
</span>
</div>
</div>
<div class="container mt-4 receivedform">
<label for="contactFound">
<h3></h3>
</label>
</div>
<div class="container received">
<div id= "th"></div>
<div id= "box"></div>
<p id="foundContacts"> Found contacts will appear here</p>
</div>
<div class="container" id="editbox" class="modal">
<h3 class="text-center">
Edit your contact:
</h3>
<label for="firstName"> <strong>First Name:</strong></label>
<input class="form-control firstnameinputupdate" type="text" id="editFirstName">
<br>
<label for="lastName"> <strong>Last Name:</strong></label>
<input class="form-control lastnameinputupdate" id="editLastName" type="text" >
<br>
<label for="email"> <strong>Email:</strong></label>
<input class="form-control emailinputupdate" id="editEmail" type="text">
<br>
<label for="telephone"> <strong>Phone Number:</strong></label>
<input class="form-control phoneinputupdate" id="editPhone" type="tel">
<br>
<div class="text-center">
<button type="button" class="btn btn-success createcontactbutton" onclick="updateContact()">Done</button>
<button type="button" class="btn btn-danger cancelupdatebutton" onclick="hideEdit()">Cancel</button>
</div>
<p id="contactEditResult"></p>
</div>
<div class="col mt-5">
<img src="media/startup.jpg" height="325px" class="startup">
</div>
<!-- Bottom text -->
<div class="container bottomtextmain">
<p>
NotFacebook's contact manager allows you to quickly create, store, and find your contacts.
Built with functionality in mind, we take pride in user satisfaction. With your contacts organized, we hope to ease
an integral part of your life and business.
</p>
</div>
<!-- Option 1: Bootstrap Bundle with Popper -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta1/dist/js/bootstrap.bundle.min.js" integrity="sha384-ygbV9kiqUc6oa4msXn9868pTtWMgiQaeYH7/t7LECLbyPA2x65Kgf80OJFdroafW" crossorigin="anonymous"></script>
<script>
var input = document.getElementById("contactSearch");
input.addEventListener("keyup", function(event) {
if (event.keyCode === 13) {
event.preventDefault();
document.getElementById("contactSearchButton").click();
}
});
</script>
</body>
</html>