Nick Urban’s Biological Age Test Comparison

${Object.entries(overlappingDomains).map(([domain, scores]) => `

`).join('')} `;container.innerHTML = heatmapHTML; }// Create recommendations matrix function createRecommendationsMatrix() { const container = document.getElementById('recommendationsMatrix'); const matrixHTML = `

`;container.innerHTML = matrixHTML; }// Create methodology cards function createMethodologyCards() { const container = document.getElementById('methodologyGrid'); const cardsHTML = Object.entries(dashboardData.test_results).map(([testName, data]) => `

`).join('');container.innerHTML = cardsHTML; }// Create timeline function createTimeline() { const container = document.getElementById('timelineContainer'); const timelineHTML = `

`;container.innerHTML = timelineHTML; }// Setup filters function setupFilters() { const methodologyFilter = document.getElementById('methodologyFilter'); const sampleTypeFilter = document.getElementById('sampleTypeFilter'); const resetButton = document.getElementById('resetFilters');function applyFilters() { const methodologyValue = methodologyFilter.value; const sampleTypeValue = sampleTypeFilter.value; const rows = document.querySelectorAll('.table-row'); rows.forEach(row => { const methodology = row.dataset.methodology; const sampleType = row.dataset.sampleType; const methodologyMatch = !methodologyValue || methodology === methodologyValue; const sampleTypeMatch = !sampleTypeValue || sampleType === sampleTypeValue; if (methodologyMatch && sampleTypeMatch) { row.classList.remove('hidden-row'); } else { row.classList.add('hidden-row'); } }); }methodologyFilter.addEventListener('change', applyFilters); sampleTypeFilter.addEventListener('change', applyFilters);resetButton.addEventListener('click', () => { methodologyFilter.value = ''; sampleTypeFilter.value = ''; applyFilters(); }); }// Setup table sorting function setupTableSorting() { const headers = document.querySelectorAll('[data-sort]'); headers.forEach(header => { header.addEventListener('click', () => { const sortKey = header.dataset.sort; const direction = currentSort.column === sortKey && currentSort.direction === 'asc' ? 'desc' : 'asc'; sortTable(sortKey, direction); currentSort = { column: sortKey, direction }; // Update header indicators headers.forEach(h => h.classList.remove('sort-asc', 'sort-desc')); header.classList.add(`sort-${direction}`); }); }); }function sortTable(sortKey, direction) { const tbody = document.getElementById('tableBody'); const rows = Array.from(tbody.querySelectorAll('tr')); rows.sort((a, b) => { let aVal, bVal; switch(sortKey) { case 'name': aVal = a.querySelector('.test-name').textContent; bVal = b.querySelector('.test-name').textContent; break; case 'bio-age': aVal = parseFloat(a.querySelector('.age-cell').textContent); bVal = parseFloat(b.querySelector('.age-cell').textContent); break; case 'difference': aVal = parseFloat(a.querySelector('.difference-cell').textContent); bVal = parseFloat(b.querySelector('.difference-cell').textContent); break; case 'cost': aVal = parseInt(a.querySelector('.cost-cell').textContent.replace('$', '')); bVal = parseInt(b.querySelector('.cost-cell').textContent.replace('$', '')); break; default: aVal = a.children[getColumnIndex(sortKey)].textContent; bVal = b.children[getColumnIndex(sortKey)].textContent; } if (typeof aVal === 'string') { return direction === 'asc' ? aVal.localeCompare(bVal) : bVal.localeCompare(aVal); } else { return direction === 'asc' ? aVal - bVal : bVal - aVal; } }); tbody.innerHTML = ''; rows.forEach(row => tbody.appendChild(row)); }function getColumnIndex(sortKey) { const mapping = { 'name': 0, 'sample': 1, 'bio-age': 2, 'chron-age': 3, 'difference': 4, 'methodology': 5, 'organ': 6, 'turnaround': 7, 'cost': 8, 'notes': 9 }; return mapping[sortKey] || 0; }// Setup tooltips function setupTooltips() { const tooltip = document.getElementById('tooltip'); const tooltipTriggers = document.querySelectorAll('[data-tooltip]'); tooltipTriggers.forEach(trigger => { trigger.addEventListener('mouseenter', (e) => { tooltip.textContent = e.target.dataset.tooltip; tooltip.classList.remove('hidden'); updateTooltipPosition(e); }); trigger.addEventListener('mouseleave', () => { tooltip.classList.add('hidden'); }); trigger.addEventListener('mousemove', updateTooltipPosition); }); function updateTooltipPosition(e) { tooltip.style.left = e.pageX + 10 + 'px'; tooltip.style.top = e.pageY - 10 + 'px'; } }