Eco-Premium (Upfront):
$${premium.toLocaleString()}
Projected 10-Year Savings:
$${(savings * 10).toLocaleString()}
`;
}
function updateChart(baseCost, premium) {
const ctx = document.getElementById('cost-chart').getContext('2d');
const data = {
labels: ['Base Cost', 'Eco-Premium'],
datasets: [{ data: [baseCost, premium], backgroundColor: ['#9ca3af', '#22c55e'] }]
};
if (costChart) {
costChart.data = data;
costChart.update();
} else {
costChart = new Chart(ctx, { type: 'doughnut', data, options: { responsive: true, maintainAspectRatio: false, plugins: { legend: { position: 'bottom' } } } });
}
}
function updateTabs() {
tabs.forEach((tab, i) => tab.classList.toggle('active', i === currentTabIndex));
tabContents.forEach((c, i) => c.classList.toggle('active', i === currentTabIndex));
prevBtn.disabled = currentTabIndex === 0;
nextBtn.disabled = currentTabIndex === tabs.length - 1;
prevBtn.classList.toggle('opacity-50', currentTabIndex === 0);
nextBtn.classList.toggle('opacity-50', currentTabIndex === tabs.length - 1);
}
function setupEventListeners() {
tabsContainer.addEventListener('click', (e) => { if (e.target.classList.contains('tab')) { currentTabIndex = parseInt(e.target.dataset.index); updateTabs(); } });
prevBtn.addEventListener('click', () => { if (currentTabIndex > 0) { currentTabIndex--; updateTabs(); } });
nextBtn.addEventListener('click', () => { if (currentTabIndex < tabs.length - 1) { currentTabIndex++; updateTabs(); } });
document.getElementById('input-sqft').addEventListener('input', calculateAll);
document.querySelectorAll('.option-group').forEach(group => {
group.addEventListener('click', (e) => {
const card = e.target.closest('.option-card');
if (!card) return;
const key = group.dataset.key;
const value = card.dataset.value;
selections[key] = value;
group.querySelectorAll('.option-card').forEach(c => c.classList.remove('selected'));
card.classList.add('selected');
calculateAll();
});
});
// Set initial selected styles
document.querySelectorAll('.option-group').forEach(group => {
group.querySelector('[data-value="standard"]').classList.add('selected');
});
document.getElementById('pdf-download-btn').addEventListener('click', generatePdf);
}
function generatePdf() {
const { jsPDF } = jspdf;
const pdf = new jsPDF();
const pdfContainer = document.createElement('div');
pdfContainer.style.cssText = 'position:absolute; left:-9999px; width:800px; padding:20px; font-family:Inter,sans-serif; color:#1f2937; background:white;';
const chartCanvas = document.getElementById('cost-chart');
const chartImgData = chartCanvas.toDataURL('image/png', 1.0);
let html = `
Eco-Home Cost Analysis
${document.getElementById('summary-container').innerHTML}
`;
pdfContainer.innerHTML = html;
document.body.appendChild(pdfContainer);
html2canvas(pdfContainer, { scale: 2 }).then(canvas => {
const imgData = canvas.toDataURL('image/png');
const { width, height } = pdf.internal.pageSize;
const imgHeight = canvas.height * width / canvas.width;
pdf.addImage(imgData, 'PNG', 0, 0, width, imgHeight);
pdf.save('eco-home-cost-analysis.pdf');
document.body.removeChild(pdfContainer);
});
}
initialize();
});