Commonly Known As: ${tribe.name}

` : ''}

Historical Region: ${tribe.historicalRegion}

Current Land Base: ${tribe.currentLandInfo}

Language Family (General): ${tribe.languageFamily}

About the Nation:

${tribe.briefInfo}

${tribe.officialWebsite ? `

Official Website: ${tribe.officialWebsite}

` : ''} `; updateMapForTribe(tribe); } function clearMapMarker() { if (currentMapMarker) { map.removeLayer(currentMapMarker); currentMapMarker = null; } } function updateMapForTribe(tribe) { clearMapMarker(); if (!tribe || !tribe.mapMarker) return; const markerColor = getComputedStyle(document.documentElement).getPropertyValue('--marker-color').trim(); currentMapMarker = L.circleMarker(tribe.mapMarker, { radius: 8, fillColor: markerColor, color: '#333', // Darker border for marker for better visibility on light maps weight: 1.5, opacity: 1, fillOpacity: 0.8 }).addTo(map); currentMapMarker.bindPopup(`${tribe.officialName || tribe.name}
Approx. Location`).openPopup(); map.setView(tribe.mapMarker, 6); } tribeSelect.addEventListener('change', function() { const selectedTribeId = this.value; const tribe = tribesDataset.find(t => t.id === selectedTribeId); displayTribeInfo(tribe); }); downloadPdfBtn.addEventListener('click', async () => { if (!currentTribeData) { alert("Please select a tribal nation first to generate a PDF."); return; } const { jsPDF } = window.jspdf; const doc = new jsPDF('p', 'pt', 'a4'); const timestamp = new Date().toLocaleString(); const tribe = currentTribeData; let yPos = 70; const titleColorHex = getComputedStyle(document.documentElement).getPropertyValue('--accent-color').trim(); const textColorHex = getComputedStyle(document.documentElement).getPropertyValue('--text-color').trim(); const headerBgColorHex = getComputedStyle(document.documentElement).getPropertyValue('--secondary-bg').trim(); function hexToRgb(hex) { let r = 0, g = 0, b = 0; if (hex.length == 4) { // #RGB r = parseInt(hex[1] + hex[1], 16); g = parseInt(hex[2] + hex[2], 16); b = parseInt(hex[3] + hex[3], 16); } else if (hex.length == 7) { // #RRGGBB r = parseInt(hex.substring(1, 3), 16); g = parseInt(hex.substring(3, 5), 16); b = parseInt(hex.substring(5, 7), 16); } return [r, g, b]; } const titleRgb = hexToRgb(titleColorHex); const textRgb = hexToRgb(textColorHex); const headerBgRgb = hexToRgb(headerBgColorHex); doc.setFillColor(headerBgRgb[0], headerBgRgb[1], headerBgRgb[2]); doc.rect(0, 0, doc.internal.pageSize.getWidth(), 55, 'F'); doc.setFontSize(20); doc.setTextColor(titleRgb[0], titleRgb[1], titleRgb[2]); doc.text("Native American Tribal Information", doc.internal.pageSize.getWidth() / 2, 38, { align: 'center' }); doc.setFontSize(9); doc.setTextColor(textRgb[0], textRgb[1], textRgb[2]); doc.text(`Generated: ${timestamp}`, doc.internal.pageSize.getWidth() - 14, 20 , {align: 'right'}); doc.setFontSize(16); doc.setTextColor(titleRgb[0], titleRgb[1], titleRgb[2]); doc.text(tribe.officialName || tribe.name, 14, yPos); yPos += 22; doc.setFontSize(10); doc.setTextColor(textRgb[0], textRgb[1], textRgb[2]); function addTextSectionForPdf(label, value, currentY) { if (!value) return currentY; doc.setFont("helvetica", "bold"); doc.text(label + ":", 14, currentY); doc.setFont("helvetica", "normal"); const textLines = doc.splitTextToSize(value, doc.internal.pageSize.getWidth() - 30 - doc.getTextWidth(label + ": ") - 10); // Adjusted width doc.text(textLines, 14 + doc.getTextWidth(label + ": ") + 5, currentY); return currentY + (textLines.length * 12) + 6; // Adjusted line height for PDF } yPos = addTextSectionForPdf("Common Name", tribe.name !== tribe.officialName ? tribe.name : null, yPos); yPos = addTextSectionForPdf("Historical Region", tribe.historicalRegion, yPos); yPos = addTextSectionForPdf("Current Land Base", tribe.currentLandInfo, yPos); yPos = addTextSectionForPdf("Language Family", tribe.languageFamily, yPos); doc.setFont("helvetica", "bold"); doc.text("About the Nation:", 14, yPos); yPos +=12; doc.setFont("helvetica", "normal"); const bioLines = doc.splitTextToSize(tribe.briefInfo, doc.internal.pageSize.getWidth() - 28); doc.text(bioLines, 14, yPos); yPos += bioLines.length * 12 + 6; if (tribe.officialWebsite) { yPos = addTextSectionForPdf("Official Website", tribe.officialWebsite, yPos); } yPos += 10; const mapElement = document.getElementById('natmg-map'); const mapControls = mapElement.querySelector('.leaflet-control-container'); if (mapControls) mapControls.style.display = 'none'; try { await new Promise(resolve => setTimeout(resolve, 500)); const canvas = await html2canvas(mapElement, { useCORS: true, logging: false, scale: 1}); const imgData = canvas.toDataURL('image/png'); if (mapControls) mapControls.style.display = ''; const imgProps = doc.getImageProperties(imgData); const pdfWidth = doc.internal.pageSize.getWidth(); let imgWidth = pdfWidth * 0.8; let imgHeight = (imgProps.height * imgWidth) / imgProps.width; const spaceForMap = doc.internal.pageSize.getHeight() - yPos - 30; if (imgHeight > spaceForMap && spaceForMap > 50) { // Ensure some minimal space makes sense imgHeight = spaceForMap; imgWidth = (imgProps.width * imgHeight) / imgProps.height; } if (imgWidth > pdfWidth * 0.8) { imgWidth = pdfWidth * 0.8; imgHeight = (imgProps.height * imgWidth) / imgProps.width; } if (yPos + imgHeight + 20 > doc.internal.pageSize.getHeight()) { doc.addPage(); yPos = 40; // Adjusted YPos for new page } doc.setFontSize(12); doc.setTextColor(titleRgb[0], titleRgb[1], titleRgb[2]); doc.text("Approximate Location Map:", 14, yPos); yPos += 18; // Increased space doc.addImage(imgData, 'PNG', (pdfWidth - imgWidth) / 2, yPos, imgWidth, imgHeight); } catch(e) { console.error("Error capturing map for PDF:", e); if (mapControls) mapControls.style.display = ''; doc.setTextColor(180,0,0); if (yPos > doc.internal.pageSize.getHeight() - 30) { doc.addPage(); yPos = 40; } doc.text("Map image could not be captured.", 14, yPos); doc.setTextColor(textRgb[0], textRgb[1], textRgb[2]); // Reset text color } doc.save(`Tribal_Info_${tribe.id.replace(/[^a-z0-9]/gi, '_')}.pdf`); // Sanitize filename }); initMap(); populateTribeSelect(); displayTribeInfo(null); });