-
Notifications
You must be signed in to change notification settings - Fork 9
/
exp.html
101 lines (82 loc) · 4.44 KB
/
exp.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
<!DOCTYPE html>
<!--
The exp.html is the main form that
controls the experiment.
see comments throughout for advice
-->
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Psychology Experiment</title>
<meta charset="utf-8">
<link rel="Favicon" href="static/favicon.ico" />
<!-- get template variables (from psiturk) -->
<script type="text/javascript">
// These fields provided by the psiTurk Server
var uniqueId = "{{ uniqueId }}"; // a unique string identifying the worker/task
var condition = "{{ condition }}"; // the condition number
var counterbalance = "{{ counterbalance }}"; // a number indexing counterbalancing conditions
var adServerLoc = "{{ adServerLoc }}"; // the location of your ad (so you can send user back at end of experiment)
var mode = "{{ mode }}";
</script>
<!-- base psiturk requirements -->
<script src="static/lib/jquery-min.js" type="text/javascript"> </script>
<script src="static/lib/lodash-min.js" type="text/javascript"> </script>
<script src="static/lib/backbone-min.js" type="text/javascript"> </script>
<script src="static/lib/d3.v3.min.js" type="text/javascript"> </script>
<script src="static/js/psiturk.js" type="text/javascript"> </script>
<!-- Stylesheets -->
<link rel=stylesheet href="static/css/bootstrap.min.css" type="text/css">
<link rel=stylesheet href="static/css/style.css" type="text/css">
</head>
<body>
<!-- Error messages -->
<noscript>
<h1>Warning: Javascript seems to be disabled</h1>
<p>This website requires that Javascript be enabled on your browser.</p>
<p>Instructions for enabling Javascript in your browser can be found
<a href="http://support.google.com/bin/answer.py?hl=en&answer=23852">here</a><p>
</noscript>
<div id='display'>
<div id='welcome-message'>
<h1>Welcome</h1>
<p>Thanks for accepting our study!
<p>Please wait while we load the experiment.
<div id="load-icon"></div>
</div>
</div>
<div style="display:none;" id="success-load" class="animate-bottom">
<br><br><br><br><br>
<button id='load-btn' class="btn btn-primary btn-lg">Begin</button>
</div>
<!-- <div style="display:none;" class="alert alert-warning" id="slow-load">
<strong>Uhh....</strong>
The page is taking longer than usual to load. First try refreshing the page.
If it still doesn't work, there may be a problem with our server, or
you may not have a fast enough internet connection to participate
in this experiment. In either case, please return the HIT so that
someone else can participate. We appreciate it!
</div> -->
</body>
<!-- required utilities and boilerplate code -->
<script src="static/js/utils.js" type="text/javascript"> </script>
<script src="static/js/setup.js" , type="text/javascript"></script>
<!-- OPTIONAL: Core tools and supporting libraries -->
<script src="static/js/tools/component.js"></script>
<script src="static/js/tools/inputs.js"></script>
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
<script src="static/js/tools/alerts.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/showdown/2.1.0/showdown.min.js" type="text/javascript"></script>
<script src="static/js/tools/instructions.js"></script>
<!-- OPTIONAL: Extra tools that you should only load if you use them -->
<link href="https://unpkg.com/survey-jquery/defaultV2.min.css" type="text/css" rel="stylesheet">
<script src="https://unpkg.com/survey-jquery/survey.jquery.min.js"></script>
<script src="static/js/tools/survey.js", type="text/javascript"></script>
<script src="static/js/tools/quiz.js"></script>
<script src="static/js/tools/canvas.js"></script>
<script src="static/js/tools/status-bar.js"></script>
<!-- <script src="static/js/tools/gallery.js"></script> -->
<!-- Code specific this experiment/example -->
<script src="static/js/instructions.js" type="text/javascript"></script>
<script src="static/js/experiment.js", type="text/javascript"></script>
<script src="static/js/task.js", type="text/javascript"></script>
</html>