Merge branch 'main' of https://github.com/TBorundia/CalcDiverse

Rakesh9100 · Aug 10, 2024 · b9474c0 · b9474c0
2 parents 9084c2e + 9c10f22
commit b9474c0
Show file tree

Hide file tree

Showing 26 changed files with 762 additions and 0 deletions.
diff --git a/Calculators/Buoyancy-Calculator/README.md b/Calculators/Buoyancy-Calculator/README.md
@@ -0,0 +1,26 @@
+# Buoyancy Calculator
+
+## Description
+The Buoyancy Calculator is a simple web-based tool that computes the buoyant force exerted on an object submerged in a fluid. The calculation is based on Archimedes' principle, which states that the buoyant force is equal to the weight of the fluid displaced by the object.
+
+## Features
+- Calculates buoyant force using user-provided values for fluid density, object volume, and gravity.
+- Displays the result directly on the web page.
+- Simple and user-friendly interface.
+
+## How to Use
+1. Enter the density of the fluid in kilograms per cubic meter (kg/m³).
+2. Enter the volume of the object in cubic meters (m³).
+3. Enter the acceleration due to gravity in meters per second squared (m/s²), or use the default value of 9.81 m/s².
+4. Click the "Calculate Buoyant Force" button to see the result.
+
+## Files
+- `index.html`: The HTML file that sets up the structure of the calculator.
+- `script.js`: The JavaScript file that contains the logic for calculating the buoyant force.
+- `style.css`: The CSS file for styling the calculator.
+
+## Installation
+To run the Buoyancy Calculator locally:
+1. Clone the repository:
+   ```bash
+   git clone <repository-url>
diff --git a/Calculators/Buoyancy-Calculator/index.html b/Calculators/Buoyancy-Calculator/index.html
@@ -0,0 +1,29 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Buoyancy Calculator</title>
+    <link rel="stylesheet" href="style.css">
+</head>
+<body>
+    <div class="container">
+        <h1>Buoyancy Calculator</h1>
+        <div class="calculator">
+            <label for="density">Density of Fluid (kg/m³):</label>
+            <input type="number" id="density" placeholder="Enter density of fluid">
+
+            <label for="volume">Volume of Object (m³):</label>
+            <input type="number" id="volume" placeholder="Enter volume of object">
+
+            <label for="gravity">Gravity (m/s²):</label>
+            <input type="number" id="gravity" value="9.81">
+
+            <button onclick="calculateBuoyantForce()">Calculate Buoyant Force</button>
+
+            <div id="result"></div>
+        </div>
+    </div>
+    <script src="script.js"></script>
+</body>
+</html>
diff --git a/Calculators/Buoyancy-Calculator/manifest.json b/Calculators/Buoyancy-Calculator/manifest.json
@@ -0,0 +1,22 @@
+{
+    "name": "Buoyancy Calculator",
+    "short_name": "BuoyancyCalc",
+    "description": "A simple web application to calculate the buoyant force on an object submerged in a fluid.",
+    "start_url": "/index.html",
+    "display": "standalone",
+    "background_color": "#ffffff",
+    "theme_color": "#4CAF50",
+    "icons": [
+      {
+        "src": "/images/icons/icon-192x192.png",
+        "sizes": "192x192",
+        "type": "image/png"
+      },
+      {
+        "src": "/images/icons/icon-512x512.png",
+        "sizes": "512x512",
+        "type": "image/png"
+      }
+    ]
+  }
+
diff --git a/Calculators/Buoyancy-Calculator/script.js b/Calculators/Buoyancy-Calculator/script.js
@@ -0,0 +1,14 @@
+function calculateBuoyantForce() {
+    const density = parseFloat(document.getElementById('density').value);
+    const volume = parseFloat(document.getElementById('volume').value);
+    const gravity = parseFloat(document.getElementById('gravity').value) || 9.81;
+
+    if (isNaN(density) || isNaN(volume) || isNaN(gravity)) {
+        document.getElementById('result').innerText = "Please enter valid numbers for all fields.";
+        return;
+    }
+
+    const buoyantForce = density * volume * gravity;
+
+    document.getElementById('result').innerText = `Buoyant Force: ${buoyantForce.toFixed(2)} N`;
+}
diff --git a/Calculators/Buoyancy-Calculator/style.css b/Calculators/Buoyancy-Calculator/style.css
@@ -0,0 +1,62 @@
+body {
+    font-family: Arial, sans-serif;
+    background: linear-gradient(135deg, #263daf, #15e334); /* Add gradient background */
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    height: 100vh;
+    margin: 0;
+}
+
+.container {
+    background-color: #fff;
+    padding: 20px;
+    border-radius: 8px;
+    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
+    max-width: 400px;
+    width: 100%;
+}
+
+h1 {
+    text-align: center;
+    margin-bottom: 20px;
+}
+
+.calculator {
+    display: flex;
+    flex-direction: column;
+}
+
+label {
+    margin-bottom: 8px;
+    font-weight: bold;
+}
+
+input {
+    margin-bottom: 16px;
+    padding: 10px;
+    border: 1px solid #ddd;
+    border-radius: 4px;
+    font-size: 16px;
+}
+
+button {
+    padding: 10px;
+    border: none;
+    background-color: #007bff;
+    color: #fff;
+    font-size: 16px;
+    cursor: pointer;
+    border-radius: 4px;
+}
+
+button:hover {
+    background-color: #0056b3;
+}
+
+#result {
+    margin-top: 20px;
+    font-size: 18px;
+    font-weight: bold;
+    text-align: center;
+}
diff --git a/Calculators/Inductance-calculator/README.md b/Calculators/Inductance-calculator/README.md
@@ -0,0 +1,29 @@
+# Inductance Calculator
+
+## Description
+
+This project is a simple web-based **Inductance Calculator** that allows users to calculate the inductance of a coil based on parameters such as the number of turns, coil diameter, coil length, and core material. It is designed with a user-friendly interface, making it easy to input values and obtain the inductance result quickly.
+
+## Formula Used
+
+The inductance \( L \) of a solenoid is calculated using the following formula:
+
+
+${L}$ = μ$N^2$ ${A/l}$
+
+
+Where:
+- L = Inductance (Henries)
+-N = Number of turns
+- A = Cross-sectional area of the coil 
+- L = Length of the coil
+
+## Tech Stack
+
+- **HTML5**: For structuring the calculator interface.
+- **CSS3**: For styling the page and ensuring a responsive design.
+
+## Screenshot
+
+![alt text](image.png)
+![alt text](image-1.png)
diff --git a/Calculators/Inductance-calculator/image-1.png b/Calculators/Inductance-calculator/image-1.png
diff --git a/Calculators/Inductance-calculator/image.png b/Calculators/Inductance-calculator/image.png
diff --git a/Calculators/Inductance-calculator/index.html b/Calculators/Inductance-calculator/index.html
@@ -0,0 +1,42 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Inductance Calculator</title>
+    <link rel="stylesheet" href="styles.css">
+</head>
+<body>
+    <div class="calculator-container">
+        <h1>Inductance Calculator</h1>
+        <form id="inductanceForm">
+            <label for="turns">Number of Turns (N):</label>
+            <input type="number" id="turns" required>
+
+            <label for="area">Cross-sectional Area (A) in square meters:</label>
+            <input type="number" id="area" step="0.0001" required>
+
+            <label for="length">Length of Coil (l) in meters:</label>
+            <input type="number" id="length" step="0.01" required>
+
+            <button type="button" onclick="calculateInductance()">Calculate Inductance</button>
+        </form>
+        <div class="result" id="result"></div>
+    </div>
+
+    <script>
+        function calculateInductance() {
+            const turns = document.getElementById('turns').value;
+            const area = document.getElementById('area').value;
+            const length = document.getElementById('length').value;
+
+            if (turns && area && length) {
+                const inductance = (Math.pow(turns, 2) * area) / length;
+                document.getElementById('result').innerText = `Inductance: ${inductance.toFixed(4)} H (Henries)`;
+            } else {
+                document.getElementById('result').innerText = 'Please fill out all fields.';
+            }
+        }
+    </script>
+</body>
+</html>
diff --git a/Calculators/Inductance-calculator/styles.css b/Calculators/Inductance-calculator/styles.css
@@ -0,0 +1,61 @@
+body {
+    background-image: url("https://images.unsplash.com/photo-1526112562240-f3c31a27a110?q=80&w=1932&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D");
+    font-family: Arial, sans-serif;
+    background-repeat: no-repeat;
+    background-size: cover;
+    background-position: center;
+    background-color: #f5f5f5;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    height: 100vh;
+    margin: 0;
+}
+
+.calculator-container {
+    backdrop-filter: blur(50px);
+    padding: 20px 30px;
+    color: white;
+    border-radius: 10px;
+    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
+    width: 300px;
+    text-align: center;
+}
+
+h1 {
+    margin-bottom: 20px;
+}
+
+form {
+    display: flex;
+    flex-direction: column;
+    gap: 10px;
+}
+
+label {
+    text-align: left;
+}
+
+input {
+    padding: 10px;
+    border: 1px solid #ddd;
+    border-radius: 5px;
+}
+
+button {
+    padding: 10px;
+    background-color: rgb(197, 62, 0);
+    color: white;
+    border: none;
+    border-radius: 5px;
+    cursor: pointer;
+}
+
+button:hover {
+    background-color: #0056b3;
+}
+
+.result {
+    margin-top: 20px;
+    font-size: 1.2em;
+}
diff --git a/Calculators/Prime-No-Calculator/Prime-No-Calculator.png b/Calculators/Prime-No-Calculator/Prime-No-Calculator.png
diff --git a/Calculators/Prime-No-Calculator/bg.jpg b/Calculators/Prime-No-Calculator/bg.jpg
diff --git a/Calculators/Prime-No-Calculator/default.png b/Calculators/Prime-No-Calculator/default.png
diff --git a/Calculators/Prime-No-Calculator/index.html b/Calculators/Prime-No-Calculator/index.html
@@ -0,0 +1,31 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Prime Number Finder</title>
+    <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/tailwind.min.css" rel="stylesheet">
+    <style>
+        .background-image {
+            background-image: url('bg.jpg');
+            background-size: cover;
+            background-position: center;
+        }
+    </style>
+</head>
+<body class="background-image text-white flex items-center justify-center h-screen">
+    <div class="bg-gray-800 bg-opacity-75 p-10 rounded-lg shadow-lg">
+        <h1 class="text-4xl mb-4 text-center">Prime Number Finder</h1>
+        <p class="text-lg mb-6 text-center">Enter a number to check if it's a prime number.</p>
+        <div class="mb-4">
+            <input id="numberInput" type="number" placeholder="Enter number" class="w-full p-2 rounded-lg text-black">
+        </div>
+        <div class="mb-4 text-center">
+            <button onclick="checkPrime()" class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded">Check</button>
+        </div>
+        <div id="result" class="text-center text-2xl"></div>
+        <img id="resultImage" class="mt-4 mx-auto w-32 h-32 hidden">
+    </div>
+    <script src="script.js"></script>
+</body>
+</html>
diff --git a/Calculators/Prime-No-Calculator/script.js b/Calculators/Prime-No-Calculator/script.js
@@ -0,0 +1,34 @@
+function checkPrime() {
+    const number = document.getElementById('numberInput').value;
+    const resultDiv = document.getElementById('result');
+    const resultImage = document.getElementById('resultImage');
+
+    if (number === '') {
+        resultDiv.innerHTML = 'Please enter a number!';
+        resultImage.classList.add('hidden');
+        return;
+    }
+
+    const num = parseInt(number);
+    if (isPrime(num)) {
+        resultDiv.innerHTML = `${num} is a prime number!`;
+        resultImage.src = 'star.jpg';
+        resultImage.classList.remove('hidden');
+    } else {
+        resultDiv.innerHTML = `${num} is not a prime number.`;
+        resultImage.src = 'skull.jpg';
+        resultImage.classList.remove('hidden');
+    }
+}
+
+function isPrime(num) {
+    if (num <= 1) return false;
+    if (num <= 3) return true;
+
+    if (num % 2 === 0 || num % 3 === 0) return false;
+
+    for (let i = 5; i * i <= num; i += 6) {
+        if (num % i === 0 || num % (i + 2) === 0) return false;
+    }
+    return true;
+}
diff --git a/Calculators/Prime-No-Calculator/skull.jpg b/Calculators/Prime-No-Calculator/skull.jpg
diff --git a/Calculators/Prime-No-Calculator/star.jpg b/Calculators/Prime-No-Calculator/star.jpg
diff --git a/Calculators/Restaurant-Planning-Calculator/README.md b/Calculators/Restaurant-Planning-Calculator/README.md
@@ -0,0 +1,19 @@
+<p align="center">Restaurant Planning Calculator</p>
+
+## Description :-
+
+This Restaurant Planning Calculator helps users efficiently plan their restaurant by calculating the initial and monthly costs based on various inputs such as available space, number of staff, rent, utilities, equipment costs, and salaries.
+
+## Tech Stacks :-
+
+    HTML
+    CSS
+    JavaScript
+
+## Features :-
+
+This Restaurant Planning Calculator helps users efficiently plan their restaurant by calculating the initial and monthly costs based on various inputs such as available space, number of staff, rent, utilities, equipment costs, and salaries. It provides detailed insights on cost management, space optimization, and budget planning. The intuitive interface ensures easy input and clear results, aiding in effective financial planning and resource management for restaurant owners.
+
+## Screenshots :-
+
+![image](https://github.com/user-attachments/assets/1ac11236-403c-4a98-9fbe-111bd4f15c9c)