PracticeTurkishBotQuiz/index.html at main · FadeevEgor/PracticeTurkishBotQuiz · 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
<!DOCTYPE html>
<html>
<meta charset="UTF-8">
<title>Quiz</title>

</html>

<head>
    <script src="https://telegram.org/js/telegram-web-app.js"></script>
    <script src="https://colorjs.io/dist/color.global.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/underscore@1.13.6/underscore-umd-min.js"></script>
    <script src="./3rdparty/progress.js"></script>

    <link rel="stylesheet" href="styles.css">
    <link rel="stylesheet" href="./3rdparty/bootstrap-icons.css">
    <link rel="stylesheet" href="./3rdparty/spinner.css">
    <link rel="stylesheet" href="./3rdparty/progressjs.css">

</head>

<body>
    <button id="explicit_main_button" type="button"></button>

    <div id="page_loading" style="display: block;">
        <div class="sk-cube-grid">
            <div class="sk-cube sk-cube1"></div>
            <div class="sk-cube sk-cube2"></div>
            <div class="sk-cube sk-cube3"></div>
            <div class="sk-cube sk-cube4"></div>
            <div class="sk-cube sk-cube5"></div>
            <div class="sk-cube sk-cube6"></div>
            <div class="sk-cube sk-cube7"></div>
            <div class="sk-cube sk-cube8"></div>
            <div class="sk-cube sk-cube9"></div>
        </div>
    </div>
    <div id="page_preview" style="display: none;">
        <div id="preview_header">
            <div>Dictionary</div>
            <div>
                <button id="shuffle_button" type="button">
                    <i class="bi bi-shuffle"></i>
                </button>
                <button id="mirror_button" type="button">
                    <i class="bi bi-symmetry-vertical"></i>
                </button>
            </div>
        </div>
        <table id="table_preview">
            <tbody></tbody>
        </table>
    </div>
    <div id="page_game" style="display: none;">
        <div id="question" class="question"></div>
        <div id="buttons" class="buttons">
            <button id="button_A" class="answer_button" type="button"></button>
            <button id="button_B" class="answer_button" type="button"></button>
            <button id="button_C" class="answer_button" type="button"></button>
            <button id="button_D" class="answer_button" type="button"></button>
        </div>
    </div>
    <div id="page_results" style="display: none;">
        <div id="header_results">
            <div id="title_results" style="text-align: center; font-size: 32px;">Results</div>
            <div style=" display: block;">
                <div class="header_results_left">Correct:</div>
                <div id="stats_correct"></div>
            </div>
            <br>
            <div style="display: block;">
                <div class="header_results_left">Mistakes:</div>
                <div id="stats_mistakes"></div>
            </div>
        </div>
        <table id="table_results">
            <caption>Per question</caption>
            <tbody></tbody>
        </table>
    </div>

    <script src="./src/init.js"></script>
    <script src="./src/colors.js"></script>
    <script src="./src/elements.js"></script>
    <script src="./src/dictionary.js"></script>
    <script src="./src/gamestate.js"></script>
    <script src="./src/logic.js"></script>
    <script src="./src/app.js"></script>
</body>