File size: 1,310 Bytes
ca7569e
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
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
<!DOCTYPE html>
<html>
<head>
    <title>My Gradio App</title>
    <script src="https://telegram.org/js/telegram-web-app.js"></script>
    <script>
        document.addEventListener('DOMContentLoaded', function() {
            // Initialize the Telegram Web App
            window.Telegram.WebApp.init();

            // Get user data
            const user = window.Telegram.WebApp.initDataUnsafe.user;
            console.log('Telegram user data:', user);

            // Extract username
            const username = user ? user.username : 'Guest';

            // Set a custom title for the app
            window.Telegram.WebApp.setTitle("My Gradio App");

            // Display welcome message
            document.getElementById('welcome-message').textContent = `Welcome, ${username}!`;

            // Example: Handle button click
            document.getElementById('my-button').addEventListener('click', function() {
                window.Telegram.WebApp.close();
            });
        });
    </script>
</head>
<body>
    <h1 id="welcome-message">Welcome, Guest!</h1>
    <!-- Gradio app iframe -->
    <iframe src="https://measmonysuon-WebApp.hf.space" width="100%" height="600px"></iframe>
    <!-- Optional button to close the app -->
    <button id="my-button">Close</button>
</body>
</html>