-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathmturk.html
120 lines (97 loc) · 4.39 KB
/
mturk.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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Task Preview</title>
</head>
<body><div style="position:absolute; top:20px; bottom:20px; left:20px; right:20px; overflow:auto; border:1px solid black">
<!-- You must include this JavaScript file -->
<script src="https://assets.crowd.aws/crowd-html-elements.js"></script>
<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
<script src="https://s3.amazonaws.com/mturk-public/externalHIT_v1.js"></script>
<!-- For the full list of available Crowd HTML Elements and their input/output documentation,
please refer to https://docs.aws.amazon.com/sagemaker/latest/dg/sms-ui-template-reference.html -->
<!-- You must include crowd-form so that your task submits answers to MTurk -->
<div>
<crowd-form answer-format="flatten-objects" style="position:absolute;top:5px;left:20px;right:20px;bottom:10px">
<div id="taskbody">
<div id="instructions" style="margin-top:20px;margin-bottom:20px;padding:20px;border-radius:5px;background:#f2f2f2;box-shadow: 1px 1px 3px grey;">
<h2><span style="color: rgb(41, 105, 176);">Task Instructions</span></h2>
<hr>
In this task, you will be asked to ...
<p><b>1.</b> First, ... </p>
<p><b>2.</b> After that, ...</p>
<p><b>4.</b> Time limit of the entire task is ??? minutes.</p>
<p><i><u>IMPORTANT</u>: If you successfully submit the answers, you'll receive <b>??? USD</b>.</i></p>
</div>
<center>
<div id="start">
<div style="background:#003399;height:40px;width:200px;color:#fff;text-align:center;font-family:arial;font-size:16px;border-radius:5px;cursor:pointer;user-select:none;line-height:40px;vertical-align:middle;box-shadow: 1px 1px 3px grey;" onclick="start_btn()">START</div>
</div>
</center>
<div id="questions" style="display:none">
<center>
<div style="background:#f2f2f2;width:100%;height:600px">
<object id="label-ui" data="" height="100%" width="100%"></object>
</div>
<br/>
<div id="validate" onclick="validate()" style="background:#003399;height:40px;width:200px;color:#fff;text-align:center;font-family:arial;font-size:16px;border-radius:5px;cursor:pointer;user-select:none;line-height:40px;vertical-align:middle;box-shadow: 1px 1px 3px grey;">VALIDATE ANSWERS</div>
<br/>
</center>
</div>
</div>
<div id="submit" style="display:none">
<br/><br/>Your answers are valid.<br/><br/><crowd-button form-action="submit">Submit</crowd-button>
</div>
</crowd-form>
</div>
<script>
var workerId = turkGetParam('workerId', '');
console.log("workerId:"+workerId);
if ( workerId.length > 0 ) {
jQuery.ajax({
url: "https://xxx?uid="+workerId,
type: "GET",
crossDomain: true,
data: {},
dataType: "json",
success: function(response) {
if (response) {
document.getElementById("validate").style = "display:none";
document.getElementById("questions").innerHTML = "<br/><br/><b>You have already completed the maximum number of HITs allowed by this requester. Please click 'Return' to avoid any impact on your approval rating.</b>";
}
},
error: function(e) {}
});
}
var start_btn = function() {
document.getElementById("start").style = "display:none";
document.getElementById("questions").style = "display:block";
}
var validate = function() {
jQuery.ajax({
url: "https://xxx?uid="+workerId,
type: "GET",
crossDomain: true,
data: {},
dataType: "json",
success: function(response) {
console.log(response);
if (response) {
document.getElementById("submit").style = "display:block";
document.getElementById("validate").style = "display:none";
document.getElementById("taskbody").style = "display:none";
} else {
alert("You haven't finish your task.");
}
},
error: function(e) {
alert("Something wrong with your task.");
}
});
}
window.onload = function() {
document.getElementById("label-ui").data = "http://145.100.58.252:8080/icmr/task?uid="+workerId;
}
</script>
</div></body>