`; contentExists = true; } }); if (sectionContent) { sectionDiv.innerHTML = `

${section.title}

${sectionContent}`; summaryContainer.appendChild(sectionDiv); } }); if (!contentExists) { summaryContainer.innerHTML = '

Go back and fill in some details to see your world summary here.

'; } }; const downloadPDF = () => { const { jsPDF } = window.jspdf; const doc = new jsPDF({ orientation: 'p', unit: 'pt', format: 'a4' }); const theme = document.querySelector('input[name="theme"]:checked').value; const data = allInputs.reduce((acc, input) => { acc[input.id] = input.value; return acc; }, {}); // PDF Theme setup let pageBg, primaryColor, secondaryColor, accentColor, titleFont, bodyFont; if (theme === 'field_notes') { pageBg = '#F5F1E9'; primaryColor = '#3A2E2A'; secondaryColor = '#5A4A43'; accentColor = '#8A6F5E'; titleFont = 'courier'; bodyFont = 'times'; } else { // dossier pageBg = '#FFFFFF'; primaryColor = '#111827'; secondaryColor = '#374151'; accentColor = '#2563EB'; titleFont = 'helvetica'; bodyFont = 'helvetica'; } const page = { width: doc.internal.pageSize.getWidth(), height: doc.internal.pageSize.getHeight() }; const margin = 50; let y = 0; const addPageWithBackground = () => { doc.addPage(); doc.setFillColor(pageBg); doc.rect(0, 0, page.width, page.height, 'F'); }; const checkY = (spaceNeeded) => { if (y + spaceNeeded > page.height - margin) { addPageWithBackground(); y = margin; } }; // Initial page background doc.setFillColor(pageBg); doc.rect(0, 0, page.width, page.height, 'F'); // Header y = margin; doc.setFont(titleFont, 'bold'); doc.setFontSize(24); doc.setTextColor(primaryColor); doc.text('WORLD DOSSIER:', margin, y); doc.setFontSize(20); doc.setTextColor(accentColor); doc.text(data.planetName || 'UNTITLED WORLD', page.width - margin, y, { align: 'right' }); y += 30; doc.setDrawColor(secondaryColor); doc.setLineWidth(1); doc.line(margin, y, page.width - margin, y); y += 10; const addSection = (title, fields) => { checkY(40); y += 25; doc.setFont(titleFont, 'bold'); doc.setFontSize(14); doc.setTextColor(primaryColor); doc.text(title, margin, y); y += 5; doc.setDrawColor(accentColor); doc.line(margin, y, margin + 150, y); y += 20; fields.forEach(fieldId => { const el = document.getElementById(fieldId); const val = el ? el.value : ''; if (val) { const label = document.querySelector(`label[for=${fieldId}]`).textContent; doc.setFont(bodyFont, 'bold'); doc.setFontSize(10); doc.setTextColor(secondaryColor); const labelLines = doc.splitTextToSize(label, page.width - margin * 2); checkY(labelLines.length * 12 + 20); doc.text(label, margin, y); y += 12; doc.setFont(bodyFont, 'normal'); doc.setFontSize(10); doc.setTextColor(primaryColor); const valueLines = doc.splitTextToSize(val, page.width - margin * 2); checkY(valueLines.length * 12 + 15); doc.text(valueLines, margin, y); y += valueLines.length * 12 + 10; } }); }; addSection("PLANETARY PROFILE", ["starSystem", "suns", "moons", "planetType", "atmosphere", "climate", "landmarks"]); addSection("SOCIETY & CULTURE", ["speciesName", "speciesDescription", "governmentType", "societalValues", "culturalNotes"]); addSection("TECHNOLOGICAL OVERVIEW", ["techTier", "powerSource", "ftlMethod", "keyTech", "weaponry"]); doc.save(`${data.planetName || 'SciFi-World'}-Dossier.pdf`); }; // Event Listeners tabs.forEach((tab, index) => tab.addEventListener('click', () => showTab(index))); prevBtn.addEventListener('click', () => navigateTab(-1)); nextBtn.addEventListener('click', () => navigateTab(1)); downloadPdfBtn.addEventListener('click', downloadPDF); // Initialization showTab(0); tabs.forEach(t => t.classList.remove('text-gray-500')); // ensure correct initial color tabs[0].classList.add('text-blue-400', 'border-blue-500'); });