`;
return;
}
let html = '';
historyData.forEach((item, index) => {
const isLatest = index === 0;
const bgClass = isLatest ? 'style="background: rgba(3, 105, 161, 0.08);"' : '';
html += `
P: ${formatNumber(item.pressure, 2)} МПа
d: ${formatNumber(item.diameter, 1)} мм
${formatNumber(item.force, 2)} Н
`;
});
historyListEl.innerHTML = html;
}
// ====================================================================
// События
// ====================================================================
// Переключение режимов
modeBtns.forEach(btn => {
btn.addEventListener('click', () => {
switchMode(btn.dataset.mode);
});
});
// Авто-расчет при вводе
diameterInput.addEventListener('input', () => {
calculate();
});
pressureDiameterInput.addEventListener('input', () => {
calculate();
});
// Все поля ввода - авто-расчет
const allInputs = document.querySelectorAll('.hp-calc__input:not([readonly])');
allInputs.forEach(input => {
input.addEventListener('input', () => {
calculate();
});
input.addEventListener('blur', () => {
// Валидация: отрицательные значения
if (parseFloat(input.value) < 0) {
input.classList.add('error');
input.value = '0';
setTimeout(() => input.classList.remove('error'), 500);
}
});
});
// Очистка истории
clearHistoryBtn.addEventListener('click', () => {
historyData = [];
renderHistory();
// Показать confirmation эффект
const originalText = clearHistoryBtn.textContent;
clearHistoryBtn.textContent = '🗑️ История очищена!';
setTimeout(() => {
clearHistoryBtn.textContent = originalText;
}, 2000);
});
// ====================================================================
// Инициализация
// ====================================================================
calculate();
})();
