Added Inflation Calculator (#1231)

Rakesh9100 · Jun 11, 2024 · 2cd87d9 · 2cd87d9
1 parent 9297f14
commit 2cd87d9
Show file tree

Hide file tree

Showing 6 changed files with 334 additions and 0 deletions.
diff --git a/Calculators/Inflation-Calculator/assets/background.jpg b/Calculators/Inflation-Calculator/assets/background.jpg
diff --git a/Calculators/Inflation-Calculator/data.js b/Calculators/Inflation-Calculator/data.js
@@ -0,0 +1,103 @@
+const inflationData = [
+    {"year": 1973, "rate": 9.0},
+    {"year": 1974, "rate": 26.2},
+    {"year": 1975, "rate": 5.9},
+    {"year": 1976, "rate": 7.3},
+    {"year": 1977, "rate": 7.7},
+    {"year": 1978, "rate": 3.5},
+    {"year": 1979, "rate": 6.3},
+    {"year": 1980, "rate": 18.2},
+    {"year": 1981, "rate": 13.4},
+    {"year": 1982, "rate": 7.9},
+    {"year": 1983, "rate": 11.1},
+    {"year": 1984, "rate": 7.4},
+    {"year": 1985, "rate": 6.5},
+    {"year": 1986, "rate": 8.9},
+    {"year": 1987, "rate": 8.4},
+    {"year": 1988, "rate": 9.7},
+    {"year": 1989, "rate": 7.5},
+    {"year": 1990, "rate": 10.3},
+    {"year": 1991, "rate": 13.9},
+    {"year": 1992, "rate": 11.7},
+    {"year": 1993, "rate": 8.3},
+    {"year": 1994, "rate": 10.2},
+    {"year": 1995, "rate": 10.9},
+    {"year": 1996, "rate": 9.0},
+    {"year": 1997, "rate": 7.2},
+    {"year": 1998, "rate": 13.2},
+    {"year": 1999, "rate": 4.7},
+    {"year": 2000, "rate": 4.0},
+    {"year": 2001, "rate": 3.8},
+    {"year": 2002, "rate": 4.3},
+    {"year": 2003, "rate": 3.8},
+    {"year": 2004, "rate": 3.8},
+    {"year": 2005, "rate": 4.3},
+    {"year": 2006, "rate": 6.6},
+    {"year": 2007, "rate": 6.4},
+    {"year": 2008, "rate": 8.4},
+    {"year": 2009, "rate": 10.9},
+    {"year": 2010, "rate": 12.0},
+    {"year": 2011, "rate": 8.9},
+    {"year": 2012, "rate": 9.3},
+    {"year": 2013, "rate": 10.9},
+    {"year": 2014, "rate": 6.4},
+    {"year": 2015, "rate": 4.9},
+    {"year": 2016, "rate": 5.0},
+    {"year": 2017, "rate": 3.3},
+    {"year": 2018, "rate": 3.9},
+    {"year": 2019, "rate": 4.8},
+    {"year": 2020, "rate": 6.6},
+    {"year": 2021, "rate": 5.5},
+    {"year": 2022, "rate": 6.7},
+    {"year": 2023, "rate": 5.0},
+    {"year": 2024, "rate": 4.8},
+    {"year": 2025, "rate": 4.7},
+    {"year": 2026, "rate": 4.5},
+    {"year": 2027, "rate": 4.4},
+    {"year": 2028, "rate": 4.3},
+    {"year": 2029, "rate": 4.2},
+    {"year": 2030, "rate": 4.1},
+    {"year": 2031, "rate": 4.0},
+    {"year": 2032, "rate": 4.0},
+    {"year": 2033, "rate": 3.9},
+    {"year": 2034, "rate": 3.8},
+    {"year": 2035, "rate": 3.8},
+    {"year": 2036, "rate": 3.7},
+    {"year": 2037, "rate": 3.6},
+    {"year": 2038, "rate": 3.6},
+    {"year": 2039, "rate": 3.5},
+    {"year": 2040, "rate": 3.4},
+    {"year": 2041, "rate": 3.4},
+    {"year": 2042, "rate": 3.3},
+    {"year": 2043, "rate": 3.2},
+    {"year": 2044, "rate": 3.2},
+    {"year": 2045, "rate": 3.1},
+    {"year": 2046, "rate": 3.0},
+    {"year": 2047, "rate": 3.0},
+    {"year": 2048, "rate": 2.9},
+    {"year": 2049, "rate": 2.8},
+    {"year": 2050, "rate": 2.8},
+    {"year": 2051, "rate": 2.7},
+    {"year": 2052, "rate": 2.6},
+    {"year": 2053, "rate": 2.6},
+    {"year": 2054, "rate": 2.5},
+    {"year": 2055, "rate": 2.4},
+    {"year": 2056, "rate": 2.4},
+    {"year": 2057, "rate": 2.3},
+    {"year": 2058, "rate": 2.3},
+    {"year": 2059, "rate": 2.2},
+    {"year": 2060, "rate": 2.1},
+    {"year": 2061, "rate": 2.1},
+    {"year": 2062, "rate": 2.0},
+    {"year": 2063, "rate": 2.0},
+    {"year": 2064, "rate": 1.9},
+    {"year": 2065, "rate": 1.8},
+    {"year": 2066, "rate": 1.8},
+    {"year": 2067, "rate": 1.7},
+    {"year": 2068, "rate": 1.6},
+    {"year": 2069, "rate": 1.6},
+    {"year": 2070, "rate": 1.5},
+    {"year": 2071, "rate": 1.5},
+    {"year": 2072, "rate": 1.4},
+    {"year": 2073, "rate": 1.3}
+]
diff --git a/Calculators/Inflation-Calculator/index.html b/Calculators/Inflation-Calculator/index.html
@@ -0,0 +1,37 @@
+<!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">
+    <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
+    <title>Inflation Calculator</title>
+</head>
+<body>
+    <div class="container">
+        <h1>Inflation Calculator India</h1>
+        <form id="inflation-form">
+            <div class="form-group">
+                <label for="amount">Amount (INR):</label>
+                <input type="number" id="amount" name="amount" required>
+            </div>
+            <div class="form-group">
+                <label for="start-year">Start Year:</label>
+                <input type="number" id="start-year" name="start-year" required>
+            </div>
+            <div class="form-group">
+                <label for="end-year">End Year:</label>
+                <input type="number" id="end-year" name="end-year" required>
+            </div>
+            <button type="button" onclick="calculateInflation()">Calculate</button>
+        </form>
+        <div id="result">
+            <h2>Result</h2>
+            <p id="result-text"></p>
+            <canvas id="inflation-chart" width="400" height="200"></canvas>
+        </div>
+    </div>
+    <script src="data.js"></script>
+    <script src="script.js"></script>
+</body>
+</html>
diff --git a/Calculators/Inflation-Calculator/script.js b/Calculators/Inflation-Calculator/script.js
@@ -0,0 +1,84 @@
+document.getElementById('inflation-form').addEventListener('submit', function(e) {
+    e.preventDefault();
+    calculateInflation();
+});
+
+let chart;
+
+function calculateInflation() {
+    const amount = parseFloat(document.getElementById('amount').value);
+    const startYear = parseInt(document.getElementById('start-year').value);
+    const endYear = parseInt(document.getElementById('end-year').value);
+
+    // Check if inputs are valid
+    if (isNaN(amount) || isNaN(startYear) || isNaN(endYear) || startYear < 1973 || startYear > 2073 || endYear < 1973 || endYear > 2073 || startYear >= endYear) {
+        displayDataNotAvailable();
+        return;
+    }
+
+    // Display a loading spinner
+    const resultText = document.getElementById('result-text');
+    resultText.innerHTML = 'Calculating... <div class="spinner"></div>';
+    document.getElementById('result').style.display = 'block';
+
+    let finalAmount = amount;
+    let yearData = [];
+
+    for (let year = startYear; year < endYear; year++) {
+        const inflationRate = inflationData.find(data => data.year === year).rate / 100;
+        finalAmount += finalAmount * inflationRate;
+        yearData.push({ year, amount: finalAmount });
+    }
+
+    setTimeout(() => {
+        resultText.innerHTML = `
+            The value of ₹${amount.toFixed(2)} in ${startYear} is equivalent to ₹${finalAmount.toFixed(2)} in ${endYear}.
+        `;
+        updateChart(yearData);
+    }, 1000); // Simulate a delay for demonstration
+}
+
+function updateChart(yearData) {
+    const ctx = document.getElementById('inflation-chart').getContext('2d');
+    const labels = yearData.map(data => data.year);
+    const data = yearData.map(data => data.amount);
+
+    if (chart) {
+        chart.destroy();
+    }
+
+    chart = new Chart(ctx, {
+        type: 'line',
+        data: {
+            labels: labels,
+            datasets: [{
+                label: 'Inflation Value Over Time',
+                data: data,
+                backgroundColor: 'rgba(54, 162, 235, 0.2)',
+                borderColor: 'rgba(54, 162, 235, 1)',
+                borderWidth: 1
+            }]
+        },
+        options: {
+            scales: {
+                x: {
+                    beginAtZero: true
+                },
+                y: {
+                    beginAtZero: true
+                }
+            }
+        }
+    });
+}
+
+function displayDataNotAvailable() {
+    const resultText = document.getElementById('result-text');
+    resultText.innerHTML = 'Data not available for the selected years.  \n Please Enter The Valid Year select between 1973 to 2053 ';
+    document.getElementById('result').style.display = 'none';
+    alert("wrong data entered enter year between 1973 and 2053"); 
+
+    if (chart) {
+        chart.destroy();
+    }
+}
diff --git a/Calculators/Inflation-Calculator/style.css b/Calculators/Inflation-Calculator/style.css
@@ -0,0 +1,96 @@
+* {
+    margin: 0;
+    padding: 0;
+    box-sizing: border-box;
+}
+
+body {
+    font-family: Arial, sans-serif;
+    background: url(assets/background.jpg);
+    background-size: cover;
+    background-repeat: no-repeat;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    height: 100vh;
+}
+
+.container {
+    background: white;
+    padding: 20px;
+    border-radius: 10px;
+    box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
+    width: 100%;
+    max-width: 400px;
+}
+
+h1 {
+    text-align: center;
+    margin-bottom: 20px;
+    font-size: 24px;
+}
+
+.form-group {
+    margin-bottom: 15px;
+}
+
+label {
+    display: block;
+    margin-bottom: 5px;
+    font-weight: bold;
+}
+
+input[type="number"] {
+    width: 100%;
+    padding: 10px;
+    border: 1px solid #ccc;
+    border-radius: 5px;
+}
+
+button {
+    width: 100%;
+    padding: 10px;
+    border: none;
+    background-color: #28a745;
+    color: white;
+    border-radius: 5px;
+    font-size: 16px;
+    cursor: pointer;
+    transition: background-color 0.3s ease;
+}
+
+button:hover {
+    background-color: #218838;
+}
+
+#result {
+    margin-top: 20px;
+    text-align: center;
+    display: none;
+}
+
+#result h2 {
+    font-size: 20px;
+    margin-bottom: 10px;
+}
+
+#result-text {
+    font-size: 18px;
+    color: #333;
+}
+
+.spinner {
+    border: 4px solid #f3f3f3;
+    border-top: 4px solid #3498db;
+    border-radius: 50%;
+    width: 20px;
+    height: 20px;
+    animation: spin 1s linear infinite;
+    display: inline-block;
+    margin-left: 10px;
+}
+
+@keyframes spin {
+    0% { transform: rotate(0deg); }
+    100% { transform: rotate(360deg); }
+}
diff --git a/index.html b/index.html
@@ -1576,6 +1576,20 @@ <h3>Converts between infix, prefix and postfix expressions.</h3>
                 </div>
             </div>
         </div>
+        <div class="box">
+            <div class="content">
+                <h2>Inflation Calculator</h2>
+                <h3>Provides the graphical representation and expected inflation of money.</h3>
+                <div class="card-footer">
+                    <a href="./Calculators/Inflation-Calculator/index.html" target="_blank">
+                        <button>Try Now</button>
+                    </a>
+                    <a href="https://github.com/Rakesh9100/CalcDiverse/tree/main/Calculators/Inflation-Calculator" title="Source Code" target="_blank">
+                        <img src="./assets/images/github.png" alt="Source Code"></img>
+                    </a>
+                </div>
+            </div>
+        </div>
         <div class="box">
             <div class="content">
               <h2>Intelligence Calculator</h2>