Smart Payment Splitter Tool
Easily split bills, tax, and tip, even with uneven amounts.
Subtotal
${formatCurrency(result.subtotal)}
Tax
${formatCurrency(result.taxAmount)}
Tip
${formatCurrency(result.tipAmount)}
Total
${formatCurrency(result.grandTotal)}
${result.splitResults.map(p => `
`).join('')}
`;
};
const attachSplitterListeners = () => {
const triggerUpdate = () => {
splitterState.billSubtotal = parseFloat(document.getElementById('bill-subtotal').value) || 0;
splitterState.taxValue = parseFloat(document.getElementById('tax-value').value) || 0;
updateResults();
};
document.getElementById('bill-subtotal').addEventListener('input', triggerUpdate);
document.getElementById('tax-value').addEventListener('input', triggerUpdate);
document.getElementById('tax-type-toggle').addEventListener('change', (e) => {
splitterState.taxType = e.target.checked ? 'fixed' : 'percentage';
renderSplitter();
});
document.getElementById('tip-buttons').addEventListener('click', (e) => {
if (e.target.classList.contains('tip-btn')) {
splitterState.tipPercentage = parseInt(e.target.textContent);
document.querySelectorAll('.tip-btn').forEach(btn => btn.classList.remove('bg-violet-600', 'text-white'));
e.target.classList.add('bg-violet-600', 'text-white');
updateResults();
}
});
document.getElementById('participants-container').addEventListener('input', (e) => {
const index = parseInt(e.target.dataset.index);
if (e.target.classList.contains('participant-name')) {
splitterState.participants[index].name = e.target.value;
} else if (e.target.classList.contains('participant-individual-amount')) {
splitterState.participants[index].individualAmount = parseFloat(e.target.value) || 0;
}
updateResults();
});
document.getElementById('add-participant-btn').addEventListener('click', () => {
splitterState.participants.push({ name: `Person ${splitterState.participants.length + 1}`, individualAmount: 0 });
renderSplitter();
});
document.getElementById('participants-container').addEventListener('click', (e) => {
const removeBtn = e.target.closest('.remove-participant-btn');
if (removeBtn && splitterState.participants.length > 1) {
const index = parseInt(removeBtn.dataset.index);
splitterState.participants.splice(index, 1);
renderSplitter();
}
});
document.getElementById('download-pdf-btn').addEventListener('click', generatePdf);
};
const renderDataConfig = () => {
const configContent = document.getElementById('content-config');
if (!configContent) return;
configContent.innerHTML = `
${p.name}
${formatCurrency(p.personTotal)}
Bill: ${formatCurrency(p.personSubtotal)}
Tax: ${formatCurrency(p.personTax)}
Tip: ${formatCurrency(p.personTip)}