serverus/tma
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update
All checks were successful
Create and publish a Docker image 🚀 / build-and-push-image (push) Successful in 1m12s
Details

Browse Source
This commit is contained in:
Smile Rex
2026-01-13 20:49:05 +03:00
parent 7b09ecbf5b
commit 552caaef53
1 changed files with 49 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files

78
templates/D.html
View File

@@ -94,39 +94,58 @@ body {
<link rel="apple-touch-icon" href="D.apple-touch-icon.png"/> <link rel="apple-touch-icon" href="D.apple-touch-icon.png"/>
<script src="https://telegram.org/js/telegram-web-app.js?59"></script> <script src="https://telegram.org/js/telegram-web-app.js?59"></script>
<script> <script>
function isTelegram() { (function () {
return typeof window.Telegram !== "undefined" function isTelegram() {
&& window.Telegram.WebApp; return typeof window.Telegram !== "undefined"
} && window.Telegram.WebApp;
function resizeCanvas() {
const canvas = document.getElementById("canvas");
let width;
let height;
if (isTelegram()) {
const tg = window.Telegram.WebApp;
tg.expand();
// ⬅️ КЛЮЧЕВОЕ МЕСТО
width = document.documentElement.clientWidth;
height = tg.viewportStableHeight;
} else {
width = document.documentElement.clientWidth;
height = document.documentElement.clientHeight;
} }
canvas.style.width = width + "px"; function getViewportSize() {
canvas.style.height = height + "px"; const root = document.documentElement;
}
if (isTelegram()) { // ширина ВСЕГДА из CSS layout
Telegram.WebApp.onEvent("viewportChanged", resizeCanvas); const width = root.clientWidth;
}
let height;
if (isTelegram()) {
const tg = window.Telegram.WebApp;
tg.expand();
height = tg.viewportStableHeight;
} else {
height = root.clientHeight;
}
return { width, height };
}
function resizeCanvas() {
const canvas = document.getElementById("canvas");
if (!canvas) return;
const { width, height } = getViewportSize();
const dpr = window.devicePixelRatio || 1;
// ВАЖНО: internal WebGL resolution
canvas.width = Math.floor(width * dpr);
canvas.height = Math.floor(height * dpr);
// CSS size
canvas.style.width = width + "px";
canvas.style.height = height + "px";
}
// Telegram resize
if (isTelegram()) {
Telegram.WebApp.onEvent("viewportChanged", resizeCanvas);
}
// Browser resize
window.addEventListener("resize", resizeCanvas);
// Initial
resizeCanvas();
})();
window.addEventListener("resize", resizeCanvas);
resizeCanvas();
</script> </script>
<style> <style>
@@ -146,6 +165,7 @@ canvas {
} }
</style> </style>
</head> </head>
<body> <body>
<canvas id="canvas"> <canvas id="canvas">