Used JQuery to generate one scenario
This commit is contained in:
parent
9c47280931
commit
566459b7b8
4 changed files with 61 additions and 26 deletions
|
@ -3,8 +3,10 @@
|
||||||
<head>
|
<head>
|
||||||
<meta charset="utf-8">
|
<meta charset="utf-8">
|
||||||
<title>Questions</title>
|
<title>Questions</title>
|
||||||
|
<script src="./resources/frameworks/jquery-3.2.1.min.js" type="text/javascript"></script>
|
||||||
<link rel="stylesheet" href="resources/questions/style.css">
|
<link rel="stylesheet" href="resources/questions/style.css">
|
||||||
<link rel="stylesheet" href="resources/global/style.css">
|
<link rel="stylesheet" href="resources/global/style.css">
|
||||||
|
<script type="text/javascript" src="resources/questions/scenarios.js"></script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<nav>
|
<nav>
|
||||||
|
@ -110,27 +112,7 @@
|
||||||
<input type="text" name="" placeholder="Enter response here">
|
<input type="text" name="" placeholder="Enter response here">
|
||||||
</li>
|
</li>
|
||||||
<br />
|
<br />
|
||||||
<li>
|
|
||||||
<p class="adult">
|
|
||||||
(question for those over the age of 18... or those mature enough)
|
|
||||||
</p>
|
|
||||||
One of your friends is upset. Someone has been harrassing them,
|
|
||||||
asking for innapropriate pictures, constantly private messaging
|
|
||||||
them about sexual topics without their consent.
|
|
||||||
(<em>THEIR NAME IS FUCKING GIO</em>)
|
|
||||||
Your friend is visibly uncomfortable, what would be your first
|
|
||||||
action?
|
|
||||||
<ul>
|
|
||||||
<li>Try to listen to both sides, see what the other person has to say</li>
|
|
||||||
<li>Go to the moderators, and report what happened.</li>
|
|
||||||
<li>Try to cheer up your friend, diverting their attention to something else</li>
|
|
||||||
<li>Listen to your friend, and reccommend some advice</li>
|
|
||||||
<li>Other...</li>
|
|
||||||
</ul>
|
|
||||||
If this situation is happening to you, what would you choose instead?
|
|
||||||
<br />
|
|
||||||
<input type="text" name="" placeholder="Enter response here">
|
|
||||||
</li>
|
|
||||||
</ul>
|
</ul>
|
||||||
<p>More scenarios to come...</p>
|
<p>More scenarios to come...</p>
|
||||||
<p>
|
<p>
|
||||||
|
|
50
resources/questions/scenarios.js
Normal file
50
resources/questions/scenarios.js
Normal file
|
@ -0,0 +1,50 @@
|
||||||
|
/*<li>
|
||||||
|
<p class="adult">
|
||||||
|
(question for those over the age of 18... or those mature enough)
|
||||||
|
</p>
|
||||||
|
One of your friends is upset. Someone has been harrassing them,
|
||||||
|
asking for innapropriate pictures, constantly private messaging
|
||||||
|
them without their consent.
|
||||||
|
(<em>THEIR NAME IS FUCKING GIO</em>)
|
||||||
|
Your friend is visibly uncomfortable, what would be your first
|
||||||
|
action?
|
||||||
|
<ul>
|
||||||
|
<li>Try to listen to both sides, see what the other person has to say</li>
|
||||||
|
<li>Go to the moderators, and report what happened.</li>
|
||||||
|
<li>Try to cheer up your friend, diverting their attention to something else</li>
|
||||||
|
<li>Listen to your friend, and reccommend some advice</li>
|
||||||
|
<li>Other...</li>
|
||||||
|
</ul>
|
||||||
|
If this situation is happening to you, what would you choose instead?
|
||||||
|
<br />
|
||||||
|
<input type="text" name="" placeholder="Enter response here">
|
||||||
|
</li>*/
|
||||||
|
|
||||||
|
window.onload = function(){
|
||||||
|
$adultText = $("<p class=\"adult\">(question for those over the age of 18... or those mature enough)</p>");
|
||||||
|
$description = $(
|
||||||
|
"<p>One of your friends is upset. Someone has been harrassing them, asking"
|
||||||
|
+ "for innapropriate photos, constantly private messaging them without consent"
|
||||||
|
+ "<br><span class=\"aside\">(THEIR NAME IS FUCKING GIO)</span><br>"
|
||||||
|
+ "Your friend is visibly uncomfortable, would would be your first action?</p>");
|
||||||
|
|
||||||
|
$options = $("<ul></ul>");
|
||||||
|
$options.append($("<li>Try to listen to both sides, see what the other person has to say</li>"));
|
||||||
|
$options.append($("<li>Go to the moderators, and report what happened.</li>"));
|
||||||
|
$options.append($("<li>Try to cheer up your friend, diverting their attention to something else</li>"));
|
||||||
|
$options.append($("<li>Listen to your friend, and reccommend some advice</li>"));
|
||||||
|
$options.append($("<li>Other...</li>"));
|
||||||
|
|
||||||
|
$question = $("<p>If this was happening to you, what would you choose instead?</p>")
|
||||||
|
|
||||||
|
$input = $("<input type=\"text\" placeholder=\"Enter response here\">");
|
||||||
|
|
||||||
|
$liElement = $("<li id=\"scenarios-harrassment\"></li>")
|
||||||
|
$liElement.append($adultText);
|
||||||
|
$liElement.append($description);
|
||||||
|
$liElement.append($options);
|
||||||
|
$liElement.append($input);
|
||||||
|
console.table($liElement);
|
||||||
|
|
||||||
|
$("#scenarios").append($liElement);
|
||||||
|
};
|
|
@ -36,11 +36,11 @@
|
||||||
"adult": false,
|
"adult": false,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"name": "Gio",
|
"name": "Harrassment",
|
||||||
"description":
|
"description":
|
||||||
"One of your friends is upset. Someone has been harrassing them,
|
"One of your friends is upset. Someone has been harrassing them,
|
||||||
asking for innapropriate pictures, constantly private messaging
|
asking for innapropriate pictures, constantly private messaging
|
||||||
them about sexual topics without their consent.
|
them without their consent.
|
||||||
<br/>
|
<br/>
|
||||||
Your friend is visibly uncomfortable, what would be your first
|
Your friend is visibly uncomfortable, what would be your first
|
||||||
action?",
|
action?",
|
||||||
|
|
|
@ -1,8 +1,11 @@
|
||||||
#scenarios li{
|
li, li p{
|
||||||
font-family: "Times New Roman";
|
font-family: "Times New Roman";
|
||||||
|
|
||||||
}
|
}
|
||||||
.adult{
|
.aside{
|
||||||
font-family: monospace;
|
color: rgb(250, 250, 250);
|
||||||
|
}
|
||||||
|
#scenarios li p.adult{
|
||||||
|
font-family: monospace ;
|
||||||
color: rgb(240, 0, 100);
|
color: rgb(240, 0, 100);
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue