No documents found.
`;
} else {
let listHtml = 'No documents found ${searchTerm ? 'matching search in' : 'for'} ${currentDocViewTab === 'All' ? 'any phase' : currentDocViewTab}.
`;
} else {
const sortedDocs = filteredDocs.sort((a, b) => a.Document_Name.localeCompare(b.Document_Name));
listHtml = '
Phase:
${doc.Phase || 'N/A'}
Discipline:
${doc.Sub_Phase_Discipline || 'N/A'}
Authoring Department(s):
${doc['Authoring_Department(s)'] || 'N/A'}
Review/Approval Dept(s):
${doc['Review_Approval_Dept(s)'] || 'N/A'}
Complexity:
${getComplexityIcon(doc.Complexity_Authoring)} ${doc.Complexity_Authoring || 'N/A'}
Regulatory Significance:
${getRegulatoryIcon(doc.Regulatory_Significance)} ${doc.Regulatory_Significance || 'N/A'}
Purpose / Key Content:
${doc.Purpose_Key_Content || 'N/A'}
Key Metadata:
${doc.Key_Metadata || 'N/A'}
Input Docs/Data:
${linkDocumentIDsForDetails(doc.Input_Documents_Data_Sources) || 'N/A'}
Output/Informs Docs:
${linkDocumentIDsForDetails(doc.Output_Informs_Documents) || 'N/A'}
`;
const dependenciesHtml = `
`;
if (relatedTemplates.length > 0) {
templatesHtml += `
`;
relatedTemplates.forEach(tpl => {
templatesHtml += `
${tpl.description}
Sections:
${tpl.sections.slice(0, 4).map(section => `
${section.title}
${section.description}
`).join('')}
${tpl.sections.length > 4 ? `
+ ${tpl.sections.length - 4} more sections
` : ''}
`;
});
templatesHtml += `
`;
} else {
templatesHtml += `
No templates available for this document type.
`;
}
templatesHtml += `
Failed to render dependency graph.
`;
}
}
// Callbacks from Mermaid graphs
window.displayDetailsAndGraphFromGraph = async (docId) => {
console.log("Graph node clicked (main flow or example):", docId);
await displayDetailsInModal(docId); // Always show in modal
setTimeout(() => {
// If the doc list view is active, scroll the item into view
if (currentVisibleView === 'documentViewWrapper') {
const listItem = document.querySelector(`#documentListDocView li[data-doc-id="${docId}"]`);
listItem?.scrollIntoView({ behavior: 'smooth', block: 'nearest' });
}
}, 100);
};
window.displayDetailsAndGraphFromModal = async (docId) => {
console.log("Modal graph node clicked:", docId);
await displayDetailsInModal(docId); // Update current modal
setTimeout(() => {
if (currentVisibleView === 'documentViewWrapper') {
const listItem = document.querySelector(`#documentListDocView li[data-doc-id="${docId}"]`);
listItem?.scrollIntoView({ behavior: 'smooth', block: 'nearest' });
}
}, 100);
};
function clearSelection() {
currentSelectedDocId = null;
if (currentVisibleView === 'documentViewWrapper') {
renderDocumentList(); // Update list highlight
}
}
// Enhance flow list rendering with better UI
function renderFlowsList() {
const flowDisplayTitles = {
"p1_sad": "Phase 1 SAD Study Documents",
"nda_submission": "NDA/MAA Submission Process",
"ind_pathway": "IND Pathway Documents",
"clinical_program": "Clinical Program Development"
};
let flowsHtml = `
Flow definition not found.
`;
flowPlaceholder.style.display = 'none';
return;
}
// Show loading indicator
mermaidFlowGraphContainer.innerHTML = `
Error rendering flow graph.
${error.message}
`;
}
}
async function showExampleFlow() {
const exampleDefinition = flowDefinitions['p1_sad'];
try {
// Show loading indicator
exampleMermaidGraphContainer.innerHTML = `
This diagram shows the key documents needed for a Phase 1 Single Ascending Dose study, from preclinical inputs through to clinical execution and reporting.
`;
exampleMermaidGraphContainer.insertBefore(titleContainer, exampleMermaidGraphContainer.firstChild);
// Make the SVG responsive
const svgElement = exampleMermaidGraphContainer.querySelector('svg');
if (svgElement) {
svgElement.setAttribute('width', '100%');
svgElement.setAttribute('height', '100%');
}
exampleFlowModal.style.display = "flex";
} catch (error) {
console.error("Mermaid rendering error for example:", error);
exampleMermaidGraphContainer.innerHTML = `
Error rendering example flow graph.
`;
exampleFlowModal.style.display = "flex";
}
}
// --- Global Search Functionality ---
// Add global search functionality
function performGlobalSearch(searchTerm) {
if (!searchTerm) return;
searchTerm = searchTerm.toLowerCase();
let results = documentsData.filter(doc =>
doc.Document_Name.toLowerCase().includes(searchTerm) ||
doc.Doc_ID_Type.toLowerCase().includes(searchTerm) ||
(doc.Purpose_Key_Content && doc.Purpose_Key_Content.toLowerCase().includes(searchTerm))
);
// Switch to document view with search results
switchToView('documentViewWrapper', 'All');
// Set the search input in document view to match the global search
searchInputDocView.value = searchTerm;
// Render the filtered list
renderDocumentList();
}
// --- Event Listeners ---
// Search input specific to document view
searchInputDocView?.addEventListener('input', renderDocumentList);
// Global header search
headerSearchInput?.addEventListener('keypress', (e) => {
if (e.key === 'Enter') {
performGlobalSearch(e.target.value);
}
});
// Home button listener
homeButton?.addEventListener('click', () => switchToView('home'));
// Breadcrumb listener (delegated)
breadcrumbNav?.addEventListener('click', (e) => {
if (e.target.tagName === 'A' && e.target.dataset.viewTarget) {
e.preventDefault();
switchToView(e.target.dataset.viewTarget);
}
});
// Dashboard card listeners (delegated to main content area)
mainContentArea?.addEventListener('click', (e) => {
const card = e.target.closest('.dashboard-card[data-target-view]');
if (card) {
const targetView = card.dataset.targetView;
const initialTab = card.dataset.initialTab; // Get initial tab if specified
if (targetView) {
switchToView(targetView, initialTab);
}
}
});
// Example Flow Buttons (Header and Flow View)
showExampleFlowBtnHeader?.addEventListener('click', showExampleFlow);
showExampleFlowBtnFlowView?.addEventListener('click', showExampleFlow);
// Modal Close Listeners
closeExampleModalBtn?.addEventListener('click', () => exampleFlowModal.style.display = "none");
window.addEventListener('click', (event) => { if (event.target == exampleFlowModal) exampleFlowModal.style.display = "none"; });
closeDetailsModalBtn?.addEventListener('click', () => { detailsModal.style.display = "none"; clearSelection(); });
window.addEventListener('click', (event) => { if (event.target == detailsModal) { detailsModal.style.display = "none"; clearSelection(); } });
// Modal Next/Prev Button Listeners
prevDocBtn?.addEventListener('click', () => { if (currentDocListIndices.prev) displayDetailsInModal(currentDocListIndices.prev); });
nextDocBtn?.addEventListener('click', () => { if (currentDocListIndices.next) displayDetailsInModal(currentDocListIndices.next); });
// --- Initialization ---
document.addEventListener('DOMContentLoaded', async () => {
console.log("DOM Loaded. Fetching data...");
mainContentArea.innerHTML += '