-
Notifications
You must be signed in to change notification settings - Fork 1
/
tutorial.html
60 lines (58 loc) · 2.79 KB
/
tutorial.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
<div class="row">
<div class="span12">
<div id="modal" class="modal hide fade">
<div class="modal-header">
<h3>Rural Geolocator tutorial</h3>
</div>
<div id="0" class="modal-body" style="display:none">
<p>This is an application to support geo-referencing of houses using the PyBossa framework on Crowdcrafting.org.
</p>
</div>
<div id="1" class="modal-body" style="display:none">
<p>The application loads a satellite image into the web map. You can use the zoom button to have a closer look,
and can click and hold the map to pan to different parts of the map segment. However, you will not
be able to scroll beyond the segment of the map you are presented with. </p>
<p>When you see a structure that looks like a house inside the orange box, click the black
<strong>Mark</strong> button to enter the marking mode. Click the middle of the structure to mark it.
You can move points you placed by entering the edit mode by clicking the <strong>Edit</strong>
button, or delete a mark after clicking <strong>Delete</strong>. You can only mark houses inside the
orange bounding box. If the bounding box runs through a house, mark it only if more than half
the area is inside the box. Keep clicking on the map until you have marked all houses, and then save the
markers by clicking on the <strong>Submit task</strong> button.</p>
<p>If there are no houses in the segment you're looking at, simply click the
<strong>Submit task</strong> button.</p>
</div>
<div class="modal-footer">
<a id="prevBtn" href="#" onclick="showStep('prev')" class="btn">Previous</a>
<a id="nextBtn" href="#" onclick="showStep('next')" class="btn btn-success">Next</a>
<a id="startContrib" href="../RuralGeolocator/newtask" class="btn btn-primary" style="display:none">
<i class="icon-thumbs-up"></i> Start geo-referencing!</a>
</div>
</div>
</div>
</div>
<script>
var step = -1;
function showStep(action) {
$("#" + step).hide();
if (action == 'next') {
step = step + 1;
}
if (action == 'prev') {
step = step - 1;
}
if (step == 0) {
$("#prevBtn").hide();
}
else {
$("#prevBtn").show();
}
if (step == 1 ) {
$("#nextBtn").hide();
$("#startContrib").show();
}
$("#" + step).show();
}
showStep('next');
$("#modal").modal('show');
</script>