Please select valid aircraft for both airlines.
';
if(comparisonChart) comparisonChart.destroy();
return;
}
const pitch1 = legroomData.seatPitch[airline1Id][aircraft1Id];
const pitch2 = legroomData.seatPitch[airline2Id][aircraft2Id];
const airline1Name = legroomData.airlines.find(a => a.id === airline1Id).name;
const aircraft1Name = legroomData.aircrafts.find(a => a.id === aircraft1Id).name;
const airline2Name = legroomData.airlines.find(a => a.id === airline2Id).name;
const aircraft2Name = legroomData.aircrafts.find(a => a.id === aircraft2Id).name;
renderResults(pitch1, pitch2);
updateChart(`${airline1Name} (${aircraft1Name})`, pitch1, `${airline2Name} (${aircraft2Name})`, pitch2);
}
function renderResults(pitch1, pitch2) {
const difference = pitch1 - pitch2;
let summaryText = `The two flights have the same amount of legroom.`;
if (difference > 0) {
summaryText = `Option 1 has
${difference}" more legroom.`;
} else if (difference < 0) {
summaryText = `Option 2 has
${Math.abs(difference)}" more legroom.`;
}
resultsContent.innerHTML = `
Option 1 Legroom
${pitch1}"
Option 2 Legroom
${pitch2}"
`;
}
function updateChart(label1, value1, label2, value2) {
const ctx = document.getElementById('comparisonChart').getContext('2d');
if (comparisonChart) {
comparisonChart.destroy();
}
comparisonChart = new Chart(ctx, {
type: 'bar',
data: {
labels: [label1, label2],
datasets: [{
label: 'Seat Pitch (inches)',
data: [value1, value2],
backgroundColor: ['var(--primary-color)', 'var(--secondary-color)'],
borderWidth: 1
}]
},
options: {
scales: { y: { beginAtZero: true, suggestedMax: 35 } },
plugins: { legend: { display: false } }
}
});
}
function renderConfigTable() {
let tableHTML = `
';
configTableContainer.innerHTML = tableHTML;
}
window.updateConfig = function(element) {
const { airline, aircraft } = element.dataset;
const value = parseFloat(element.value);
if (isNaN(value)) return;
legroomData.seatPitch[airline][aircraft] = value;
compareLegroom();
}
// --- TAB & NAVIGATION ---
window.openTab = function(evt, tabName) {
const tabContents = document.getElementsByClassName("tab-content");
Array.from(tabContents).forEach(tab => tab.style.display = "none");
const tabButtons = document.getElementsByClassName("tab-btn");
Array.from(tabButtons).forEach(btn => btn.classList.remove("active"));
document.getElementById(tabName).style.display = "block";
if (evt) {
evt.currentTarget.classList.add("active");
} else {
const btnToActivate = Array.from(tabButtons).find(btn => btn.getAttribute('onclick').includes(`'${tabName}'`));
if (btnToActivate) btnToActivate.classList.add("active");
}
updateNavButtons();
}
window.navigateTabs = function(direction) {
const tabs = Array.from(document.querySelectorAll('.tab-btn'));
const activeTabIndex = tabs.findIndex(tab => tab.classList.contains('active'));
let newIndex = (direction === 'next')
? (activeTabIndex + 1) % tabs.length
: (activeTabIndex - 1 + tabs.length) % tabs.length;
tabs[newIndex].click();
}
function updateNavButtons() {
const tabs = Array.from(document.querySelectorAll('.tab-btn'));
const activeTabIndex = tabs.findIndex(tab => tab.classList.contains('active'));
document.getElementById('prev-btn').style.visibility = activeTabIndex === 0 ? 'hidden' : 'visible';
document.getElementById('next-btn').style.visibility = activeTabIndex === tabs.length - 1 ? 'hidden' : 'visible';
}
// --- PDF DOWNLOAD ---
if(downloadPdfBtn) {
downloadPdfBtn.addEventListener('click', function() {
const { jsPDF } = window.jspdf;
const contentToDownload = document.getElementById('results-to-download');
if (!contentToDownload || !document.querySelector('.value')) {
console.warn("Please generate a comparison before downloading.");
return;
}
const originalButtonText = downloadPdfBtn.innerHTML;
downloadPdfBtn.innerHTML = 'Generating...';
downloadPdfBtn.disabled = true;
html2canvas(contentToDownload, { scale: 2, useCORS: true }).then(canvas => {
const imgData = canvas.toDataURL('image/png');
const pdf = new jsPDF({ orientation: 'p', unit: 'mm', format: 'a4' });
const pdfWidth = pdf.internal.pageSize.getWidth();
const imgProps = pdf.getImageProperties(imgData);
const imgHeight = (imgProps.height * pdfWidth) / imgProps.width;
pdf.addImage(imgData, 'PNG', 10, 10, pdfWidth - 20, imgHeight > 0 ? imgHeight - 20 : 0);
pdf.save('Legroom-Comparison.pdf');
}).catch(err => {
console.error("Error generating PDF:", err);
}).finally(() => {
downloadPdfBtn.innerHTML = originalButtonText;
downloadPdfBtn.disabled = false;
});
});
}
// --- INITIALIZATION ---
function initializeTool() {
populateAirlines();
populateAircraft(1);
populateAircraft(2);
compareLegroom();
renderConfigTable();
updateNavButtons();
}
initializeTool();
});