optimization and some fixes

This commit is contained in:
2026-04-26 11:55:12 +07:00
parent 166d0e7f08
commit 5bb5c4e75e
3 changed files with 48 additions and 12 deletions
+1 -3
View File
@@ -61,9 +61,7 @@ export const NetrunnerMatrix: React.FC<NetrunnerMatrixProps> = ({
}; };
const isMobile = checkIsMobile(); const isMobile = checkIsMobile();
const pixelScale = isMobile const pixelScale = Math.min(window.devicePixelRatio || 1, 1.5);
? 1.0
: Math.min(window.devicePixelRatio || 1, 1.5);
const initialWidth = container.clientWidth * pixelScale; const initialWidth = container.clientWidth * pixelScale;
const initialHeight = container.clientHeight * pixelScale; const initialHeight = container.clientHeight * pixelScale;
+39 -4
View File
@@ -193,6 +193,8 @@ function drawEye(ctx, cx, cy, gazeX, gazeY, dir, isClosed) {
const eyeRadius = 36 * (1 - isClosed) + 8 * isClosed; const eyeRadius = 36 * (1 - isClosed) + 8 * isClosed;
const laserWidth = 140 * isClosed; const laserWidth = 140 * isClosed;
const shadowMult = isMobile ? 0.2 : 1.0;
ctx.save(); ctx.save();
ctx.fillStyle = bgFill; ctx.fillStyle = bgFill;
ctx.beginPath(); ctx.beginPath();
@@ -208,7 +210,7 @@ function drawEye(ctx, cx, cy, gazeX, gazeY, dir, isClosed) {
ctx.strokeStyle = color; ctx.strokeStyle = color;
ctx.lineWidth = 4 * (1 - isClosed) + 3 * isClosed; ctx.lineWidth = 4 * (1 - isClosed) + 3 * isClosed;
ctx.shadowColor = color; ctx.shadowColor = color;
ctx.shadowBlur = 15 * (1 - isClosed) + 8 * isClosed; ctx.shadowBlur = (15 * (1 - isClosed) + 8 * isClosed) * shadowMult;
ctx.stroke(); ctx.stroke();
if (isVpnOn && isClosed > 0.1) { if (isVpnOn && isClosed > 0.1) {
@@ -224,21 +226,54 @@ function drawEye(ctx, cx, cy, gazeX, gazeY, dir, isClosed) {
ctx.save(); ctx.save();
ctx.translate(cx + gazeX, cy + gazeY); ctx.translate(cx + gazeX, cy + gazeY);
// Добавляем плавное вращение для кибер-интерфейса зрачка
const t = performance.now() * 0.0015; const t = performance.now() * 0.0015;
// 1. Внешнее кибер-кольцо (вращающееся, прерывистое) // 1. Внешнее кибер-кольцо
ctx.save(); ctx.save();
ctx.rotate(t); ctx.rotate(t);
ctx.strokeStyle = color; ctx.strokeStyle = color;
ctx.lineWidth = 1.5; ctx.lineWidth = 1.5;
ctx.globalAlpha = 0.7 * alphaMult; ctx.globalAlpha = 0.7 * alphaMult;
ctx.setLineDash([8, 6, 2, 6]); // Техно-паттерн ctx.setLineDash([8, 6, 2, 6]);
ctx.beginPath(); ctx.beginPath();
ctx.arc(0, 0, 16, 0, Math.PI * 2); ctx.arc(0, 0, 16, 0, Math.PI * 2);
ctx.stroke(); ctx.stroke();
ctx.restore(); ctx.restore();
// 2. Внутреннее сплошное кольцо
ctx.strokeStyle = isDarkMode ? "rgba(255,255,255,0.5)" : "rgba(0,0,0,0.5)";
ctx.lineWidth = 1;
ctx.globalAlpha = alphaMult;
ctx.beginPath();
ctx.arc(0, 0, 10, 0, Math.PI * 2);
ctx.stroke();
// 3. ЗРАЧОК (Теперь он живой: пульсирует и имеет энерго-ядро)
const pulse = Math.sin(t * 5) * 0.15 + 0.85; // Пульсация масштаба от 0.7 до 1.0
ctx.save();
ctx.scale(pulse, pulse); // Применяем дыхание
// Внешний ромб зрачка
ctx.fillStyle = isDarkMode ? "#fff" : "#000";
ctx.shadowBlur = 10 * shadowMult;
ctx.shadowColor = color;
ctx.beginPath();
ctx.moveTo(0, -6);
ctx.lineTo(5, 0);
ctx.lineTo(0, 6);
ctx.lineTo(-5, 0);
ctx.fill();
// Внутреннее ядро (микро-точка)
ctx.fillStyle = color;
ctx.shadowBlur = 0;
ctx.beginPath();
ctx.arc(0, 0, 1.5, 0, Math.PI * 2);
ctx.fill();
ctx.restore();
// 2. Внутреннее сплошное кольцо для глубины // 2. Внутреннее сплошное кольцо для глубины
ctx.strokeStyle = isDarkMode ? "rgba(255,255,255,0.5)" : "rgba(0,0,0,0.5)"; ctx.strokeStyle = isDarkMode ? "rgba(255,255,255,0.5)" : "rgba(0,0,0,0.5)";
ctx.lineWidth = 1; ctx.lineWidth = 1;
+8 -5
View File
@@ -481,9 +481,6 @@ impl MatrixEngine {
_ => 1.0, _ => 1.0,
}; };
// 1. ГИРОСКОП: Постоянный снос
drop.base_x += self.tilt_x * parallax_factor * 5.0;
// Бесконечный экран // Бесконечный экран
let wrap_margin = 150.0; let wrap_margin = 150.0;
if drop.base_x < -wrap_margin { if drop.base_x < -wrap_margin {
@@ -506,11 +503,17 @@ impl MatrixEngine {
for sw in self.shockwaves.iter().filter(|s| s.active) { for sw in self.shockwaves.iter().filter(|s| s.active) {
let dx = current_x - sw.x; let dx = current_x - sw.x;
let dy = current_y - sw.y; let dy = current_y - sw.y;
// ОПТИМИЗАЦИЯ: Отсекаем капли вне зоны действия волны до вычисления sqrt()
if dx.abs() > sw.radius + 40.0 || dy.abs() > sw.radius + 40.0 {
continue;
}
let dist = (dx * dx + dy * dy).sqrt(); let dist = (dx * dx + dy * dy).sqrt();
if (dist - sw.radius).abs() < 40.0 { if (dist - sw.radius).abs() < 40.0 {
let force = (sw.life / sw.max_life) * 18.0 * parallax_factor; let force = (sw.life / sw.max_life) * 18.0 * parallax_factor;
drop.vel_x += (dx / dist.max(1.0)) * force; drop.vel_x += (dx / dist.max(1.0_f32)) * force;
force_white = true; force_white = true;
} }
} }
@@ -625,7 +628,7 @@ impl MatrixEngine {
1 => 0.7, 1 => 0.7,
_ => 1.0, _ => 1.0,
}; };
let final_x = drop.base_x + drop.offset_x; let final_x = drop.base_x + drop.offset_x + (self.tilt_x * 30.0 * parallax_factor);
let base_idx = i * 6; let base_idx = i * 6;
self.render_buffer[base_idx] = final_x; self.render_buffer[base_idx] = final_x;