-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
executable file
·215 lines (179 loc) · 8.31 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
212
213
214
215
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Visualization Insights</title>
<!-- Bootstrap Core CSS -->
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
<!-- Custom CSS -->
<link href="css/custom.css" rel="stylesheet">
<!-- Custom Fonts -->
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" type="text/css">
<!-- Custom JavaScript -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="js/timeme.js"></script>
<!-- <script src="https://d3js.org/d3.v4.min.js"></script> -->
<script type="text/javascript">
function shuffle(array) {
var n = array.length, t, i;
while (n) {
i = Math.random() * n-- | 0;
t = array[n];
array[n] = array[i];
array[i] = t;
}
return array;
}
var charts = shuffle(["m", "f"]);
function uuidv4() {
return ([1e7]+-1e3+-4e3+-8e3+-1e11).replace(/[018]/g, c =>
(c ^ crypto.getRandomValues(new Uint8Array(1))[0] & 15 >> c / 4).toString(16)
)
}
function __gcd(a, b){
// Everything divides 0
if (a == 0 || b == 0) {
return 0;
}
// base case
if (a == b) {
return a;
}
// a is greater
if (a > b) {
return __gcd(a - b, b);
}
return __gcd(a, b - a);
}
// Function to check and print if
// two numbers are co-prime or not
function coprime(b = 36) {
a = Math.ceil(Math.random() * 99);
// if ( __gcd(a, b) == 1 && a != 1){
if ( __gcd(a, b) == 1 && a != 1 && a != 0){
return a;
}
else {
return coprime();
}
}
a = coprime();
n = 35;
b = [...Array(n).keys()].map( i => ++i ); //[1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
var trial_order = b.map( i => (i * a) % 36);
TimeMe.initialize({
currentPageName: "trial-0.0", // current page
idleTimeoutInSeconds: 120 // stop recording time due to inactivity
});
var urlParams = new URLSearchParams(window.location.search);
var prolific_PID = urlParams.get('PROLIFIC_PID');
// var study_ID = urlParams.get('STUDY_ID');
var session_ID = urlParams.get('SESSION_ID');
var t1 = urlParams.get('t');
// var vis = ["ci", "ci"];
var vis = urlParams.get('vis').split(","); // e.g. from prolific: &vis=ci
if(vis.length == 1){
vis = [vis, vis];
}
</script>
</head>
<body>
<div class = "row">
<div class="container">
<div class="col-sm-8 col-sm-offset-2">
<h1 class="margin-top-lg margin-btm-md">Visualization Insights study</h1>
<p>Thank you for choosing to participate!</p>
<p>
In this study, you will take on the role of a business manager, and make decisions based on sales data presented with graphs.
</p>
<p>
You will review 70 business scenarios (trials) in total. The trials are divided into two blocks with a break in between. Before you work on the actual trials, you will learn about the graphs and practice with your task.
You can also review the graphs and your task again before each block. Please read these instructions carefully as your task changes for each block.
</p>
<p>
The study will take about 35 mins. You can quit at any point, but beware that you cannot resume once this window is closed, and nor will you be compensated. After you have finished all the trials, you will be redirected back to <strong>Prolific</strong>.
<!-- If you want to quit, please click on the exit button that will appear on each trial page. <span class="highlight2">Note:</span> we do not save your progress, so please do not close this tab once you begin the study! -->
</p>
<p></p>
<!-- <p>This study is IRB exempt: Uncertainty visualization techniques for encouraging more robust data exploration behavior in visual analytics (HUM00158894). If you have any questions regarding the study, kindly contact Xiaoying: xpu@umich.edu</p> -->
<!--
<p>Please read about the study
<span style="font-size: 1.5em">
<a href="consent.html" target="popup">HERE</a>
</span>
. -->
<div class="btn-container">
<p><a data-toggle="collapse" href="#collapseExample" role="button" aria-expanded="false" aria-controls="collapseExample" style="font-size: 1.35em">
Click here to read the Information Sheet for this study
</a></p>
</div>
<div class="collapse" id="collapseExample" >
<!-- <div class="card card-body">
Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident.
</div> -->
<!-- <h1 class="margin-top-lg margin-btm-md">Information Sheet</h1> -->
<h4>Study Title: Uncertainty visualization techniques for encouraging more robust data exploration behavior in visual analytics</h4>
<p>HUM00158894</p>
<!-- <h3 class="margin-top-sm">Project Details</h3> -->
<p>
Principal Investigator: Matthew Kay (University of Michigan)<br>
Co-investigator: Xiaoying Pu (University of Michigan)
</p>
<p>
You are invited to participate in a research study about data exploration and decision making using visualizations.
If you agree to be part of the research study, you will be presented with data visualizations and asked to make decisions using the information presented.
</p>
<ul>
<li><i>Benefits of the research:</i> There are no direct benefits to you, the participant, other than compensation</li>
<li><i>Risks and discomforts:</i> We don't anticipate any risks from participation in this study greater than normal activity</li>
<li><i>Compensation:</i> $4.67, with bonus up to $1.</li>
</ul>
<p>
Participating in this study is completely voluntary. Even if you decide to participate now, you may change your mind. You may withdraw from the study at any time. If you do withdraw prior to the end of the study, you will receive no compensation, and your responses will be deleted. You may choose not to answer any survey question for any reason.
Information collected in this project may be shared with other researchers, but we will not share any information that could identify you.
</p>
<p>
If you have questions about this research study, please contact Xiaoying (xpu@umich.edu) or Matthew (mjskay@umich.edu).
</p>
<p>The University of Michigan Institutional Review Board (IRB) Health Sciences and Behavioral Sciences has determined that this study is exempt from IRB oversight.</p>
</div>
<hr>
<p><b >By clicking on "Proceed"</b> below, you indicate that you have understood the Information Sheet and agree to participate in this study.</p>
</div>
</div>
</div>
<div class = "row">
<div class="container">
<div class="btn-container">
<div class="btn" id="decline-btn">Decline</div>
<div class="btn" id="begin-btn">Proceed</div>
</div>
</div>
</div>
</body>
<script type="text/javascript">
var uuid = uuidv4();
$("div#begin-btn").on('click', initialiseUser);
$("div#decline-btn").on('click', rejectUser);
function rejectUser() {
window.location.href = 'quit.html';
}
// send response to DB
function initialiseUser() {
// uses global value for 'selected'
// Time spent on page
var t = Math.round(TimeMe.getTimeOnCurrentPageInSeconds() * 1000) / 1000 + t1;
var queryURL = 'https://w8vewq61bf.execute-api.us-east-2.amazonaws.com/prod/user_records?user=new&PROLIFIC_PID='+prolific_PID+'&SESSION_ID='+session_ID+'&modulo='+a+'&uuid='+uuid+'';
$.get(queryURL).done(function (data) {
window.location.href = 'test-1.html?PROLIFIC_PID='+prolific_PID+'&SESSION_ID='+session_ID+'&modulo='+a+'&vis='+vis+'&ch='+charts+'';
});
// var submit_response_url = 'https://w3drv4o3cl.execute-api.us-east-2.amazonaws.com/prod/interaction_logger?type=response&PROLIFIC_PID='+prolific_PID+'&SESSION_ID='+session_ID+'&responses=null&vis=null&alpha=null&trial=0.1&t='+t+'';
// $.get(submit_response_url).done(function (data) {
// window.location.href = 'test-1.html?PROLIFIC_PID='+prolific_PID+'&SESSION_ID='+session_ID+'&modulo='+a+'&vis='+vis+'&alpha='+alpha+'';
// });
}
</script>
</html>