-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathquiz.html
159 lines (155 loc) · 14.5 KB
/
quiz.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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Quiz</title>
<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="css/style.css" rel="stylesheet">
</head>
<body>
<div id="quiz-1" class="">
<form class="well center-block col-md-6">
<div class="form-group" id="questions-full">Oh no!</div>
<div class="btn btn-quiz btn-choose center-block btn-primary button-width" id="very-true" option-name="option1">Strongly agree</div>
<div class="btn btn-quiz btn-choose center-block btn-primary button-width" id="true" option-name="option2">Agree</div>
<div class="btn btn-quiz btn-choose center-block btn-primary button-width" id="neutral" option-name="option3">uncertain</div>
<div class="btn btn-quiz btn-choose center-block btn-primary button-width" id="false" option-name="option4">Disagree</div>
<div class="btn btn-quiz btn-choose center-block btn-primary button-width" id="very-false" option-name="option5">Strongly disagree</div>
<br>
<div class="questionOutOf" style="font-style: italic; font-weight: bold;">Progress 0/30
</div>
<div class="progress">
<div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 0%;">
<span class="sr-only">60% Complete</span>
</div>
</div>
<a class="btn btn-warning pull-left" id="btn-prev" href="index.html">Home</a>
<button type="button" class="btn btn-danger pull-right" id="btn-reset">Reset</button>
</form>
</div>
<div id="result" class="hidden">
<div class="well nope center-block col-md-6" style="float: none">
<h1>Your personality type is:</h1>
<div id="ESTJ" class="hidden">
<div class="char-desc">ESTJ: Robb Stark</div>
<div class="text-desc">
<img class="char-img" src="images/ESTJ.jpg"><br>
Keirsey says ESTJ’s “like to take charge of groups and are comfortable issuing orders. Rank, they believe, has its obligations, but it also has its privileges… Even as children they are industrious, and they usually respect their parents as authority figures… Their industry and perseverance only become more important to them as they grow into adulthood and take on the responsibilities of job and family.” Robb grows from a dutiful son into a confident, focused leader over the course of the season.
<div class="char-desc" id="result-image"></div>
</div>
</div>
<div id="ISTJ" class="hidden">
<div class="char-desc">ISTJ: Ned Stark</div>
<div class="text-desc">
<img class="char-img" src="images/ISTJ.jpg"><br>
According to Keirsey, ISTJ’s are “are extraordinarily persevering and dutiful… In their quiet way, Inspectors see to it that rules are followed, laws are respected, and standards are upheld… Their words tend to be plain and down-to-earth, not showy or high-flown.” Ned fits the mold of the “inspector” category to a tee, methodically seeking out concrete information about the plot against Robert, and holding strictly to his values. Keirsey’s description even says people of this type are often accused of “having ice in their veins” despite their good intentions.
<div class="char-desc" id="result-image"></div>
</div>
</div>
<div id="ESFJ" class="hidden">
<div class="char-desc">ESFJ: Cersei Lannister</div>
<div class="text-desc">
<img class="char-img" src="./images/ESFJ.jpg"><br>
This type supposedly “are the great nurturers of social institutions such as schools, churches, social clubs, and civic groups… friendly social service is a key to their nature.” Alright, nevermind. There is no one like that in Game of Thrones, so let’s just say that Cersei Lannister is what you get when you mix an ESFJ with a sociopath. She is comfortable in social situations (E), more direct than abstract in her thinking (S), driven by her love for her brother and children and hatred of others (F), and presents the image of a devoted matriarch (J). Too bad we can’t add a (B) for batshit crazy.
</div>
</div>
<div id="ISFJ" class="hidden">
<div class="char-desc">ISFJ: Catelyn Stark</div>
<div class="text-desc">
<img class="char-img" src="./images/ISFJ.jpg"><br>
Keirsey refers to ISFJ’s as “protectors”. “Their primary interest is in the safety and security of those they care about… [They] have an extraordinary sense of loyalty and responsibility in their makeup, and seem fulfilled in the degree they can shield others from the dirt and dangers of the world… Their reserve ought really to be seen as an expression of their sincerity and seriousness of purpose.” Catelyn is constantly concerned for her husband and children, trying to keep them safe despite the dangers coming from all directions.
</div>
</div>
<div id="ESTP" class="hidden">
<div class="char-desc">ESTP: Jaime Lannister</div>
<div class="text-desc">
<img class="char-img" src="./images/ESTP.jpg"><br>
Keirsey says that ESTP’s “…will take tremendous risks to get what they want, and seem exhilarated by walking close to the edge of disaster… these smooth operators are usually something of a mystery to others. While they live in the moment and lend excitement – and unpredictability – to all their relationships, they rarely let anyone get really close to them.” Jaime is impulsive (throwing Bran out the window) and fearless (taunting Catelyn to kill him). He is handsome and popular, but only one person knows him very well… you know who I mean. Late in the series, Jaime says “There are no men like me… only me.” Well Jaime, according to Keirsey’s stats, about 10% of the population is like you, although hopefully not when it comes to the incest and attempted murder.
</div>
</div>
<div id="ISTP" class="hidden">
<div class="char-desc">ISTP: Arya Stark</div>
<div class="text-desc">
<img class="char-img" src="./images/ISTP.jpg"><br>
ISTP’s “love action, and know instinctively that their activities are more enjoyable, and more effective, if done impulsively, spontaneously, subject to no schedules or standards but their own… they can be fiercely insubordinate to those in authority, seeing rules and regulations as unnecessarily confining… [they] want to be free to do their own thing, and they are proud of their ability to do it with an artist’s skill.” Arya certainly wants to learn to use Needle like an artist. She chafes at the strict female role thrust upon her, and wishes to chart her own way in the world, doing what she loves.
</div>
</div>
<div id="ESFP" class="hidden">
<div class="char-desc">ESFP: Tyrion Lannister</div>
<div class="text-desc">
<img class="char-img" src="./images/ESFP.jpg"><br>
This category of people is “exciting and full of fun, and their great social interest lies in stimulating those around them to take a break from work and worry, to lighten up and enjoy life… [they] are smooth, talkative, and witty; they always seem to know the latest jokes and stories, and are quick with wisecracks and wordplay–nothing is so serious or sacred that it can’t be made fun of. Performers also like to live in the fast lane…” I don’t know if Westeros has fast lanes (horse drawn carts can’t move very quickly), but the equivalent is probably all the wine and prostitutes Tyrion is fond of.
</div>
</div>
<div id="ISFP" class="hidden">
<div class="char-desc">ISFP: Daenerys Targaryen</div>
<div class="text-desc">
<img class="char-img" src="./images/ISFP.jpg"><br>
Keirsey’s description of this personality type largely centers on its tendency toward artisitic pursuits, but he also notes that they “are especially sensitive to the pain and suffering of others, and they sympathize freely with the sufferer.” Daenerys goes to personal risk to free mistreated slaves, and she suffers deeply when Khal Drogo does. She may not be “seized by the act of artistic composition, as if caught up in a whirlwind”, but she does seem to impulsively draw many actions from within herself, such as developing the ritual that hatches her dragon eggs.
</div>
</div>
<div id="ENFJ" class="hidden">
<div class="char-desc">ENFJ: Syrio Forel</div>
<div class="text-desc">
<img class="char-img" src="./images/ENFJ.jpg"><br>
This one’s easy, as it’s called “the teacher”. ENFJ’s “ability to fire the imagination can amount to a kind of genius which other types find hard to emulate… [they] will voice their passions with dramatic flourish… [they] like things settled and organized.” I have to say, I am totally uncoordinated, but if someone tossed me a sword, said “Next time you will catch it,” then spouted out awesome lines about saying “Not today” to the god of death… I bet I could learn to fight.
</div>
</div>
<div id="INFJ" class="hidden">
<div class="char-desc">INFJ Varys</div>
<div class="text-desc">
<img class="char-img" src="./images/INFJ.jpg"><br>
Keirsey calls INFJ “the counselor”. They “prefer to work intensely with those close to them, especially on a one-to-one basis, quietly exerting their influence behind the scenes. [They] value their integrity a great deal, but they have mysterious, intricately woven personalities which sometimes puzzle even them.” Remember Varys’s conversations with Ned in his cell? He managed to control Ned, to get him to admit his treason through a strong understanding of Ned’s motivations (the safety of his daughter), but he did it for what he considered to be his own sense of honor in valuing the peace of the realm.
</div>
</div>
<div id="ENFP" class="hidden">
<div class="char-desc">ENFP: Robert Baratheon</div>
<div class="text-desc">
<img class="char-img" src="./images/ENFP.jpg"><br>
Robert at the beginning of the show has certainly declined, but in his youth he exhibited the best qualities of an ENFP. He saw “life as an exciting drama, pregnant with possibilities for both good and evil” and was “vivacious and inspiring… Fiercely individualistic, [striving] toward a kind of personal authenticity, and this intention always to be [himself was] quite attractive to others.” He certainly inspired an army to rebel in his name, got the devoted loyalty of Ned and others, and commanded the infatuation of plenty of women, until drunkenness and debauchery got to him. So let that be a lesson to you ENFP’s.
</div>
</div>
<div id="INFP" class="hidden">
<div class="char-desc">INFP: Jon Snow</div>
<div class="text-desc">
<img class="char-img" src="./images/INFP.jpg"><br>
These individuals “have a profound sense of idealism that comes from a strong personal sense of right and wrong. They conceive of the world as an ethical, honorable place… Set off from the rest of humanity by their privacy and scarcity, Healers can often feel even more isolated in the purity of their idealism. [they] might well feel a sense of separation because of their often misunderstood childhood… [they] begin to believe they are bad to be so fanciful, so dreamy, and can come to see themselves as ugly ducklings.” Pushed to the side because of his bastard birth, Jon tries to retain his father’s honor, and sees the world in idealistic terms.
</div>
</div>
<div id="ENTJ" class="hidden">
<div class="char-desc">ENTJ: Tywin Lannister</div>
<div class="text-desc">
<img class="char-img" src="./images/ENTJ.jpg"><br>
According to Keirsey, ENTJ’s “are bound to lead others, and from an early age they can be observed taking command of groups… they have a strong natural urge to give structure and direction wherever they are–to harness people in the field and to direct them to achieve distant goals…more than any other type [they] desire (and generally have the ability) to visualize where the organization is going.” Tywin runs his family and his realm like an organization, trying to guide Jaime and later Tyrion toward his own ends. He takes the long view, hoping that if the Lannisters make the right choices they could “establish a dynasty that lasts a thousand years”.
</div>
</div>
<div id="INTJ" class="hidden">
<div class="char-desc">INTJ: Petyr Baelish</div>
<div class="text-desc">
<img class="char-img" src="./images/INTJ.jpg"><br>
Keirsey calls the INTJ “the mastermind”. They “are head and shoulders above all the rest in contingency planning… In their careers, Masterminds usually rise to positions of responsibility, for they work long and hard and are dedicated in their pursuit of goals… Masterminds do not feel bound by established rules and procedures, and traditional authority does not impress them.” Littlefinger, born into a humble family, planned and manipulated his way above so many of the highborn lords around him. He is a rational thinker, but with deeply held public and private ambitions (get power, get Catelyn, respectively).
</div>
</div>
<div id="INTP" class="hidden">
<div class="char-desc">INTP: Samwell Tarly</div>
<div class="text-desc">
<img class="char-img" src="./images/INTP.jpg"><br>
INTP’s “will learn in any manner and degree they can. They will listen to amateurs if their ideas are useful, and will ignore the experts if theirs are not… They are inclined to be shy except with close friends…” No one fit much else about this category, so… congratulations, INTP. You’re Sam.
</div>
</div>
<div id="ENTP" class="hidden">
<div class="char-desc">ENTP: Melisandre</div>
<div class="text-desc">
<img class="char-img" src="./images/ENTP.jpg"><br>
The ONE option I wish you couldn't get because I didn't finish a description for her, but generally ENTP folks are: Inventive, enthusiastic, strategic, enterprising, inquisitive, versatile. Enjoy new ideas and challenges, value inspiration.
</div>
</div>
<!-- Show Links to toggle other personalities -->
</div>
</div>
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/questions.js"></script>
<script src="js/script.js"></script>
</body>
</html>