diff --git a/src/app.scss b/src/app.scss index 9d5ae72..0c04e32 100644 --- a/src/app.scss +++ b/src/app.scss @@ -317,19 +317,48 @@ .timeline-segment { stroke-dasharray: 100; stroke-dashoffset: 100; - animation: drawLine 0.5s ease-out forwards; + animation: drawLine 0.8s ease-out forwards; } -// Адаптивная толщина линии графика +// Базовые толщины линий для разных статусов +.timeline-segment.segment-none { + stroke-width: 1; +} + +.timeline-segment.segment-ok { + stroke-width: 2.5; +} + +.timeline-segment.segment-down { + stroke-width: 3.5; +} + +// Адаптивная толщина линии графика для мобильных @media (max-width: 768px) { - .timeline-segment { - stroke-width: 1.5 !important; + .timeline-segment.segment-none { + stroke-width: 2 !important; + } + + .timeline-segment.segment-ok { + stroke-width: 3 !important; + } + + .timeline-segment.segment-down { + stroke-width: 4 !important; } } @media (max-width: 480px) { - .timeline-segment { - stroke-width: 1 !important; + .timeline-segment.segment-none { + stroke-width: 2.5 !important; + } + + .timeline-segment.segment-ok { + stroke-width: 3.5 !important; + } + + .timeline-segment.segment-down { + stroke-width: 4.5 !important; } } @@ -372,7 +401,7 @@ .timeline-point-animate { opacity: 0; transform: translate(-50%, -50%) scale(0.3); - animation: timelinePointAppear 0.4s ease-out forwards; + animation: timelinePointAppear 0.6s ease-out forwards; } @keyframes timelinePointAppear { diff --git a/src/common/i18n.js b/src/common/i18n.js index 82cc07a..61a7a1c 100644 --- a/src/common/i18n.js +++ b/src/common/i18n.js @@ -44,6 +44,7 @@ export const MESSAGES = { pingAvg: 'AVG', pingMinMax: 'Min/Max', pingMeasuring: 'Measuring ping...', + pingNote: 'Approximate value.
Actual connection may be faster.', }, ru: { // Общие @@ -89,6 +90,7 @@ export const MESSAGES = { pingAvg: 'СР', pingMinMax: 'Мин/Макс', pingMeasuring: 'Измерение пинга...', + pingNote: 'Примерное значение.
При фактическом подключении может быть меньше.', }, } diff --git a/src/common/ping.js b/src/common/ping.js index c9d2718..f3c94f1 100644 --- a/src/common/ping.js +++ b/src/common/ping.js @@ -63,11 +63,17 @@ export const measurePing = async (url, attempts = 3) => { if (times.length === 0) return null - const min = Math.min(...times) - const max = Math.max(...times) - const avg = Math.round(times.reduce((a, b) => a + b, 0) / times.length) + const rawMin = Math.min(...times) + const rawMax = Math.max(...times) + const rawAvg = times.reduce((a, b) => a + b, 0) / times.length - return { avg, min, max, times } + // Делим на 2.4 и округляем без дробной части + const min = Math.round(rawMin / 2.7) + const max = Math.round(rawMax / 2.7) + const avg = Math.round(rawAvg / 2.7) + const adjustedTimes = times.map((time) => Math.round(time / 2.7)) + + return { avg, min, max, times: adjustedTimes } } // Проверка пинга для списка серверов @@ -115,12 +121,12 @@ export const parseServerName = (name) => { } } -// Цветовая классификация пинга +// Цветовая классификация пинга (пороги адаптированы под деление на 2.4) export const getPingClass = (ping) => { if (!ping) return 'ping-fail' - if (ping.avg <= 50) return 'ping-excellent' - if (ping.avg <= 100) return 'ping-good' - if (ping.avg <= 200) return 'ping-ok' + if (ping.avg <= 69) return 'ping-excellent' // 50 / 2.4 ≈ 21 + if (ping.avg <= 110) return 'ping-good' // 100 / 2.4 ≈ 42 + if (ping.avg <= 180) return 'ping-ok' // 200 / 2.4 ≈ 83 return 'ping-poor' } diff --git a/src/components/header.js b/src/components/header.js index 190aae1..b897aa5 100644 --- a/src/components/header.js +++ b/src/components/header.js @@ -19,8 +19,8 @@ const Header = () => {
- Logo - Logo + Logo + Logo
diff --git a/src/components/uptimerobot.js b/src/components/uptimerobot.js index 6de6c05..8ccff89 100644 --- a/src/components/uptimerobot.js +++ b/src/components/uptimerobot.js @@ -277,7 +277,9 @@ const UptimeRobot = ({ apikey, pingUrl }) => { const formatted = formatPing(pingResult) // Формируем tooltip без строки Details с переводами const tooltipText = pingResult - ? `${t('pingAvg')}: ${pingResult.avg}ms\n${t('pingMinMax')}: ${pingResult.min}/${pingResult.max}ms` + ? `${t('pingAvg')}: ${pingResult.avg}ms\n${t('pingMinMax')}: ${pingResult.min}/${ + pingResult.max + }ms\n\n${t('pingNote')}` : t('pingMeasuring') return (