forked from m-hahn/experiment_template
-
Notifications
You must be signed in to change notification settings - Fork 16
/
Copy pathindex.html
211 lines (180 loc) · 8.57 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
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
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
<html>
<head>
<title>Title of This Experiment</title>
<!--JS-->
<!-- external general utilities -->
<script src="resources/shared/js/jquery-1.11.1.min.js"></script>
<script src="resources/shared/full-projects/jquery-ui/jquery-ui.min.js"></script>
<script src="resources/shared/js/underscore-min.js"></script>
<!-- if you want to draw stuff: -->
<!-- <script src="resources/shared/js/raphael-min.js"></script> -->
<!-- cocolab experiment logic -->
<script src="resources/shared/js/exp-V2.js"></script>
<script src="resources/shared/js/stream-V2.js"></script>
<!-- cocolab general utilities -->
<script src="resources/shared/js/mmturkey.js "></script>
<script src="resources/shared/js/browserCheck.js"></script>
<script src="resources/shared/js/utils.js"></script>
<!-- if you want to draw cute creatures (depends on raphael): -->
<!-- <script src="resources/shared/js/ecosystem.js"></script> -->
<!-- experiment specific helper functions -->
<!-- <script src="resources/js/local-utils.js"></script> -->
<!--CSS-->
<link href="resources/shared/full-projects/jquery-ui/jquery-ui.min.css" rel="stylesheet" type="text/css"/>
<link href="resources/shared/css/cocolab-style.css" rel="stylesheet" type="text/css"/>
<link href="resources/css/local-style.css" rel="stylesheet" type="text/css"/>
<!-- experiment file -->
<script src="resources/index.js"></script>
<!-- Load consent form
<script>
$(function(){
$("#consent-form").load("./resources/html/consent.html");
});
</script>
-->
</head>
<body onload="init();">
<noscript>This task requires JavaScript.</noscript>
<div class="slide" id="i0" >
<p id="cocolab">Stanford Linguistics</p>
<p id="instruct-text">You will see some stuff and be asked some questions. The HIT should take ~2 minutes. Please pay attention, thanks!</p>
<button id="start_button" type="button">Start Experiment</button>
</div>
<!--Consent form used in Stanford linguistics department and is good for ling245.
Otherwise, modified to whatever is required for you given your affliation.
-->
<div class="slide" id="consent">
<div id="consent_1">
<p>We invite you to participate in a research study on language production and comprehension.
Your experimenter will ask you to do a linguistic task such as reading sentences or words,
naming pictures or describing scenes, making up sentences of your own, or participating in a
simple language game. </p>
<p>There are no risks or benefits of any kind involved in this study. </p>
<p>You will be paid for your participation at the posted rate. </p>
<p>If you have read this form and have decided to participate in this experiment, please
understand your participation is voluntary and you have the right to withdraw your consent or
discontinue participation at any time without penalty or loss of benefits to which you are
otherwise entitled. You have the right to refuse to do particular tasks. Your individual privacy
will be maintained in all published and written data resulting from the study. You may print
this form for your records.</p>
</div>
<div id="consent_2">
<p>CONTACT INFORMATION: </p>
<p>If you have any questions, concerns or complaints about this research study, its procedures,
risks and benefits, you should contact the Protocol Director Penelope Eckert
(650)-725-1564 </p>
<p>If you are not satisfied with how this study is being conducted, or if you have any concerns,
complaints, or general questions about the research or your rights as a participant, please
contact the Stanford Institutional Review Board (IRB) to speak to someone independent of the
research team at (650)-723-2480 or toll free at 1-866-680-2906. You can also write to the
Stanford IRB, Stanford University,
3000 El Camino Real, Five Palo Alto Square, 4th Floor,
Palo Alto, CA 94306 USA.</p>
<p>You may print this contact information for your records.</p>
<p>If you agree to participate, please proceed to the study tasks.</p>
</div>
<button onclick="_s.button()">Continue</button>
</div>
<div class="slide" id="instructions">
<h3>Instructions</h3>
<p>Here are some instructions.</p>
<button onclick="_s.button()">Continue</button>
</div>
<div class="slide" id="single_trial">
<p>Here is a single trial. Depending on the condition, you'll see different words below:</p>
<p class="display_condition">{{}}</p>
<input type="text" id="text_response"></input>
<button onclick="_s.button()">Continue</button>
<p class="err">Please write something.</p>
</div>
<div class="slide" id="one_slider">
<p>Here is one slider. For every trial in this block, you get an input to the 'present_handle' function. You can use that variable to display different prompts:</p>
<p class="prompt"></p>
<table id="slider_table" class="slider_table">
<tr><td class="left">completely disagree</td><td class="right">completely agree</td></tr>
<tr><td colspan="2"><div id="single_slider" class="slider"></div></td></tr>
</table>
<button onclick="_s.button()">Continue</button>
<div class="err">Please adjust the slider before continuing.</div>
</div>
<div class="slide" id="multi_slider">
<p>Here are a bunch of sliders.</p>
<p>How likely do you think it is that someone would say each of the following?</p>
<table id="multi_slider_table" class="slider_table">
<tr><td></td><td class="left">very unlikely</td><td class="right">very likely</td></tr>
</table>
<button onclick="_s.button()">Continue</button>
<div class="err">Please adjust all the sliders before continuing.</div>
</div>
<div class="slide" id="vertical_sliders">
<p>Here are a bunch of vertical sliders.</p>
<p id="vertical_question">{{}}</p>
<table id="vertical_slider_table" class="slider_table">
<tbody>
<tr id="sliders">
</tr>
<tr id="bin_labels">
</tr>
</tbody>
</table>
<button onclick="_s.button()">Continue</button>
<div class="err">Please adjust all the sliders before continuing.</div>
</div>
<div class="slide" id="subj_info">
<div class="long_form">
<div class="subj_info_title">Additional information</div>
<p class="info">Answering these questions is optional, but will help us understand your answers.</p>
<p>Did you read the instructions and do you think you did the HIT correctly?</p>
<label><input type="radio" name="assess" value="No"/>No</label>
<label><input type="radio" name="assess" value="Yes"/>Yes</label>
<label><input type="radio" name="assess" value="Confused"/>I was confused</label>
<p>Were there any problems or bugs in the experiment?</p>
<textarea id="problems" rows="2" cols="50"></textarea>
<p>What do you think is a fair price for the work you did?</p>
<textarea id="fairprice" rows="1" cols="10"></textarea>
<p>Gender:
<select id="gender">
<label><option value=""/></label>
<label><option value="Male"/>Male</label>
<label><option value="Female"/>Female</label>
<label><option value="Other"/>Other</label>
</select>
</p>
<p>Age: <input type="text" id="age"/></p>
<p>Level Of Education:
<select id="education">
<label><option value="-1"/></label>
<label><option value="0"/>Some High School</label>
<label><option value="1"/>Graduated High School</label>
<label><option value="2"/>Some College</label>
<label><option value="3"/>Graduated College</label>
<label><option value="4"/>Hold a higher degree</label>
</select>
</p>
<p>Native Language: <input type="text" id="language"/></p>
<label>(the language(s) spoken at home when you were a child)</label>
<p>Did you enjoy the hit?</p>
<select id="enjoyment">
<label><option value="-1"></option></label>
<label><option value="0">Worse than the Average HIT</option></label>
<label><option value="1" >An Average HIT</option></label>
<label><option value="2">Better than average HIT</option></label>
</select>
<p>We would be interested in any comments you have about this experiment. Please type them here:</p>
<textarea id="comments" rows="3" cols="50"></textarea>
<br/>
<button onclick="_s.submit()">Submit</button>
</div>
</div>
<div id="thanks" class="slide js" >
<p class="big">Thanks for your Time!</p>
</div>
<div class="progress">
<span>Progress:</span>
<div class="bar-wrapper">
<div class="bar" width="0%">
</div>
</div>
</div>
</body>
</html>