Spaces:
Paused
Paused
| <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://your-gradio-app-url" width="100%" height="600px"></iframe> | |
| <!-- Optional button to close the app --> | |
| <button id="my-button">Close</button> | |
| </body> | |
| </html> |