⇅ Поменять местами (function() { const style = document.createElement("style"); style.textContent = `.engineer-converter { font-family: inherit; max-width: 100%; margin: 0 auto; padding: 25px 0;}.converter-container { max-width: 900px; margin: 0 auto; padding: 0 15px;}.category-selector { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 15px; margin-bottom: 30px;}.category-btn { padding: 14px 18px; border: 1px solid #ddd; background: transparent; border-radius: 8px; cursor: pointer; font-size: 15px; transition: all 0.25s ease; text-align: center; line-height: 1.4; display: flex; align-items: center; justify-content: flex-start; gap: 12px; min-height: 56px; white-space: nowrap; box-shadow: 0 2px 4px rgba(0,0,0,0.05);}.category-btn:hover { transform: translateY(-2px); box-shadow: 0 4px 8px rgba(0,0,0,0.1); border-color: var(--theme-primary-color);}.category-btn.active { background: var(--theme-primary-color); color: var(--theme-btn-text-color); border-color: var(--theme-primary-color); box-shadow: 0 4px 12px rgba(var(--theme-primary-rgb, 37, 99, 235), 0.2);}.category-btn span.icon { font-size: 22px; line-height: 1; flex-shrink: 0; width: 30px; text-align: center;}.category-btn span.text { font-size: 14px; font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex-grow: 1; text-align: left;}.converter-card { background: transparent; border-radius: 10px; padding: 25px;}.converter-group { display: flex; flex-direction: column; gap: 20px;}.input-group { display: flex; gap: 15px; align-items: center;}.input-group .form-control { flex: 1; min-height: 52px; font-size: 17px; padding: 12px 16px; border-radius: 6px;}.swap-button-container { display: flex; justify-content: center; align-items: center; margin: 10px 0;}.swap-btn-large { min-width: 200px; min-height: 52px; font-size: 16px; padding: 12px 24px; border-radius: 8px; display: flex; align-items: center; justify-content: center; gap: 12px; transition: all 0.25s ease; font-weight: 500;}.swap-btn-large:hover { transform: translateY(-2px); box-shadow: 0 6px 12px rgba(0,0,0,0.15);}.swap-btn-large .swap-icon { font-size: 22px; font-weight: bold;}.swap-btn-large .swap-text { font-weight: 500; white-space: nowrap;}.form-control { background: transparent !important; color: inherit !important; border-color: var(--theme-border-color) !important; border-radius: 6px !important;}.form-control:focus { border-color: var(--theme-primary-color) !important; box-shadow: 0 0 0 3px rgba(var(--theme-primary-rgb), 0.15) !important;}@media (max-width: 992px) { .category-selector { grid-template-columns: repeat(3, 1fr); } .swap-btn-large { min-width: 180px; }}@media (max-width: 768px) { .category-selector { grid-template-columns: repeat(2, 1fr); gap: 12px; } .category-btn { padding: 12px 15px; min-height: 50px; } .category-btn span.icon { font-size: 20px; width: 26px; } .category-btn span.text { font-size: 13px; } .swap-btn-large { min-width: 160px; min-height: 48px; font-size: 15px; padding: 10px 20px; } .swap-btn-large .swap-icon { font-size: 20px; }}@media (max-width: 576px) { .category-selector { grid-template-columns: 1fr; } .category-btn { padding: 10px 14px; min-height: 48px; } .input-group { flex-direction: column; gap: 12px; } .swap-button-container { margin: 15px 0; } .swap-btn-large { transform: rotate(90deg); min-width: 140px; min-height: 44px; margin: 10px 0; gap: 8px; } .swap-btn-large .swap-text { display: none; } .swap-btn-large .swap-icon { font-size: 24px; } .input-group .form-control { min-height: 48px; font-size: 16px; padding: 10px 14px; }} `; document.head.appendChild(style);})();document.addEventListener("DOMContentLoaded", function() { // Полная база данных единиц измерения const unitsDatabase = { hardness: { name: "Жесткость", icon: "💧", units: { "ppm": { name: "ppm CaCO₃", factor: 1 }, "meq": { name: "мг-экв/л", factor: 0.02 }, "dH": { name: "°dH (нем.)", factor: 0.056 }, "fH": { name: "°fH (франц.)", factor: 0.1 }, "gpg": { name: "gpg", factor: 0.058 } } }, concentration: { name: "Концентрация", icon: "🧪", units: { "ppm": { name: "ppm", factor: 1 }, "mg_l": { name: "мг/л", factor: 1 }, "g_l": { name: "г/л", factor: 0.001 }, "percent": { name: "%", factor: 0.0001 }, "ppb": { name: "ppb", factor: 1000 } } }, pressure: { name: "Давление", icon: "📊", units: { "bar": { name: "бар", factor: 1 }, "atm": { name: "атм", factor: 0.986923 }, "kpa": { name: "кПа", factor: 100 }, "mpa": { name: "МПа", factor: 0.1 }, "psi": { name: "psi", factor: 14.5038 }, "mh2o": { name: "м вод. ст.", factor: 10.1972 }, "mmhg": { name: "мм рт. ст.", factor: 750.062 } } }, flow: { name: "Расход", icon: "🌊", units: { "m3h": { name: "м³/ч", factor: 1 }, "lmin": { name: "л/мин", factor: 16.6667 }, "ls": { name: "л/с", factor: 0.277778 }, "gpm": { name: "GPM", factor: 4.40287 }, "cfm": { name: "CFM", factor: 0.588578 } } }, temperature: { name: "Температура", icon: "🌡️", units: { "c": { name: "°C", factor: 1, offset: 0 }, "f": { name: "°F", factor: 1.8, offset: 32 }, "k": { name: "K", factor: 1, offset: 273.15 } } }, volume: { name: "Объем", icon: "📦", units: { "m3": { name: "м³", factor: 1 }, "liter": { name: "литры", factor: 1000 }, "ml": { name: "мл", factor: 1000000 }, "us_gal": { name: "галлон US", factor: 264.172 }, "uk_gal": { name: "галлон UK", factor: 219.969 }, "ft3": { name: "куб. фут", factor: 35.3147 } } }, mass: { name: "Масса", icon: "⚖️", units: { "kg": { name: "кг", factor: 1 }, "g": { name: "граммы", factor: 1000 }, "mg": { name: "мг", factor: 1000000 }, "ton": { name: "тонны", factor: 0.001 }, "lb": { name: "фунты", factor: 2.20462 } } }, length: { name: "Длина", icon: "📏", units: { "m": { name: "метры", factor: 1 }, "cm": { name: "см", factor: 100 }, "mm": { name: "мм", factor: 1000 }, "km": { name: "км", factor: 0.001 }, "inch": { name: "дюймы", factor: 39.3701 }, "ft": { name: "футы", factor: 3.28084 } } }, area: { name: "Площадь", icon: "🔷", units: { "m2": { name: "м²", factor: 1 }, "cm2": { name: "см²", factor: 10000 }, "mm2": { name: "мм²", factor: 1000000 }, "ha": { name: "гектары", factor: 0.0001 }, "ft2": { name: "футы²", factor: 10.7639 } } }, power: { name: "Мощность", icon: "⚡", units: { "w": { name: "Вт", factor: 1 }, "kw": { name: "кВт", factor: 0.001 }, "mw": { name: "МВт", factor: 0.000001 }, "hp": { name: "л.с.", factor: 0.001341 } } }, energy: { name: "Энергия", icon: "🔋", units: { "j": { name: "Джоуль", factor: 1 }, "kj": { name: "кДж", factor: 0.001 }, "mj": { name: "МДж", factor: 0.000001 }, "kwh": { name: "кВт·ч", factor: 2.77778e-7 } } }, conductivity: { name: "Электропров.", icon: "🔌", units: { "ms_cm": { name: "мСм/см", factor: 1 }, "us_cm": { name: "мкСм/см", factor: 1000 }, "ms_m": { name: "мСм/м", factor: 100 }, "tds": { name: "ppm TDS", factor: 640 } } }, time: { name: "Время", icon: "⏰", units: { "sec": { name: "секунды", factor: 1 }, "min": { name: "минуты", factor: 1/60 }, "hour": { name: "часы", factor: 1/3600 }, "day": { name: "сутки", factor: 1/86400 } } }, viscosity: { name: "Вязкость", icon: "🫧", units: { "pa_s": { name: "Па·с", factor: 1 }, "mpa_s": { name: "мПа·с", factor: 1000 }, "cp": { name: "сантипуаз", factor: 1000 } } } }; class UnitConverter { constructor() { this.currentCategory = "hardness"; this.initializeElements(); this.populateCategories(); this.setupEventListeners(); this.updateUnits(); this.convert(); } initializeElements() { this.categorySelector = document.getElementById("categorySelector"); this.inputValue = document.getElementById("inputValue"); this.inputUnit = document.getElementById("inputUnit"); this.outputValue = document.getElementById("outputValue"); this.outputUnit = document.getElementById("outputUnit"); this.swapBtn = document.getElementById("swapBtn"); } populateCategories() { for (const [key, category] of Object.entries(unitsDatabase)) { const button = document.createElement("button"); button.className = `category-btn btn btn-default has-ripple ${key === this.currentCategory ? "active" : ""}`; button.innerHTML = `${category.icon}${category.name}`; button.dataset.category = key; button.addEventListener("click", () => this.switchCategory(key)); this.categorySelector.appendChild(button); } } switchCategory(category) { this.currentCategory = category; document.querySelectorAll(".category-btn").forEach(btn => { btn.classList.toggle("active", btn.dataset.category === category); }); this.updateUnits(); this.convert(); } updateUnits() { const units = unitsDatabase[this.currentCategory].units; this.inputUnit.innerHTML = ""; this.outputUnit.innerHTML = ""; for (const [key, unit] of Object.entries(units)) { const inputOption = new Option(unit.name, key); const outputOption = new Option(unit.name, key); this.inputUnit.add(inputOption); this.outputUnit.add(outputOption); } if (Object.keys(units).length > 1) { this.outputUnit.selectedIndex = 1; } } setupEventListeners() { this.inputValue.addEventListener("input", () => this.convert()); this.inputUnit.addEventListener("change", () => this.convert()); this.outputUnit.addEventListener("change", () => this.convert()); this.swapBtn.addEventListener("click", () => this.swapUnits()); } swapUnits() { const tempUnit = this.inputUnit.value; this.inputUnit.value = this.outputUnit.value; this.outputUnit.value = tempUnit; this.convert(); } convert() { const inputVal = parseFloat(this.inputValue.value.replace(",", ".")) || 0; const inputUnitKey = this.inputUnit.value; const outputUnitKey = this.outputUnit.value; const category = unitsDatabase[this.currentCategory]; if (this.currentCategory === "temperature") { this.convertTemperature(inputVal, inputUnitKey, outputUnitKey); } else { this.convertStandard(inputVal, inputUnitKey, outputUnitKey, category); } } convertStandard(inputVal, inputUnitKey, outputUnitKey, category) { const inputUnit = category.units[inputUnitKey]; const outputUnit = category.units[outputUnitKey]; const baseValue = inputVal / inputUnit.factor; const result = baseValue * outputUnit.factor; this.outputValue.value = this.formatNumber(result); } convertTemperature(inputVal, inputUnitKey, outputUnitKey) { let celsius; switch(inputUnitKey) { case "c": celsius = inputVal; break; case "f": celsius = (inputVal - 32) / 1.8; break; case "k": celsius = inputVal - 273.15; break; } let result; switch(outputUnitKey) { case "c": result = celsius; break; case "f": result = (celsius * 1.8) + 32; break; case "k": result = celsius + 273.15; break; } this.outputValue.value = this.formatNumber(result); } formatNumber(num) { if (num === 0) return "0"; if (Math.abs(num) < 0.0001) return num.toExponential(4); if (Math.abs(num) > 1000000) return num.toExponential(4); const fixed = num.toFixed(6).replace(/\.?0+$/, ""); return fixed.length > 10 ? num.toExponential(4) : fixed; } } new UnitConverter();});
