| 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">
<style>
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
-webkit-appearance: none;
margin: 0;
}
input[type="number"] {
-moz-appearance: textfield;
}
</style>
</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="months" class="form-label">Number of Months</label>
<input type="number" class="form-control" id="months" value="24" required>
</div>
<div class="col-12">
<button type="submit" class="btn btn-primary mt-3">Generate Schedule</button>
<button type="button" class="btn btn-success mt-3 ms-2" id="downloadCSV">Export CSV</button>
</div>
</div>
</form>
<div id="scheduleTable"></div>
</div>
<script>
let amortizationData = [];
function recalculateFromInputs() {
for (let i = 0; i < amortizationData.length; i++) {
const payment1 = parseFloat(document.getElementById(`pay1_${i}`).value) || 0;
const payment2 = parseFloat(document.getElementById(`pay2_${i}`).value) || 0;
let entry = amortizationData[i];
const interest1 = +(entry.balance1 * entry.rate).toFixed(2);
const interest2 = +(entry.balance2 * entry.rate).toFixed(2);
let principal1 = Math.max(0, payment1 - interest1);
let principal2 = Math.max(0, payment2 - interest2);
principal1 = Math.min(principal1, entry.balance1);
principal2 = Math.min(principal2, entry.balance2);
entry.interest1 = interest1;
entry.interest2 = interest2;
entry.principal1 = principal1;
entry.principal2 = principal2;
entry.balance1 = +(entry.balance1 - principal1).toFixed(2);
entry.balance2 = +(entry.balance2 - principal2).toFixed(2);
if (i < amortizationData.length - 1) {
amortizationData[i + 1].balance1 = entry.balance1;
amortizationData[i + 1].balance2 = entry.balance2;
}
}
renderTable();
}
function renderTable() {
let output = `
<table class="table table-bordered table-striped table-sm mt-4">
<thead class="table-light">
<tr>
<th>Month</th>
<th>Interest 1</th>
<th>Interest 2</th>
<th>Principal 1</th>
<th>Principal 2</th>
<th>Payment 1</th>
<th>Payment 2</th>
<th>Balance 1</th>
<th>Balance 2</th>
</tr>
</thead>
<tbody>
`;
amortizationData.forEach((row, index) => {
output += `
<tr>
<td>${row.month}</td>
<td>$${row.interest1}</td>
<td>$${row.interest2}</td>
<td>$${row.principal1}</td>
<td>$${row.principal2}</td>
<td><input type="number" id="pay1_${index}" value="${(row.interest1 + row.principal1).toFixed(2)}" step="0.01" class="form-control form-control-sm"></td>
<td><input type="number" id="pay2_${index}" value="${(row.interest2 + row.principal2).toFixed(2)}" step="0.01" class="form-control form-control-sm"></td>
<td>$${row.balance1}</td>
<td>$${row.balance2}</td>
</tr>
`;
});
output += `</tbody></table>
<button class="btn btn-warning mb-3" onclick="recalculateFromInputs()">Recalculate with Inputs</button>
`;
document.getElementById('scheduleTable').innerHTML = output;
}
document.getElementById('helocForm').addEventListener('submit', function (e) {
e.preventDefault();
amortizationData = [];
let total = parseFloat(document.getElementById('totalBalance').value);
let party2 = parseFloat(document.getElementById('party2Balance').value);
let party1 = total - party2;
const apr = parseFloat(document.getElementById('apr').value);
const months = parseInt(document.getElementById('months').value);
const monthlyRate = apr / 12 / 100;
for (let i = 0; i < months; i++) {
if (party1 <= 0 && party2 <= 0) break;
const interest1 = +(party1 * monthlyRate).toFixed(2);
const interest2 = +(party2 * monthlyRate).toFixed(2);
const balance1 = party1;
const balance2 = party2;
let totalPayment = 479.93; // default
let totalPrincipal = totalPayment - (interest1 + interest2);
const principal1 = +(totalPrincipal * (party1 / (party1 + party2))).toFixed(2);
const principal2 = +(totalPrincipal * (party2 / (party1 + party2))).toFixed(2);
party1 = +(party1 - principal1).toFixed(2);
party2 = +(party2 - principal2).toFixed(2);
amortizationData.push({
month: i + 1,
interest1,
interest2,
principal1,
principal2,
balance1,
balance2,
rate: monthlyRate
});
}
renderTable();
});
document.getElementById('downloadCSV').addEventListener('click', function () {
if (!amortizationData.length) return;
let csv = 'Month,Interest 1,Interest 2,Principal 1,Principal 2,Payment 1,Payment 2,Balance 1,Balance 2\n';
amortizationData.forEach((row, i) => {
const pay1 = parseFloat(document.getElementById(`pay1_${i}`).value);
const pay2 = parseFloat(document.getElementById(`pay2_${i}`).value);
csv += `${row.month},${row.interest1},${row.interest2},${row.principal1},${row.principal2},${pay1},${pay2},${row.balance1},${row.balance2}\n`;
});
const blob = new Blob([csv], { type: 'text/csv' });
const url = URL.createObjectURL(blob);
const a = document.createElement('a');
a.href = url;
a.download = 'heloc_amortization_adjustable.csv';
a.click();
URL.revokeObjectURL(url);
});
</script>
</body>
</html>