MMCT TEAM
Server IP : 162.214.80.37  /  Your IP : 216.73.216.83
Web Server : Apache
System : Linux sh013.webhostingservices.com 4.19.286-203.ELK.el7.x86_64 #1 SMP Wed Jun 14 04:33:55 CDT 2023 x86_64
User : imyrqtmy ( 2189)
PHP Version : 8.2.18
Disable Function : NONE
MySQL : OFF  |  cURL : ON  |  WGET : ON  |  Perl : ON  |  Python : ON
Directory (0755) :  /home2/imyrqtmy/public_html/moryanew/include/

[  Home  ][  C0mmand  ][  Upload File  ]

Current File : /home2/imyrqtmy/public_html/moryanew/include/loanc.php
<html>
<head>
  <meta charset="utf-8" />
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <title>Loan Calculator</title>
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm"
  crossorigin="anonymous">
  <link rel="stylesheet" type="text/css" media="screen" href="css/style.css" />
</head>
<style>
    #loading, #results {
  display: none;
}
</style>
<body class="">
  <div class="container">
    <div class="row">
        <div class="col-md-6">

             <img src="assets/images/Finance-Guru-Personal-Loan-7.webp" class="limg" style="    ">


        </div>
      <div class="col-md-6">
        <div class="card card-body text-center mt-5">
          <h1 class="heading display-5 pb-3">
            Loan Calculator
          </h1>
          <form id="loan-form">
            <div class="form-group">
              <div class="input-group">
                <div class="input-group-prepend">
                  <span class="input-group-text">$</span>
                </div>
                <input type="number" class="form-control" id="amount" placeholder="Loan Amount">
              </div>
            </div>
            <div class="form-group">
              <div class="input-group">
                <div class="input-group-prepend">
                  <span class="input-group-text">%</span>
                </div>
                <input type="number" class="form-control" id="interest" placeholder="Interest">
              </div>
            </div>
            <div class="form-group">
              <input type="number" class="form-control" id="years" placeholder="Years To Repay">
            </div>
            <div class="form-group">
              <input type="submit" value="Calculate" class="btn btn-dark btn-block" id="calc-btn">
            </div>
          </form>

          <div id="loading">
            <img src="https://github.com/Confidence-Okoghenun/Loan-Calculator/blob/master/img/loading.gif?raw=true" alt="loading...">
          </div>

          <div id="results" class="pt-4">
            <h5>Results</h5>
            <div class="form-group">
              <div class="input-group">
                <div class="input-group-prepend">
                  <span class="input-group-text">Monthly Payment</span>
                </div>
                <input type="number" class="form-control" id="monthly-payment" disabled>
              </div>
            </div>

            <div class="form-group">
              <div class="input-group">
                <div class="input-group-prepend">
                  <span class="input-group-text">Total Payment</span>
                </div>
                <input type="number" class="form-control" id="total-payment" disabled>
              </div>
            </div>

            <div class="form-group">
              <div class="input-group">
                <div class="input-group-prepend">
                  <span class="input-group-text">Total Interest</span>
                </div>
                <input type="number" class="form-control" id="total-interest" disabled>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
  <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN"
    crossorigin="anonymous"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q"
    crossorigin="anonymous"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl"
  crossorigin="anonymous"></script>
  <script src="js/main.js"></script>
  
  <script>
        
let
  loanForm = document.querySelector('#loan-form'),
  amount = document.querySelector('#amount'),
  interest = document.querySelector('#interest'),
  years = document.querySelector('#years'),
  calcBtn = document.querySelector('#calc-btn'),
  loadingGif = document.querySelector('#loading'),
  monthlyPayment = document.querySelector('#monthly-payment'),
  totalPayment = document.querySelector('#total-payment'),
  totalInterest = document.querySelector('#total-interest');

calcBtn.addEventListener('click', (e) => {
  document.querySelector('#results').style.display = 'none';
  e.preventDefault();
  if(amount.value&&interest.value&&years.value) {
    let principal = parseFloat(amount.value),
    calculatedInterest = parseFloat(interest.value)/100/12,
    calculatedPayments =  parseFloat(years.value)*12;


    let  x = Math.pow(1 + calculatedInterest, calculatedPayments),
    monthly = (principal * x * calculatedInterest)/(x - 1);

    if(isFinite(monthly)) {
      loadingGif.style.display = 'block';
      setTimeout(() => {
        loadingGif.style.display = 'none';

        monthlyPayment.value = monthly.toFixed(2);
        totalPayment.value = (monthly * calculatedPayments).toFixed(2);
        totalInterest.value = ((monthly * calculatedPayments) - principal).toFixed(2);
        document.querySelector('#results').style.display = 'block';
      }, 2000)
    } else {
      showError('Please enter finite values');
    }
  } else {
    loadingGif.style.display = 'block';
    setTimeout(() => {
      loadingGif.style.display = 'none';
      showError('Please check your numbers');
    }, 2000)
  }
  
})

function showError(error) {
  let errorAlert = document.createElement('div');
  errorAlert.className = 'alert alert-danger';
  errorAlert.setAttribute('role', 'alert');
  errorAlert.textContent = error;

  loanForm.insertAdjacentElement('afterbegin', errorAlert)
  setTimeout(() => errorAlert.remove(), 3000)
}
  </script>
</body>
</html>

MMCT - 2023