HSSSSSE/index.html at main · SnackyOney/HSSSSSE · 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
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
<!DOCTYPE html>
<html lang="ru">

<head>
    <meta charset="utf-8">
    <title>Average HSSE day</title>
    <link href="css/style.css" rel="stylesheet">
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=El+Messiri&display=swap" rel="stylesheet">
    <link rel="icon" href="images/hsse-logo.png" type="image/x-icon">
    <link href="https://fonts.googleapis.com/css2?family=Pixelify+Sans&display=swap" rel="stylesheet">
    <meta name="viewport" content="width=device-width, minimum-scale=1.5, user-scalable=no">
</head>

<body>
    <div class="main-space">
    <div class="hsse-sign"></div>
    <header>
        <div class="cob-info">
            <img class="company-logo" src="./images/cob-logo.svg" alt="logo">
            <p class="company-name">Couple of bushes presents</p>
            <img class="company-logo" src="./images/cob-logo.svg" alt="logo">
        </div>
        <h1 class="game-name">Обычный день на <span class="rainbow-text">ВШПИ</span></h1>
    </header>
    <main>
        <ul class="menu">
            <li class="menu-item">
                <button class="play-button">Играть</button>
            </li>
            <li class="menu-item">
                <button class="rules-button">Правила</button>
            </li>
            <li class="menu-item">
                <button class="records-button">Рекорды</button>
            </li>
            <li class="menu-item">
                <button class="exit-button">Выход</button>
            </li>
        </ul>
    </main>
    <footer>
        <ul class="contacts">
            <p class="header-contacts">Контакты:</p>
            <li class="contact">
                <img class="tg-logo" src="./images/tg-logo.svg" alt="logo_tg">
                <p class="tg-p"><a href="https://t.me/snackyone">@snackyone</a></p>
            </li>
            <li class="contact">
                <img class="ds-logo" src="./images/ds-logo.svg" alt="logo_ds">
                <p class="ds-p">snackyone</p>
            </li>
        </ul>
        <h2 class="sign">Сделано Артёмом Уваровым из Б13-405 ВШПИ 2025 весна <span class="joke">По заказу ВШПИ ООО 2022-2025, couple of bushes® all rights reserved</span></h2>
    </footer>
    </div>

    <template class="rules-block-template">
        <div class="rules-block">
            <div class="rules">
                <h2>Правила</h2>
                <h2>Очень сильно рекомендуется играть в эту игру с зумом 150%! По-хорошему, он должен ставиться такой по умолчанию, но не всегда так происходит.</h2>
                <p>Вам предстоит прожить самый обычный день любого ВШПИшника, а именно пытаться выжить в куче разных дедлайнов и обстоятельств. Цель игры - уклоняться от препятствий и не умереть.</p>
                <h2>Как зарабатывать очки?</h2>
                <p>Очки даются за прожитое время (+1 очко в секунду) и за собранное ВШПИво (+5 очков) - единственный источник энергии студентов. <span class="joke">(напиток абсолютно безалгокольный, все права принадлежат Малееву А.С.)</span></p>
                <h2>Управления</h2>
                <p>wasd/стрелочки - двигаться, пробел - закрыть контест</p>
                <h2>Какие есть препятствия?</h2>
                <p>В течение игры на вас будет наваливаться всё больше и больше препятствий в следующем порядке:</p>
                <ol>
                    <li>Лектор по С++ будет кидаться в вас плюсами, пытаясь вас зафачить.</li>
                    <li>Иногда на экране будут появляться дедлайны по контесту по алгосам, которые вам нужно закрыть до того, как на них истечёт срок. При упущении дедлайна вас сразу отчисляют. <strong>Важно: чтобы закрыть контест надо нажать пробел именно на крестике.</strong> Открывается спустя 15 секунд.</li>
                    <li>Лектор по С++ так и не смог вас зафачить, хотя вы явно не знаете плюсы. Он начинает быстрее стрелять и ходить. Открывается спустя 30 секунд.</li>
                    <li>Ваша сдача плюсов разбудила охранника. Он начнёт патрулировать игровое поле, чтобы наказать вас.  Открывается спустя 50 секунд.</li>
                    <li>Оказывается, что Гусев (лектор по матану) попросил расставлять охранника матангус-ботов по всему кампусу. Эти боты читают минувшую лекцию на скорости х88, а потом взрыываются конспектами за эту лекцию. Открывается спустя 70 секунд.</li>
                </ol>
                <h2>Возможные баги:</h2>
                <ol>
                    <li>На некоторых компьютерах могут быть проблемы с нажатием пробела при закрыти контеста, но это довольно редкий случай.</li>
                </ol>
                <h2>Об игре</h2>
                <p>Игра была написана полностью с нуля, на основе учебников по js.</p>
            </div>
            <button class="back-rules-button">Назад</button>
        </div>
    </template>

    <template class="records-table-template">
        <div class="res-block">
            <ul class="records">
                <li class="record-line">
                    <span class="place">Место</span>
                    <span class="name">Имя</span>
                    <span class="result">Результат</span>
                </li>
            </ul>
            <button class="back-results-button">Назад</button>
        </div>
    </template>

    <template class="record-template">
        <li class="record-line">
            <span class="place"></span>
            <span class="name"></span>
            <span class="result"></span>
        </li>
    </template>

    <template class="menu-main-template">
        <main>
            <ul class="menu">
                <li class="menu-item">
                    <button class="play-button">Играть</button>
                </li>
                <li class="menu-item">
                    <button class="rules-button">Правила</button>
                </li>
                <li class="menu-item">
                    <button class="records-button">Рекорды</button>
                </li>
                <li class="menu-item">
                    <button class="exit-button">Выход</button>
                </li>
            </ul>
        </main>
    </template>

    <template class="menu-footer-template">
        <footer>
            <ul class="contacts">
                <p class="header-contacts">Контакты:</p>
                <li class="contact">
                    <img class="tg-logo" src="images/tg-logo.svg" alt="logo_tg">
                    <p class="tg-p"><a href="https://t.me/snackyone">@snackyone</a></p>
                </li>
                <li class="contact">
                    <img class="ds-logo" src="images/ds-logo.svg" alt="logo_ds">
                    <p class="ds-p">snackyone</p>
                </li>
            </ul>
            <h2 class="sign">Сделано Артёмом Уваровым из Б13-405 ВШПИ 2025 весна <span class="joke">По заказу ВШПИ ООО 2022-2025, couple of bushes® all rights reserved</span></h2>
        </footer>
    </template>

    <template class="game-canvas-template">
        <canvas class="game-canvas" width="1280" height="720">
        </canvas>
        <span class="current-score">Score</span>
    </template>

    <template class="game-over-screen-template">
        <div class="game-over-screen">
            <h1>Вы отчислены!</h1>
            <p>Введите имя отчисленного</p>
            <input>
            <div class="buttons">
                <button class="save-button">Сохранить</button>
                <button class="no-save-button">Не сохранять</button>
            </div>
        </div>
    </template>

    <template class="menu-header-and-background-template">
        <div class="hsse-sign"></div>
        <header>
            <div class="cob-info">
                <img class="company-logo" src="images/cob-logo.svg" alt="logo">
                <p class="company-name">Couple of bushes presents</p>
                <img class="company-logo" src="images/cob-logo.svg" alt="logo">
            </div>
            <h1 class="game-name">Обычный день на <span class="rainbow-text">ВШПИ</span></h1>
        </header>
    </template>

</body>
<script src="index.js" type="module"></script>
</html>