ychernenko/WFL
1
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

обновил заставку загрузки матрицы

Browse Source
This commit is contained in:
Юрий Черненко
2026-04-23 11:39:24 +03:00
parent 50de4ea68c
commit ca9250ae86
1 changed files with 23 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

34
templates/admin_db_index.html
View File

@@ -11,8 +11,8 @@
--border: #2b3240; --border: #2b3240;
--text: #e8ecf3; --text: #e8ecf3;
--muted: #9aa4b2; --muted: #9aa4b2;
--accent: #4f8cff; --accent: #28c76f;
--accent-hover: #3e78e6; --accent-hover: #20b15f;
--success-bg: rgba(46, 204, 113, 0.12); --success-bg: rgba(46, 204, 113, 0.12);
--success-border: rgba(46, 204, 113, 0.35); --success-border: rgba(46, 204, 113, 0.35);
--danger-bg: rgba(255, 99, 99, 0.12); --danger-bg: rgba(255, 99, 99, 0.12);
@@ -162,7 +162,7 @@
width: min(90vw, 560px); width: min(90vw, 560px);
padding: 28px 24px; padding: 28px 24px;
border-radius: 18px; border-radius: 18px;
border: 1px solid rgba(79, 140, 255, 0.35); border: 1px solid rgba(0, 255, 136, 0.35);
background: rgba(12, 17, 26, 0.88); background: rgba(12, 17, 26, 0.88);
box-shadow: 0 20px 50px rgba(0, 0, 0, 0.45); box-shadow: 0 20px 50px rgba(0, 0, 0, 0.45);
text-align: center; text-align: center;
@@ -172,13 +172,13 @@
.matrix-title { .matrix-title {
font-size: 28px; font-size: 28px;
font-weight: 700; font-weight: 700;
color: #f4f8ff; color: #d8ffe9;
margin-bottom: 12px; margin-bottom: 12px;
} }
.matrix-status { .matrix-status {
font-size: 16px; font-size: 16px;
color: #c5d2e6; color: #9ff5c8;
line-height: 1.6; line-height: 1.6;
} }
@@ -261,11 +261,15 @@
drops = Array.from({ length: columns }, () => Math.random() * canvas.height / fontSize); drops = Array.from({ length: columns }, () => Math.random() * canvas.height / fontSize);
} }
let lastFrameTime = 0;
const matrixFps = 15;
const matrixFrameInterval = 1000 / matrixFps;
function drawMatrix() { function drawMatrix() {
if (!canvas || !ctx) return; if (!canvas || !ctx) return;
ctx.fillStyle = "rgba(3, 8, 15, 0.10)"; ctx.fillStyle = "rgba(3, 8, 15, 0.08)";
ctx.fillRect(0, 0, canvas.width, canvas.height); ctx.fillRect(0, 0, canvas.width, canvas.height);
ctx.fillStyle = "#4f8cff"; ctx.fillStyle = "#00ff88";
ctx.font = `${fontSize}px monospace`; ctx.font = `${fontSize}px monospace`;
for (let i = 0; i < drops.length; i++) { for (let i = 0; i < drops.length; i++) {
@@ -273,13 +277,20 @@
const x = i * fontSize; const x = i * fontSize;
const y = drops[i] * fontSize; const y = drops[i] * fontSize;
ctx.fillText(text, x, y); ctx.fillText(text, x, y);
if (y > canvas.height && Math.random() > 0.975) { if (y > canvas.height && Math.random() > 0.985) {
drops[i] = 0; drops[i] = 0;
} }
drops[i] += 1; drops[i] += 0.65;
} }
}
matrixAnimationId = requestAnimationFrame(drawMatrix); function animateMatrix(timestamp) {
if (!matrixAnimationId) return;
if (!lastFrameTime || timestamp - lastFrameTime >= matrixFrameInterval) {
drawMatrix();
lastFrameTime = timestamp;
}
matrixAnimationId = requestAnimationFrame(animateMatrix);
} }
function startLoader(title, message) { function startLoader(title, message) {
@@ -290,7 +301,8 @@
loader.setAttribute("aria-hidden", "false"); loader.setAttribute("aria-hidden", "false");
if (!matrixAnimationId) { if (!matrixAnimationId) {
resizeCanvas(); resizeCanvas();
drawMatrix(); lastFrameTime = 0;
matrixAnimationId = requestAnimationFrame(animateMatrix);
} }
} }