wasrusgen/zov-tech
1
0
Fork 0
mirror of https://github.com/wasrusgen/zov-tech.git synced 2026-06-03 17:44:48 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

splash: move out of #app + guarantee 700ms min visibility

Browse Source 
Splash was nested inside <main id='app'> — render functions wipe
app.innerHTML before hideSplash() runs, so the splash never showed.
Moved it to a sibling of #app and made hideSplash() wait for at least
700ms of total time elapsed since page load before fade-out.

Cache bust v=20260513d.
This commit is contained in:
wasrusgen 2026-05-12 18:57:40 +03:00
parent 1ca8b3a5a1
commit c767954535
2 changed files with 32 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
miniapp/assets/app.js
View File

@ -354,14 +354,18 @@ function renderError() {
}
/* ----------------- Init ----------------- */
// Засекаем когда стартовали — чтобы splash висел минимум ~700мс
const _splashStart = Date.now();
function hideSplash() {
const splash = document.getElementById("splash");
if (!splash) return;
// Минимум 350мс показа, чтобы не было «вспышки»
const elapsed = Date.now() - _splashStart;
const minShow = 700; // минимум показа, мс
const wait = Math.max(0, minShow - elapsed);
setTimeout(() => {
splash.classList.add("hide");
setTimeout(() => splash.remove(), 450);
}, 200);
}, wait);
}
async function init() {

22
miniapp/index.html
View File

@ -12,11 +12,11 @@
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Geist:wght@400;500;600&family=Newsreader:ital,wght@0,400..600;1,400..600&family=Instrument+Serif:ital@0;1&family=JetBrains+Mono:wght@400;500&display=swap">
<script src="https://telegram.org/js/telegram-web-app.js"></script>
<link rel="stylesheet" href="assets/styles.css?v=20260513c">
<link rel="stylesheet" href="assets/podbor.css?v=20260513c">
<link rel="stylesheet" href="assets/styles.css?v=20260513d">
<link rel="stylesheet" href="assets/podbor.css?v=20260513d">
</head>
<body>
<main id="app">
<!-- Splash — за пределами #app, render-функции его не смывают -->
<div class="loader splash" id="splash">
<svg class="loader-logo" viewBox="0 0 128 117" xmlns="http://www.w3.org/2000/svg" aria-label="ЗОВ">
<path d="M38.9357 44.8551C35.0934 46.5151 32.2412 48.1838 32.2412 48.1838L63.767 0L87.9468 35.8374C87.9468 35.8374 86.6265 35.0766 82.3187 34.6875C76.2759 34.1428 67.8802 35.5261 61.3381 37.0478C54.8213 38.5609 45.3171 42.0884 38.9357 44.8551Z"/>
@ -33,13 +33,13 @@
<div class="loader-caption-sub">ZOV · кухня и техника</div>
</div>
</div>
</main>
<script src="assets/icons.js?v=20260513c"></script>
<script src="assets/podbor.config.js?v=20260513c"></script>
<script src="assets/podbor.picts.js?v=20260513c"></script>
<script src="assets/podbor.js?v=20260513c"></script>
<script src="assets/clients.js?v=20260513c"></script>
<script src="assets/measurements.js?v=20260513c"></script>
<script src="assets/app.js?v=20260513c"></script>
<main id="app"></main>
<script src="assets/icons.js?v=20260513d"></script>
<script src="assets/podbor.config.js?v=20260513d"></script>
<script src="assets/podbor.picts.js?v=20260513d"></script>
<script src="assets/podbor.js?v=20260513d"></script>
<script src="assets/clients.js?v=20260513d"></script>
<script src="assets/measurements.js?v=20260513d"></script>
<script src="assets/app.js?v=20260513d"></script>
</body>
</html>