fix: Web Client — точная копия оригинальной анимации
Реализована точно такая же анимация как была: - avg = currentRms * 100 (вместо микрофона) - Сглаживание rmsSmoothed * 0.7 + avg * 0.3 - Симуляция если RMS < 1 (12 + random * 25) - Усиление при LISTEN/SPEAK (45 + random * 55) - 42 столбика с синусом - Случайные колебания 0.5 + random * 0.3 - Увеличение при SPEAK Теперь 1-в-1 как оригинал, но с данными satellite!
This commit is contained in:
+24
-16
@@ -583,12 +583,11 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// Визуализация на canvas — рисуем RMS от satellite с красивой анимацией
|
// Визуализация на canvas — RMS от satellite с оригинальной анимацией
|
||||||
let satelliteRmsHistory = new Array(42).fill(0); // История RMS значений
|
let satelliteRmsHistory = new Array(42).fill(0);
|
||||||
let rmsSmoothed = 0; // Сглаженное значение
|
let rmsSmoothed = 0;
|
||||||
|
|
||||||
function drawSatelliteVisualization() {
|
function drawSatelliteVisualization() {
|
||||||
if(!ctx) return;
|
|
||||||
requestAnimationFrame(drawSatelliteVisualization);
|
requestAnimationFrame(drawSatelliteVisualization);
|
||||||
|
|
||||||
if(!isConnected) {
|
if(!isConnected) {
|
||||||
@@ -601,25 +600,34 @@
|
|||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
// Добавляем текущее RMS в историю (сглаживание)
|
// Берём RMS от satellite вместо локального микрофона
|
||||||
rmsSmoothed = rmsSmoothed * 0.7 + currentRms * 0.3;
|
let avg = currentRms * 100; // Конвертируем 0.0-1.0 в 0-100
|
||||||
satelliteRmsHistory.shift();
|
|
||||||
satelliteRmsHistory.push(rmsSmoothed);
|
|
||||||
|
|
||||||
// Рисуем
|
// Сглаживание как в оригинале
|
||||||
|
rmsSmoothed = rmsSmoothed * 0.7 + avg * 0.3;
|
||||||
|
avg = rmsSmoothed;
|
||||||
|
|
||||||
|
// Если satellite RMS недоступен – делаем «живую» симуляцию
|
||||||
|
if(avg < 1) {
|
||||||
|
avg = 12 + Math.random() * 25;
|
||||||
|
if(stateText.innerText.includes('LISTEN') || stateText.innerText.includes('SPEAK'))
|
||||||
|
avg = 45 + Math.random() * 55;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Отрисовка 42 неоновых столбцов (баров)
|
||||||
ctx.clearRect(0,0,canvas.width, canvas.height);
|
ctx.clearRect(0,0,canvas.width, canvas.height);
|
||||||
ctx.fillStyle = '#03151f';
|
ctx.fillStyle = '#03151f';
|
||||||
ctx.fillRect(0,0,canvas.width, canvas.height);
|
ctx.fillRect(0,0,canvas.width, canvas.height);
|
||||||
|
|
||||||
const barWidth = (canvas.width / 42);
|
const barWidth = canvas.width / 42;
|
||||||
|
const numBars = 42;
|
||||||
|
|
||||||
for(let i=0; i<42; i++) {
|
for(let i=0; i<numBars; i++) {
|
||||||
const rms = satelliteRmsHistory[i];
|
let barHeight = (avg * (Math.sin(i*0.5)+1)/2 + 5) * (0.5 + Math.random()*0.3);
|
||||||
// Красивая анимация с синусом как в оригинале
|
|
||||||
let barHeight = (rms * canvas.height * 1.5 * (Math.sin(i * 0.5) + 1)/2 + 5) * (0.5 + (Math.random()*0.3));
|
|
||||||
|
|
||||||
// Увеличиваем высоту если громко
|
// Увеличиваем высоту если громко (как в оригинале)
|
||||||
if(rms > 0.3) barHeight = rms * canvas.height * 1.8 * (Math.sin(i*0.3)+1.2);
|
if(stateText.innerText.includes('SPEAK'))
|
||||||
|
barHeight = avg * 1.6 * (Math.sin(i*0.3)+1.2);
|
||||||
|
|
||||||
barHeight = Math.min(barHeight, canvas.height-10);
|
barHeight = Math.min(barHeight, canvas.height-10);
|
||||||
const x = i * (barWidth+2);
|
const x = i * (barWidth+2);
|
||||||
|
|||||||
Reference in New Issue
Block a user