-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
121 lines (77 loc) · 4.1 KB
/
index.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
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>Personality Analysis</title>
<script type='text/javascript' src='/js/lib/dummy.js'></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">
<!-- Optional theme -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap-theme.min.css">
<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
<link rel="stylesheet" type="text/css" href="/css/result-light.css">
<style type='text/css'>
</style>
<script type='text/javascript'>
function shuffle(o){
for(var j, x, i = o.length; i; j = Math.floor(Math.random() * i), x = o[--i], o[i] = o[j], o[j] = x);
return o;
};
function rate(rating){
var rate = document.getElementById("rate");
rate.hidden = true;
console.log("pressed " + rating);
//TODO Join to a database
};
function show_analysis(){
//TODO check if username is entered
var fform = document.getElementById("fake_form");
var analysis = document.getElementById("analysis");
var uname = document.getElementById("uname").value;
fform.hidden = true;
var s = "You have a great need for other people to like and admire you. You have a tendency to be critical of yourself. You have a great deal of unused capacity which you have not turned to your advantage. While you have some personality weaknesses, you are generally able to compensate for them. Disciplined and self-controlled outside, you tend to be worrisome and insecure inside. At times you have serious doubts as to whether you have made the right decision or done the right thing. You prefer a certain amount of change and variety and become dissatisfied when hemmed in by restrictions and limitations. You pride yourself as an independent thinker and do not accept others’ statements without satisfactory proof. You have found it unwise to be too frank in revealing yourself to others. At times you are extroverted, affable, sociable, while at other times you are introverted, wary, reserved. Some of your aspirations tend to be pretty unrealistic. Security is one of your major goals in life";
sentence = s.split('. ');
final_sentence = shuffle(sentence).join('. ');
analysis.innerHTML = analysis.innerHTML.replace("%USR%",uname).replace("%SENTENCE%", final_sentence);
analysis.hidden = false;
}
</script>
</head>
<body>
<div id = "fake_form" class="container">
<h1>Login</h1>
<div class="form-group">
<label>Name</label>
<input id ="uname" class="form-control" placeholder="Enter your Name" >
</div>
<div class="form-group">
<label>Email Address</label>
<input class="form-control" placeholder="Enter your email address">
</div>
<button id="submit_btn" type="submit" class="btn btn-default" onclick="show_analysis()">Submit</input>
</div>
<div class = container>
<br>
<div id = "analysis" hidden = "true" class="panel panel-primary">
<div class="panel-heading">
<h3 class = "lead panel-title">%USR%'s Personality Analysis Result</h3>
</div>
<div class ="panel-body">
<p id = "analysis_text" class="">%SENTENCE%</p>
</div>
<div id = "rate" class = "panel-footer" >
How accurate is this Personality Analysis According to you?
<div class="btn-group" role="group" aria-label="...">
<button type="button" class="btn btn-default" onclick="rate(1)">1</button>
<button type="button" class="btn btn-default" onclick="rate(2)">2</button>
<button type="button" class="btn btn-default" onclick="rate(3)">3</button>
<button type="button" class="btn btn-default" onclick="rate(4)">4</button>
<button type="button" class="btn btn-default" onclick="rate(5)">5</button>
</div>
</div>
</div>
</div>
</body>
</html>