-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathdefault.html
executable file
·121 lines (113 loc) · 5.71 KB
/
default.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
<!DOCTYPE html>
<html>
<head>
<!--Basic Description Starts Here-->
<meta charset="utf-8"><!--Set charset in case occur garble-->
<meta http-equiv="x-ua-compatible" content="IE=edge" ><!--Set UA-->
<meta name="keywords" content="Sample Test Site"/><!--Set keywords-->
<meta name="description" content="A Sample Test Site for my Research Project, which is also the AP CSP Project I did in 2019"/><!--Set description-->
<meta name="viewport" content="width=device-width, initial-scale=1"><!--Set the page as mobile first-->
<title>Sample Test Site - Techzjc</title><!--Set title-->
<!--Basic Description Ends Here-->
<!--Stylesheet Reference Starts Here-->
<link rel="stylesheet" href="./css/bootstrap.min.css"><!--Import Bootstrap stylesheet, original link:https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css-->
<link rel="stylesheet" href="./css/w3.css"><!--Import W3Schools stylesheet, original link:https://www.w3schools.com/w3css/4/w3.css-->
<!--Stylesheet Reference Ends Here-->
<!--JS API Reference Starts Here-->
<script type="text/javascript" src="./js/jquery.min.js"></script><!--Import jquery library, original link:https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js-->
<script type="text/javascript" src="./js/popper.min.js"></script><!--Import Popper JS, original link:https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js-->
<script type="text/javascript" src="./js/bootstrap.min.js"></script><!--Import Bootstrap JS, original link:https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js-->
<!--JS API Reference Ends Here-->
<!--Personal Stylesheet and JS Starts Here-->
<link rel="stylesheet" href="./css/messagebox.css" /><!--Import stylesheet for the detailed style description which made by my own by using stylesheet and javascript API which shows above-->
<script src="./js/default.js"></script><!--Embed javascript-->
<!--Personal Stylesheet and JS Ends Here-->
</head>
<body>
<!--Title Bar Starts Here-->
<div id="title-bar" align="center">
<div class="container">
<div class="row">
<span id="webtitle" class="col w3-animate-top" align="center">Sample Test Site</span>
</div>
<div class="row">
<h5 id="welcomemsg" class="col w3-animate-top" align="center"></h5>
</div>
<div class="row">
<a id="btn-console" class="col" align="center"></a>
</div>
<div class="row">
<a id="islogin" class="col" align="center"></a>
</div>
</div>
</div>
<!--Title Bar Ends Here-->
<!--The UI part of the response part, the login part, starts here-->
<div id="myOverlay" class="overlay" style="display: none;">
<span class="closebtn" onclick="closelogin();" title="Close Overlay" style="color:#FFFFFF;">x</span>
<div class="overlay-content">
<div class="container">
<form class="popup" method="post" action="verify.php">
<div class="row" style="color:#FFFFFF;">
Username or Email:
</div>
<div class="row">
<input type="text" placeholder="Enter your username or email here" name="username" class="col-sm form-control" required>
</div>
<div class="row" style="color:#FFFFFF;">
Password:
</div>
<div class="row">
<input type="password" placeholder="Enter your password here" name="pwd" id="pwd" class="col-sm form-control" required>
</div>
<div class="row">
<input id="embed-submit" type="submit" value="login" class="col-sm btn btn-primary">
</div>
</form>
</div>
</div>
</div>
<!--The UI part of the response part, the login part, Ends here-->
<!--Info Starts Here-->
<div id="info-what-is-the-purpose-of-this-site">
<div class="container">
<div class="row">
<h1 class="col w3-animate-left">What is the Purpose of This Site?</h1>
</div>
<div class="row" align="center">
<div class="col-sm-2 border border-left-0 border-top-0 border-bottom-0 w3-animate-left">
</div>
<div class="col-sm-4 border border-right-0 border-top-0 border-bottom-0 w3-animate-right" align="left">
<h5>You could use this source code to deploy in your own server, using JMeter to Test your Server's Performance</h5>
</div>
<div class="col-sm-6"> </div>
</div>
</div>
</div>
<div id="info-what-are-included-in-this-site">
<div class="container">
<div class="row">
<h1 class="col w3-animate-left">What Are Included in This Site?</h1>
</div>
<div class="row">
<div class="col-sm-2 border border-left-0 border-top-0 border-bottom-0 w3-animate-left">
</div>
<div class="col-sm-4 border border-right-0 border-top-0 border-bottom-0 w3-animate-right">
<h5>This site includes two parts, one is this page's load, another is the login part(might need MySQL support). You can use JMeter to test the performance of loading the site if you want to test its static page performance, at the same time, test whether or not the site is correctly response the login requests. For detailed database deployment, see the source code's verify.php code.</h5>
</div>
<div class="col-sm-6"> </div>
</div>
</div>
</div>
<div id="footer" class="w3-animate-bottom">
<div class="container">
<div class="row">
<div class="col" align="center">Sample Test Site</div>
</div>
</div>
</div>
<!--Info Ends Here-->
</body>
</html>