'); categoryList.append(div); mobileCategory.append(``); }); $(".category").first().addClass("active"); function populateDropdowns(category) { const from = $("#fromUnit"); const to = $("#toUnit"); from.empty(); to.empty(); const unitKeys = Object.keys(units[category]); unitKeys.forEach(unit => { from.append(new Option(unit, unit)); to.append(new Option(unit, unit)); }); from.val(unitKeys[0]).trigger("change"); to.val(unitKeys[1] || unitKeys[0]).trigger("change"); } function convertUnits() { const val = parseFloat($("#inputValue").val()); const from = $("#fromUnit").val(); const to = $("#toUnit").val(); const category = $(".category.active").text().trim() || mobileCategory.val(); if (category === "Temperature") { let result = 0; if (from === to) result = val; else if (from === "Celsius") { result = to === "Fahrenheit" ? val * 9 / 5 + 32 : val + 273.15; } else if (from === "Fahrenheit") { result = to === "Celsius" ? (val - 32) * 5 / 9 : (val - 32) * 5 / 9 + 273.15; } else if (from === "Kelvin") { result = to === "Celsius" ? val - 273.15 : (val - 273.15) * 9 / 5 + 32; } $("#result").text(isNaN(result) ? 0 : result.toFixed(3)); } else { const factorFrom = units[category][from]; const factorTo = units[category][to]; const result = (val / factorFrom) * factorTo; $("#result").text(isNaN(result) ? 0 : result.toFixed(3)); } } $(".sidebar").on("click", ".category", function () { $(".category").removeClass("active"); $(this).addClass("active"); const selectedCategory = $(this).text().trim(); populateDropdowns(selectedCategory); convertUnits(); }); mobileCategory.on("change", function () { const selected = $(this).val(); categoryLabel.text(selected); populateDropdowns(selected); convertUnits(); }); $(".unit-select").select2(); $("#inputValue").on("input", convertUnits); $("#fromUnit, #toUnit").on("change", convertUnits); // Initial load const firstCategory = $(".category.active").text().trim(); mobileCategory.val(firstCategory).trigger("change"); populateDropdowns(firstCategory); convertUnits(); });