| Server IP : 173.209.174.21 / Your IP : 216.73.216.89 Web Server : Apache/2.4.58 (Ubuntu) System : Linux wcfs-server 6.8.0-124-generic #124-Ubuntu SMP PREEMPT_DYNAMIC Tue May 26 13:00:45 UTC 2026 x86_64 User : nodor ( 1000) PHP Version : 8.3.6 Disable Function : NONE MySQL : OFF | cURL : ON | WGET : ON | Perl : ON | Python : OFF | Sudo : ON | Pkexec : OFF Directory : /var/www/wcfs/Schedule/ |
Upload File : |
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>HELOC Amortization Calculator</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
</head>
<body class="bg-light p-4">
<div class="container">
<h2 class="mb-4">HELOC Amortization Schedule</h2>
<form id="helocForm" class="mb-4">
<div class="row g-3">
<div class="col-md-6">
<label for="totalBalance" class="form-label">Total HELOC Balance</label>
<input type="number" class="form-control" id="totalBalance" step="0.01" required>
</div>
<div class="col-md-6">
<label for="party2Balance" class="form-label">Party 2's Share</label>
<input type="number" class="form-control" id="party2Balance" step="0.01" required>
</div>
<div class="col-md-6">
<label for="apr" class="form-label">APR (%)</label>
<input type="number" class="form-control" id="apr" step="0.01" required>
</div>
<div class="col-md-6">
<label for="monthlyPayment" class="form-label">Monthly Payment</label>
<input type="number" class="form-control" id="monthlyPayment" step="0.01" required>
</div>
<div class="col-md-6">
<label for="months" class="form-label">Number of Months</label>
<input type="number" class="form-control" id="months" value="24" required>
</div>
<div class="col-md-12">
<button type="submit" class="btn btn-primary mt-3">Calculate</button>
</div>
</div>
</form>
<div id="scheduleTable"></div>
</div>
<script>
document.addEventListener('DOMContentLoaded', function () {
document.getElementById('helocForm').addEventListener('submit', function (e) {
e.preventDefault();
let total = parseFloat(document.getElementById('totalBalance').value);
let party2 = parseFloat(document.getElementById('party2Balance').value);
const apr = parseFloat(document.getElementById('apr').value);
const monthlyRate = apr / 12 / 100;
const payment = parseFloat(document.getElementById('monthlyPayment').value);
const months = parseInt(document.getElementById('months').value);
let party1 = total - party2;
let output = `
<table class="table table-bordered table-striped table-sm mt-4">
<thead class="table-light">
<tr>
<th>Month</th>
<th>Party 1 Interest</th>
<th>Party 2 Interest</th>
<th>Party 1 Principal</th>
<th>Party 2 Principal</th>
<th>Party 1 Balance</th>
<th>Party 2 Balance</th>
</tr>
</thead>
<tbody>
`;
for (let i = 1; i <= months; i++) {
const interest1 = +(party1 * monthlyRate).toFixed(2);
const interest2 = +(party2 * monthlyRate).toFixed(2);
const totalInterest = interest1 + interest2;
let principal = +(payment - totalInterest).toFixed(2);
// Avoid negative principal if interest is greater than payment
if (principal < 0) principal = 0;
const totalBalance = party1 + party2;
let principal1 = +(principal * (party1 / totalBalance)).toFixed(2);
let principal2 = +(principal * (party2 / totalBalance)).toFixed(2);
// Avoid overpayment
principal1 = Math.min(principal1, party1);
principal2 = Math.min(principal2, party2);
party1 = +(party1 - principal1).toFixed(2);
party2 = +(party2 - principal2).toFixed(2);
output += `
<tr>
<td>${i}</td>
<td>$${interest1}</td>
<td>$${interest2}</td>
<td>$${principal1}</td>
<td>$${principal2}</td>
<td>$${party1}</td>
<td>$${party2}</td>
</tr>
`;
}
output += '</tbody></table>';
document.getElementById('scheduleTable').innerHTML = output;
});
});
</script>
</body>
</html>