Merge pull request #2423 from ANKeshri/feat/Ideal-Gas-Calc

add ideal gas calculator
Sulagna-Dutta-Roy · Jul 17, 2024 · 1f070bb · 1f070bb
2 parents e3d5779 + 2be8590
commit 1f070bb
Show file tree

Hide file tree

Showing 6 changed files with 241 additions and 0 deletions.
diff --git a/Ideal Gas Calculator/calc.png b/Ideal Gas Calculator/calc.png
diff --git a/Ideal Gas Calculator/image.jpg b/Ideal Gas Calculator/image.jpg
diff --git a/Ideal Gas Calculator/index.html b/Ideal Gas Calculator/index.html
@@ -0,0 +1,63 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link rel="stylesheet" href="style.css">
+    <title>Ideal Gas Law Calculator</title>
+</head>
+<body>
+    <div class="container">
+        <h1>Ideal Gas Law Calculator</h1>
+        <form id="initialForm">
+            <div class="form-group">
+                <label for="find">What do you want to find?</label>
+                <select id="find" name="find" onchange="showFields()">
+                    <option value="" selected disabled>Select one</option>
+                    <option value="pressure">Pressure (P)</option>
+                    <option value="volume">Volume (V)</option>
+                    <option value="moles">Moles (n)</option>
+                    <option value="temperature">Temperature (T)</option>
+                </select>
+            </div>
+        </form>
+        <form id="gasForm" style="display:none;">
+            <div id="pressureField" class="form-group">
+                <label for="pressure">Pressure (P):</label>
+                <input type="number" id="pressure" name="pressure" step="any">
+                <select id="pressureUnit">
+                    <option value="atm">atm</option>
+                    <option value="pa">Pa</option>
+                    <option value="kpa">kPa</option>
+                    <option value="mmhg">mmHg</option>
+                </select>
+            </div>
+            <div id="volumeField" class="form-group">
+                <label for="volume">Volume (V):</label>
+                <input type="number" id="volume" name="volume" step="any">
+                <select id="volumeUnit">
+                    <option value="liters">liters</option>
+                    <option value="ml">ml</option>
+                    <option value="m3">m³</option>
+                </select>
+            </div>
+            <div id="molesField" class="form-group">
+                <label for="moles">Moles (n):</label>
+                <input type="number" id="moles" name="moles" step="any">
+            </div>
+            <div id="temperatureField" class="form-group">
+                <label for="temperature">Temperature (T):</label>
+                <input type="number" id="temperature" name="temperature" step="any">
+                <select id="temperatureUnit">
+                    <option value="K">K</option>
+                    <option value="C">°C</option>
+                    <option value="F">°F</option>
+                </select>
+            </div>
+            <button type="button" onclick="calculate()">Calculate</button>
+        </form>
+        <div id="result"></div>
+    </div>
+    <script src="script.js"></script>
+</body>
+</html>
diff --git a/Ideal Gas Calculator/manifest.json b/Ideal Gas Calculator/manifest.json
@@ -0,0 +1,16 @@
+{
+    "manifest_version": 3,
+    "name": "Ideal Gas Calculator",
+    "version": "1.0",
+    "description": "An ideal gas calculator computes properties such as pressure, volume, temperature, and moles using the ideal gas law equation (PV = nRT).",
+    "action": {
+        "default_popup": "index.html",
+        "default_icon": "calc.png"
+    },
+    "icons": {
+        "16": "calc.png",
+        "48": "calc.png",
+        "128": "calc.png"
+    },
+    "permissions":[]
+}
diff --git a/Ideal Gas Calculator/script.js b/Ideal Gas Calculator/script.js
@@ -0,0 +1,98 @@
+function showFields() {
+    const find = document.getElementById('find').value;
+    document.getElementById('gasForm').style.display = 'block';
+
+    // Hide all fields initially
+    document.getElementById('pressureField').style.display = 'none';
+    document.getElementById('volumeField').style.display = 'none';
+    document.getElementById('molesField').style.display = 'none';
+    document.getElementById('temperatureField').style.display = 'none';
+
+    // Show the appropriate fields based on what the user wants to find
+    if (find === 'pressure') {
+        document.getElementById('volumeField').style.display = 'block';
+        document.getElementById('molesField').style.display = 'block';
+        document.getElementById('temperatureField').style.display = 'block';
+    } else if (find === 'volume') {
+        document.getElementById('pressureField').style.display = 'block';
+        document.getElementById('molesField').style.display = 'block';
+        document.getElementById('temperatureField').style.display = 'block';
+    } else if (find === 'moles') {
+        document.getElementById('pressureField').style.display = 'block';
+        document.getElementById('volumeField').style.display = 'block';
+        document.getElementById('temperatureField').style.display = 'block';
+    } else if (find === 'temperature') {
+        document.getElementById('pressureField').style.display = 'block';
+        document.getElementById('volumeField').style.display = 'block';
+        document.getElementById('molesField').style.display = 'block';
+    }
+}
+
+function calculate() {
+    const R = 0.0821; // Ideal gas constant in L·atm/(K·mol)
+    const find = document.getElementById('find').value;
+
+    let pressure = parseFloat(document.getElementById('pressure').value);
+    const pressureUnit = document.getElementById('pressureUnit').value;
+    let volume = parseFloat(document.getElementById('volume').value);
+    const volumeUnit = document.getElementById('volumeUnit').value;
+    const moles = parseFloat(document.getElementById('moles').value);
+    let temperature = parseFloat(document.getElementById('temperature').value);
+    const temperatureUnit = document.getElementById('temperatureUnit').value;
+
+    if (temperatureUnit === 'C') {
+        temperature += 273.15; // Convert Celsius to Kelvin
+    } else if (temperatureUnit === 'F') {
+        temperature = (temperature - 32) * 5/9 + 273.15; // Convert Fahrenheit to Kelvin
+    }
+
+    if (volumeUnit === 'ml') {
+        volume /= 1000; // Convert milliliters to liters
+    } else if (volumeUnit === 'm3') {
+        volume *= 1000; // Convert cubic meters to liters
+    }
+
+    if (pressureUnit === 'pa') {
+        pressure /= 101325; // Convert Pascals to atm
+    } else if (pressureUnit === 'kpa') {
+        pressure /= 101.325; // Convert kPa to atm
+    } else if (pressureUnit === 'mmhg') {
+        pressure /= 760; // Convert mmHg to atm
+    }
+
+    let result;
+
+    if (find === 'pressure') {
+        if (volume && moles && temperature) {
+            result = (moles * R * temperature) / volume;
+            displayResult(`Pressure (P) = ${result.toFixed(2)} atm`);
+        } else {
+            displayResult("Please fill in Volume, Moles, and Temperature.");
+        }
+    } else if (find === 'volume') {
+        if (pressure && moles && temperature) {
+            result = (moles * R * temperature) / pressure;
+            displayResult(`Volume (V) = ${result.toFixed(2)} liters`);
+        } else {
+            displayResult("Please fill in Pressure, Moles, and Temperature.");
+        }
+    } else if (find === 'moles') {
+        if (pressure && volume && temperature) {
+            result = (pressure * volume) / (R * temperature);
+            displayResult(`Moles (n) = ${result.toFixed(2)}`);
+        } else {
+            displayResult("Please fill in Pressure, Volume, and Temperature.");
+        }
+    } else if (find === 'temperature') {
+        if (pressure && volume && moles) {
+            result = (pressure * volume) / (moles * R);
+            displayResult(`Temperature (T) = ${result.toFixed(2)} K`);
+        } else {
+            displayResult("Please fill in Pressure, Volume, and Moles.");
+        }
+    }
+}
+
+function displayResult(message) {
+    document.getElementById('result').textContent = message;
+}
diff --git a/Ideal Gas Calculator/style.css b/Ideal Gas Calculator/style.css
@@ -0,0 +1,64 @@
+body {
+    font-family: Arial, sans-serif;
+    background: url('image.jpg') no-repeat center center fixed;
+    background-size: cover;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    height: 100vh;
+    margin: 0;
+}
+
+.container {
+    background: rgba(0,0,0,0.7);
+    padding: 20px;
+    border-radius: 8px;
+    box-shadow: 0 0 10px rgba(255, 255, 255, 0.5);
+    width: 50%;
+}
+
+h1 {
+    text-align: center;
+    margin-bottom: 20px;
+    color: white;
+}
+
+.form-group {
+    margin-bottom: 15px;
+}
+
+label {
+    display: block;
+    margin-bottom: 5px;
+    color: white;
+}
+
+input, select {
+    width: 100%;
+    padding: 8px;
+    box-sizing: border-box;
+    margin-bottom: 5px;
+    background: rgba(255, 255, 255, 0.8);
+}
+
+button {
+    width: 100%;
+    padding: 10px;
+    background-color: #007bff;
+    border: none;
+    color: white;
+    font-size: 16px;
+    cursor: pointer;
+    border-radius: 4px;
+}
+
+button:hover {
+    background-color: #0056b3;
+}
+
+#result {
+    margin-top: 20px;
+    text-align: center;
+    font-size: 18px;
+    color: white;
+}