RepDist_WebTask/Coventry.html at master · sj483/RepDist_WebTask · GitHub

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
<!DOCTYPE html>
<html>

<head>
    <title>Sorry!</title>
    <link rel="stylesheet" href="./Assets/w3.css">
    <link rel="icon" href="./Assets/Logo.png" type="image/x-icon" />

    <style>
        body {
            margin-left: 50px;
            margin-top: 20px;
            margin-right: 50px;
        }
    </style>

    <!-- Get participant IDs passed in from URL -->
    <script src="./Assets/GetPpantIds.js"></script>

    <!-- Helper for posting JSON data -->
    <script src="./Assets/PostJson.js"></script>

    <script>
        async function GetState() {
            // Try the URL parameters first
            var UrlParams = new URLSearchParams(window.location.search);
            var State = UrlParams.has('State') ? UrlParams.get('State') : null;
            if (State != null) {
                return State;
            }

            // Query the server otherwise
            var Data = {
                SubjectId: SubjectId
            }
            try {
                var Result = await PostJson('./CoventryActions.php', Data);
                return Result.State;
            } catch (Err) {
                console.error('GetState failed:', Err);
                alert(
                    "An error has occurred.\n" +
                    "Please report error code #006 " +
                    "to Sophie (sj483@sussex.ac.uk)."
                );
                return null;
            }
        }

        async function GetReason() {
            // Get the State from the URL
            var State = await GetState();

            // Set and return the Reason
            var Reason;
            if (State === -2) {
                Reason = "<h1><b>Oops...</b></h1>" +
                    "<p>Sorry, it appears that you clicked away from the experiment for too long.</p>"
                "<p>This means that we will not be able to use your data &#128546;.</p>"
                "<p>Your participation has been discontinued.</p>";
            } else if (State === -1) {
                Reason = "<h1><b>Oops...</b></h1>"
                "<p>Sorry, it appears that you clicked away from the experiment too many times.</p>"
                "<p>This means that we will not be able to use your data &#128546;.</p>"
                "<p>Your participation has been discontinued.</p>";
            } else {
                Reason = "<p>Sorry, it appears that you were not giving us your full attention.</p>" +
                    "<p>This means that we will not be able to use your data &#128546;.</p>" +
                    "<p>Your participation has been discontinued.</p>";
            }
            return Reason;
        }

        function OnBodyLoad() {
            if (SubjectId) {
                GetReason().then(function(Reason) {
                    var iHTML = Reason;
                    document.getElementById('Message').innerHTML = iHTML;
                    document.getElementById('Message').style =
                        "max-width:700px;visibility:visible;";
                });
            } else {
                document.getElementById('Message').style =
                    "max-width:700px;visibility:visible;";
            }
        }
    </script>
</head>

<body onload="OnBodyLoad()">
    <div class="w3-container" style="max-width:700px;visibility:hidden" id="Message">
        <h1><b>Oops...</b></h1>
        <p>Sorry, it appears that you were not giving us your full attention.</p>
        <p>This means that we will not be able to use your data &#128546;.</p>
        <p>Your participation has been discontinued.</p>
    </div>
</body>

</html>