index.html

﻿<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8"
          name="viewport"
          content="width=device-width, initial-scale=1.0" />
    <title>Раздолбаи</title>
    <script src="https://telegram.org/js/telegram-web-app.js"></script>
    <style>
        body {
            font-family: Arial, sans-serif;
            margin-top: 300px;
            padding: 20px;
            color: yellow;
            background-color: black;
            background-image: url(./img/title.png);
            background-repeat: no-repeat;
            background-position: center top;
            background-attachment: fixed;
            background-size: cover;
        }

        .button {
            background-color: var(--tg-theme-button-color);
            color: var(--tg-theme-button-text-color);
            border: none;
            padding: 10px 20px;
            margin: 10px 0;
            cursor: pointer;
        }
    </style>
</head>
<body>
    <header>
        <h2 id="header_hello"></h2>
    </header>
    <main>
        <section>
            <h2>Особенности</h2>
            <ul>
                <li>Персональная привязка работает ТОЛЬКО при запуске игры из меню бота (вот такие пока библиотеки)</li>
                <li>Пока нет учёта времени находжения в игре</li>
                <li>Пока нет мультиигрового процесса</li>
            </ul>
        </section>
        <section>
            <h2>Правила игры</h2>
            <ul>
                <li>Время - деньги, знания - сила, а Надежда умирает последней!</li>
            </ul>
            <h2>Понравилась игра?</h2>
            <button class="button" onclick="window.location.href='https://t.me/Hoplik_Bot?game=gouges'">Поделиться с друзьями!</button>
        </section>
    </main>
    <footer>
        <p>&copy; 2024 "The Gouges" Mini App</p>
    </footer>
    <script>
        let tg = window.Telegram.WebApp;
        tg.expand();
        // Получаем и декодируем пользователя
        let initDataUnsafe = tg.initDataUnsafe || {};
        // Проверяем авторизацию пользователя
        if (initDataUnsafe.user) {
            let hello_user = document.createElement('h2');
            let un = initDataUnsafe.user.first_name;
            hello_user.textContent = 'Привет тебе, ' + un;
            document.getElementById('header_hello').appendChild(hello_user);
        } else {
            let unknown_user = document.createElement('h1');
            unknown_user.textContent = 'Привет тебе, Незнакомец!';
            document.getElementById('header_hello').appendChild(unknown_user);
        }
        // Нижняя основная кнопка
        tg.MainButton.setText("Сыгранём!").show().onClick(function () {
            window.location.href = "game.html";
            tg.MainButton.hide();
            tg.BackButton.hide();
        });
        // Верхняя кнопка возврата
        tg.BackButton.show().onClick(function () {
            tg.close();
        });
    </script>
</body>
</html>