khantribute/view-feedback.html at master · suhajdab/khantribute · 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
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" integrity="sha384-WskhaSGFgHYWDcbwN70/dfYBj47jz9qbsMId/iRN3ewGhXQFZCSftd1LZCfmhktB" crossorigin="anonymous">
    <title>View Feedback</title>
</head>
<body>
    <div class="container">
        <div class="row">
            <h2>Feedback on the app</h2>
        </div>
        <div id="feedback">

        </div>
    </div>

    <script src="https://www.gstatic.com/firebasejs/5.3.1/firebase.js"></script>
    <script>
        // Initialize Firebase
        var config = {
            apiKey: "AIzaSyA5-TIbo4jcIm3mYElikacv0z8vi9qxSmY",
            authDomain: "khantribute-feedback.firebaseapp.com",
            databaseURL: "https://khantribute-feedback.firebaseio.com",
            projectId: "khantribute-feedback",
            storageBucket: "khantribute-feedback.appspot.com",
            messagingSenderId: "878645555322"
        };
        firebase.initializeApp(config);
    </script>
    <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha256-3edrmyuQ0w65f8gfBsqowzjJe2iM6n0nKciPUp8y+7E=" crossorigin="anonymous"></script>
    <script>
        var db = firebase.database();
        var feedback = db.ref("feedback");

        feedback.once("value", function(snapshot) {
            snapshot.forEach(function(childSnapshot) {
                var data = childSnapshot.val();

                $("#feedback").append(
                    $("<div class='row'>")
                        .append(
                            $("<div class='col'>")
                                .append(
                                    $("<table class='table table-striped'>")
                                        .append(
                                            $("<thead>")
                                                .append(
                                                    $("<tr>")
                                                        .append($("<th scope='col'>").text("Question"))
                                                        .append($("<th scope='col'>").text("Response"))
                                                )
                                        )
                                        .append(
                                            $("<tbody>")
                                                .append(
                                                    $("<tr>")
                                                        .append($("<td>").text("How easy was the app to use?"))
                                                        .append($("<td>").text(data.ease_of_use))
                                                )
                                                .append(
                                                    $("<tr>")
                                                        .append($("<td>").text("How smooth was the experience of using the app?"))
                                                        .append($("<td>").text(data.user_experience))
                                                )
                                                .append(
                                                    $("<tr>")
                                                        .append($("<td>").text("While using Khantribute, did you feel you were contributing to translations? Was it rewarding for you?"))
                                                        .append($("<td>").text(data.reward))
                                                )
                                                .append(
                                                    $("<tr>")
                                                        .append($("<td>").text("When are you most likely to use Khantribute again?"))
                                                        .append($("<td>").text(data.repeat_likelihood))
                                                )
                                                .append(
                                                    $("<tr>")
                                                        .append($("<td>").text("What features or changes do you think Khantribute needs?"))
                                                        .append($("<td>").text(data.suggestion))
                                                )
                                                .append(
                                                    $("<tr>")
                                                        .append($("<td>").text("How likely are you to recommend Khantribute to a friend or colleague? (1=Not at all likely, 10=Very likely)"))
                                                        .append($("<td>").text(data.recommend_likelihood))
                                                )
                                                .append(
                                                    $("<tr>")
                                                        .append($("<td>").text("Please use this space to share any additional comments you have about the app"))
                                                        .append($("<td>").text(data.additional_comments))
                                                )
                                        )
                                )
                        )
                );
            });
        });
    </script>
</body>
</html>