timbre-study/consent_form.html at master · nerrull/timbre-study · 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
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
<!DOCTYPE html>
<html>

<head>
    <script src="javascript/jquery-3.1.1.min.js"></script>
    <script src="survey-jquery/survey.jquery.js"></script>
    <script src="/assets/javascripts/jatos.js"></script>
    <link rel="stylesheet" href="bootstrap-3.3.7/css/bootstrap.min.css">
    <link href="static/css/forms.css" rel="stylesheet" type="text/css" media="all">
</head>

<body>
    <div >
    <div class=TitleBox id = titleBox></div>

    <div class=FormBox>
    <div id="consent_start"></div>
    <div id="consent_form"></div>
    </div>
    </div>

    <script>
        jatos.onLoad(function () {
            var lang = "default";
            if (jatos.studySessionData.language){
                lang = jatos.studySessionData.language
            }

            Survey.Survey.cssType = "bootstrap";
            Survey.defaultBootstrapCss.navigationButton = "btn btn-green";

            $.ajax({
            url:"static/html/consent.html",
            type:'GET',
            success: function(data) {
                var content = $('<div>').append(data).find(`#${lang}`).find('#consent_form_start');
                $('#consent_start').html( content );

                var end_content = $('<div>').append(data).find(`#${lang}`).find('#consent_form_end').html();

                $('#titleBox').html($('<div>').append(data).find(`#${lang}`).find('#title'));

                console.log(end_content)
                window.survey = new Survey.Model({
                    pages: [
                    {
                    name: "page1",
                    elements: [
                        {
                        type: "boolean",
                        name: "Let me know when the tool is available ",
                        title: {
                        fr: "Avisez-moi lorsque l’outil sera public"
                        },
                        defaultValue: "false",
                        label: {
                        default: "Let me know when the tool is available ",
                        fr: "Avisez-moi lorsque l’outil sera public"
                        }
                        },
                        {
                        type: "boolean",
                        name: "Contact me about follow-up studies",
                        title: {
                        fr: "Avisez-moi d’études ultérieures "
                        },
                        defaultValue: "false",
                        label: {
                        default: "Contact me about follow-up studies",
                        fr: "Avisez-moi d’études ultérieures "
                        }
                        },
                        {
                        type: "text",
                        name: "email",
                        isRequired: true,
                        visibleIf: "{Contact me about follow-up studies} = true or {Let me know when the tool is available } = true",
                        title: {
                        default: "E-mail address",
                        fr: "Votre courriel "
                        },
                        validators: [
                        {
                        type: "email"
                        }
                        ],
                        inputType: "email"
                        },
                        {
                        type: "html",
                        name: "end_content",
                        html: end_content
                        }
                    ]
                    }
                    ],
                    showQuestionNumbers: "off",
                    completeText: {
                    default: "I Accept",
                    fr: "J'accepte"
                    },
                    maxTimeToFinish: -1
                    });


                survey.locale = lang;
                survey.onComplete.add(function (result) {
                    $("#consent_form").hide(); // Hides the 'Thank you for completing ...' message
                    jatos.submitResultData(JSON.stringify(result.data), jatos.startNextComponent);
                });

                $("#consent_form").Survey({
                    model: survey
                });
                }
            });
        });
    </script>
</body>

</html>