Issue Title: Enhance convertFeetToCm Function to Include Centimeter…

…s Conversion
Rakesh9100 · Aug 14, 2024 · 2a1cfa1 · 2a1cfa1
1 parent 8bb7f02
commit 2a1cfa1
Show file tree

Hide file tree

Showing 3 changed files with 46 additions and 5 deletions.
diff --git a/Calculators/BMI-Calculator/index.html b/Calculators/BMI-Calculator/index.html
@@ -33,9 +33,20 @@ <h1>BMI Calculator</h1>
                 </div>
                 <div class="containerHW">
                     <div class="inputH">
+                        <label for="heightUnit">Height Unit</label>
+                        <select id="heightUnit" onchange="toggleHeightInput()">
+                            <option value="cm">cm</option>
+                            <option value="feet">feet</option>
+                        </select>
+                    </div>
+                    <div class="inputH" id="heightCmInput">
                         <label for="height">Height(cm)</label>
                         <input type="number" id="height" required>
                     </div>
+                    <div class="inputH" id="heightFeetInput" style="display: none;">
+                        <label for="heightFeet">Height(feet)</label>
+                        <input type="number" id="heightFeet" required>
+                    </div>
                     <div class="inputW">
                         <label for="weight">Weight(kg)</label>
                         <input type="number" id="weight" required>

diff --git a/Calculators/BMI-Calculator/script.js b/Calculators/BMI-Calculator/script.js
@@ -15,21 +15,50 @@ var span = document.getElementsByClassName("close")[0];
 // document.querySelector("#result").innerHTML = "00.00";
 
 function calculate() {
+
+    var heightUnit = document.getElementById("heightUnit").value;
+    var heightValue;
+
+    if (heightUnit === "cm") {
+        heightValue = document.getElementById("height").value;
+    } else {
+        var heightFeet = document.getElementById("heightFeet").value;
+        heightValue = convertFeetToCm(heightFeet);
+    }
+
     if (age.value == '' || height.value == '' || weight.value == '' || (male.checked == false && female.checked == false)) {
         modal.style.display = "block";
         modalText.innerHTML = 'ALL fields are required!';
     } else if (!isPositiveNumber(height.value) || !isPositiveNumber(weight.value)) {
         modal.style.display = "block";
         modalText.innerHTML = 'Please enter valid positive values for height and weight!';
     } else {
-        countBmi();
+        countBmi(heightValue);
     }
 }
 function isPositiveNumber(value) {
     return /^\d*\.?\d+$/.test(value) && parseFloat(value) > 0;
 }
-function countBmi() {
-    var p = [age.value, height.value, weight.value];
+function convertFeetToCm(feet) {
+    return (feet * 30.48) ;
+}
+function toggleHeightInput() {
+    var heightUnit = document.getElementById("heightUnit").value;
+    var heightLabel = document.querySelector("label[for='height']");
+
+    if (heightUnit === "cm") {
+        document.getElementById("heightCmInput").style.display = "block";
+        document.getElementById("heightFeetInput").style.display = "none";
+        heightLabel.textContent = "Height(cm)";
+    } else {
+        document.getElementById("heightCmInput").style.display = "none";
+        document.getElementById("heightFeetInput").style.display = "block";
+        heightLabel.textContent = "Height(feet)";
+
+    }
+}
+function countBmi(heightValue) {
+    var p = [age.value, heightValue, weight.value];
     if (male.checked) {
         p.push("male");
     } else if (female.checked) {
@@ -60,7 +89,6 @@ function countBmi() {
 
     resultArea.style.display = "block";
     document.querySelector(".comment").innerHTML = `You are <span id="comment">${result}</span>`;
-    // Update the result only after the calculation
     document.querySelector("#result").innerHTML = bmi.toFixed(2);
 }
 

diff --git a/Calculators/BMI-Calculator/style.css b/Calculators/BMI-Calculator/style.css
@@ -347,4 +347,6 @@ button.calculate:hover {
     .linkDownload {
         display: none;
     }
-}
+}
+
+