Skip to content

Commit 2b2f523

Browse files
whattfkkwhattfkk
authored
Create index.html
0 parents  commit 2b2f523

File tree

1 file changed

+167
-0
lines changed

1 file changed

+167
-0
lines changed

‎index.html‎

Lines changed: 167 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,167 @@
1+
<!DOCTYPE html>
2+
<html lang="ru">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6+
<title>Emoji Status Permission</title>
7+
<script src="https://telegram.org/js/telegram-web-app.js"></script>
8+
<style>
9+
body {
10+
margin: 0;
11+
padding: 20px;
12+
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
13+
background: var(--tg-theme-bg-color, #ffffff);
14+
color: var(--tg-theme-text-color, #000000);
15+
text-align: center;
16+
}
17+
18+
.container {
19+
max-width: 400px;
20+
margin: 0 auto;
21+
padding: 20px;
22+
}
23+
24+
.button {
25+
background: var(--tg-theme-button-color, #0088cc);
26+
color: var(--tg-theme-button-text-color, #ffffff);
27+
border: none;
28+
border-radius: 8px;
29+
padding: 12px 24px;
30+
font-size: 16px;
31+
cursor: pointer;
32+
margin: 10px;
33+
width: 100%;
34+
max-width: 300px;
35+
}
36+
37+
.button:hover {
38+
opacity: 0.8;
39+
}
40+
41+
.button:disabled {
42+
opacity: 0.5;
43+
cursor: not-allowed;
44+
}
45+
46+
.status {
47+
margin-top: 20px;
48+
padding: 10px;
49+
border-radius: 8px;
50+
background: var(--tg-theme-secondary-bg-color, #f8f8f8);
51+
}
52+
53+
.error {
54+
color: #ff3333;
55+
}
56+
57+
.success {
58+
color: #00aa00;
59+
}
60+
</style>
61+
</head>
62+
<body>
63+
<div class="container">
64+
<h2>🎭 Управление Emoji Статусом</h2>
65+
<p>Разрешите боту управлять вашим emoji статусом для автоматической установки эмодзи в зависимости от игровых достижений и других событий.</p>
66+
67+
<button id="requestPermission" class="button">
68+
Разрешить управление статусом
69+
</button>
70+
71+
<div id="status" class="status" style="display: none;"></div>
72+
</div>
73+
74+
<script>
75+
// Инициализация Telegram WebApp
76+
const tg = window.Telegram.WebApp;
77+
tg.ready();
78+
tg.expand();
79+
80+
// Элементы интерфейса
81+
const requestButton = document.getElementById('requestPermission');
82+
const statusDiv = document.getElementById('status');
83+
84+
// Показать статус
85+
function showStatus(message, isError = false) {
86+
statusDiv.innerHTML = message;
87+
statusDiv.className = `status ${isError ? 'error' : 'success'}`;
88+
statusDiv.style.display = 'block';
89+
}
90+
91+
// Проверка доступности метода
92+
function checkAvailability() {
93+
if (!tg.requestEmojiStatusAccess) {
94+
showStatus('❌ Функция управления emoji статусом недоступна в вашей версии Telegram', true);
95+
requestButton.disabled = true;
96+
return false;
97+
}
98+
return true;
99+
}
100+
101+
// Запрос разрешения
102+
async function requestEmojiStatusAccess() {
103+
if (!checkAvailability()) return;
104+
105+
try {
106+
requestButton.disabled = true;
107+
requestButton.textContent = 'Запрашиваю разрешение...';
108+
showStatus('⏳ Отправляется запрос на разрешение...');
109+
110+
// Вызываем метод Telegram WebApp API
111+
await tg.requestEmojiStatusAccess();
112+
113+
} catch (error) {
114+
console.error('Ошибка при запросе разрешения:', error);
115+
showStatus('❌ Произошла ошибка при запросе разрешения', true);
116+
requestButton.disabled = false;
117+
requestButton.textContent = 'Попробовать снова';
118+
}
119+
}
120+
121+
// Обработка событий Telegram
122+
tg.onEvent('emojiStatusAccessRequested', function(eventData) {
123+
console.log('Получен ответ на запрос разрешения:', eventData);
124+
125+
if (eventData.status === 'allowed') {
126+
showStatus('✅ Разрешение получено! Теперь бот может управлять вашим emoji статусом.');
127+
requestButton.textContent = 'Разрешение получено';
128+
requestButton.disabled = true;
129+
130+
// Отправляем данные боту
131+
tg.sendData(JSON.stringify({
132+
action: 'emoji_status_permission_granted',
133+
user_id: tg.initDataUnsafe?.user?.id,
134+
status: 'allowed'
135+
}));
136+
137+
// Можно закрыть приложение через несколько секунд
138+
setTimeout(() => {
139+
tg.close();
140+
}, 2000);
141+
142+
} else if (eventData.status === 'cancelled') {
143+
showStatus('❌ Вы отклонили запрос на управление emoji статусом', true);
144+
requestButton.disabled = false;
145+
requestButton.textContent = 'Попробовать снова';
146+
147+
tg.sendData(JSON.stringify({
148+
action: 'emoji_status_permission_denied',
149+
user_id: tg.initDataUnsafe?.user?.id,
150+
status: 'cancelled'
151+
}));
152+
}
153+
});
154+
155+
// Обработчик кнопки
156+
requestButton.addEventListener('click', requestEmojiStatusAccess);
157+
158+
// Проверяем доступность при загрузке
159+
checkAvailability();
160+
161+
// Настройка основной кнопки Telegram (опционально)
162+
tg.MainButton.setText('Закрыть');
163+
tg.MainButton.onClick(() => tg.close());
164+
tg.MainButton.show();
165+
</script>
166+
</body>
167+
</html>

0 commit comments

Comments
 (0)