1021 lines
48 KiB
Plaintext
1021 lines
48 KiB
Plaintext
<%- include('partials/header') %>
|
|
|
|
<div class="container py-5">
|
|
<div class="row">
|
|
<div class="col-12">
|
|
<div class="d-flex justify-content-between align-items-center mb-4">
|
|
<h2><i class="fas fa-tachometer-alt me-2"></i>Your Dashboard</h2>
|
|
<div>
|
|
<button class="btn btn-outline-secondary me-2" onclick="refreshStatus()" id="refreshBtn">
|
|
<i class="fas fa-sync-alt me-1"></i>Refresh Status
|
|
</button>
|
|
<a href="/upload" class="btn btn-primary">
|
|
<i class="fas fa-plus me-2"></i>Upload New Notes
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
<% if (files.length === 0) { %>
|
|
<div class="text-center py-5">
|
|
<i class="fas fa-folder-open fa-4x text-muted mb-4"></i>
|
|
<h4>No files uploaded yet</h4>
|
|
<p class="text-muted">Upload your first set of notes to get started with AI-powered revision.</p>
|
|
<a href="/upload" class="btn btn-primary btn-lg">
|
|
<i class="fas fa-upload me-2"></i>Upload Notes
|
|
</a>
|
|
</div>
|
|
<% } else { %>
|
|
<div class="row">
|
|
<% files.forEach(function(file, index) { %>
|
|
<div class="col-md-6 col-lg-4 mb-4">
|
|
<div class="card border-0 shadow-sm h-100">
|
|
<div class="card-body">
|
|
<div class="d-flex align-items-center mb-3">
|
|
<div class="dashboard-file-icon bg-primary text-white rounded-circle d-flex align-items-center justify-content-center me-3">
|
|
<i class="fas fa-file-alt"></i>
|
|
</div>
|
|
<div class="flex-grow-1">
|
|
<h6 class="mb-1"><%= file.originalName %></h6>
|
|
<small class="text-muted"><%= Math.round(file.size / 1024) %> KB</small>
|
|
</div>
|
|
<div class="text-end">
|
|
<% if (file.status === 'processing') { %>
|
|
<span class="badge bg-warning">
|
|
<i class="fas fa-spinner fa-spin me-1"></i>Processing
|
|
</span>
|
|
<% } else if (file.status === 'processed') { %>
|
|
<span class="badge bg-success">
|
|
<i class="fas fa-check me-1"></i>Processed
|
|
</span>
|
|
<% } else if (file.status === 'failed') { %>
|
|
<span class="badge bg-danger">
|
|
<i class="fas fa-times me-1"></i>Failed
|
|
</span>
|
|
<% } else { %>
|
|
<span class="badge bg-secondary">
|
|
<i class="fas fa-clock me-1"></i>Uploaded
|
|
</span>
|
|
<% } %>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="mb-3">
|
|
<small class="text-muted">
|
|
<i class="fas fa-calendar me-1"></i>
|
|
Uploaded: <%= new Date(file.uploadDate).toLocaleDateString() %>
|
|
</small>
|
|
<% if (file.processingResult) { %>
|
|
<br><small class="text-muted">
|
|
<i class="fas fa-puzzle-piece me-1"></i>
|
|
Chunks: <%= file.processingResult.successfulChunks %>/<%= file.processingResult.totalChunks %>
|
|
</small>
|
|
<% } %>
|
|
</div>
|
|
|
|
<div class="d-grid gap-2">
|
|
<% if (file.status === 'processed') { %>
|
|
<a href="/revise/<%= file.id %>" class="btn btn-primary btn-sm">
|
|
<i class="fas fa-brain me-2"></i>Revise with AI
|
|
</a>
|
|
<% } else if (file.status === 'processing') { %>
|
|
<button class="btn btn-secondary btn-sm" disabled>
|
|
<i class="fas fa-spinner fa-spin me-2"></i>Processing...
|
|
</button>
|
|
<% } else if (file.status === 'failed') { %>
|
|
<button class="btn btn-warning btn-sm" onclick="retryProcessing('<%= file.id %>')">
|
|
<i class="fas fa-redo me-2"></i>Retry Processing
|
|
</button>
|
|
<% } else { %>
|
|
<button class="btn btn-info btn-sm" onclick="checkProcessingStatus('<%= file.id %>')">
|
|
<i class="fas fa-sync me-2"></i>Check Status
|
|
</button>
|
|
<% } %>
|
|
|
|
<div class="btn-group" role="group">
|
|
<button type="button" class="btn btn-outline-secondary btn-sm" onclick="previewFile('<%= file.id %>')">
|
|
<i class="fas fa-eye"></i> Preview
|
|
</button>
|
|
<button type="button" class="btn btn-outline-info btn-sm" onclick="viewProcessingDetails('<%= file.id %>')">
|
|
<i class="fas fa-info-circle"></i> Details
|
|
</button>
|
|
<button type="button" class="btn btn-outline-danger btn-sm" onclick="deleteFile('<%= file.id %>')">
|
|
<i class="fas fa-trash"></i> Delete
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<% }); %>
|
|
</div>
|
|
<% } %>
|
|
|
|
<!-- Revised Files Section -->
|
|
<% if (typeof revisedFiles !== 'undefined' && revisedFiles.length > 0) { %>
|
|
<div class="ai-revised-section revised-files-section">
|
|
<div class="d-flex justify-content-between align-items-center mb-4">
|
|
<h3><i class="fas fa-brain me-2 text-success"></i>AI-Revised Notes</h3>
|
|
<small class="text-muted bg-white px-2 py-1 rounded-pill">
|
|
<%= revisedFiles.length %> revised file<%= revisedFiles.length !== 1 ? 's' : '' %>
|
|
</small>
|
|
</div>
|
|
<div class="row">
|
|
<% revisedFiles.forEach(function(file, index) { %>
|
|
<div class="col-md-6 col-lg-4 mb-4">
|
|
<div class="card border-0 shadow-sm h-100 border-start border-4 border-success">
|
|
<div class="card-body p-3">
|
|
<div class="d-flex align-items-start mb-3">
|
|
<div class="file-icon bg-success text-white rounded-circle d-flex align-items-center justify-content-center me-3 ai-icon" style="width: 50px; height: 50px; min-width: 50px; font-size: 1.2rem; font-weight: bold; letter-spacing: 1px;">
|
|
AI
|
|
</div>
|
|
<div class="flex-grow-1 min-w-0">
|
|
<h6 class="mb-1 file-name-truncate" title="<%= file.originalName %>">
|
|
<%= file.originalName %>
|
|
</h6>
|
|
<div class="d-flex flex-wrap align-items-center gap-1 mb-1">
|
|
<small class="text-muted"><%= Math.round(file.size / 1024) %> KB</small>
|
|
<span class="badge bg-success text-white">
|
|
<%= file.revisionType.charAt(0).toUpperCase() + file.revisionType.slice(1) %>
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="mb-3">
|
|
<div class="small text-muted mb-1">
|
|
<i class="fas fa-calendar me-1"></i>
|
|
<%= new Date(file.uploadDate).toLocaleDateString() %>
|
|
</div>
|
|
<% if (file.originalFileName) { %>
|
|
<div class="small text-muted file-name-truncate" title="From: <%= file.originalFileName %>">
|
|
<i class="fas fa-file-alt me-1"></i>
|
|
From: <%= file.originalFileName %>
|
|
</div>
|
|
<% } %>
|
|
</div>
|
|
|
|
<div class="mt-auto">
|
|
<div class="d-grid gap-2">
|
|
<button type="button" class="btn btn-outline-primary btn-sm" onclick="previewRevisedFile('<%= file.id %>')">
|
|
<i class="fas fa-eye me-1"></i>Preview
|
|
</button>
|
|
<div class="btn-group w-100" role="group">
|
|
<a href="/uploads/revised-notes/<%= file.filename %>" download class="btn btn-success btn-sm">
|
|
<i class="fas fa-download me-1"></i>Download
|
|
</a>
|
|
<button type="button" class="btn btn-outline-danger btn-sm" onclick="deleteRevisedFile('<%= file.id %>')" title="Delete">
|
|
<i class="fas fa-trash"></i>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<% }); %>
|
|
</div>
|
|
</div>
|
|
<% } %>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Preview Modal -->
|
|
<div class="modal fade" id="previewModal" tabindex="-1">
|
|
<div class="modal-dialog modal-lg">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title">File Preview</h5>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal"></button>
|
|
</div>
|
|
<div class="modal-body">
|
|
<div id="preview-content">
|
|
<div class="text-center">
|
|
<div class="spinner-border text-primary" role="status">
|
|
<span class="visually-hidden">Loading...</span>
|
|
</div>
|
|
<p class="mt-2">Loading preview...</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Processing Details Modal -->
|
|
<div class="modal fade" id="processingDetailsModal" tabindex="-1">
|
|
<div class="modal-dialog modal-lg">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title">Processing Details</h5>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal"></button>
|
|
</div>
|
|
<div class="modal-body">
|
|
<div id="processing-details-content">
|
|
<div class="text-center">
|
|
<div class="spinner-border text-primary" role="status">
|
|
<span class="visually-hidden">Loading...</span>
|
|
</div>
|
|
<p class="mt-2">Loading processing details...</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
function previewFile(fileId) {
|
|
const modal = new bootstrap.Modal(document.getElementById('previewModal'));
|
|
const previewContent = document.getElementById('preview-content');
|
|
|
|
previewContent.innerHTML = `
|
|
<div class="text-center">
|
|
<div class="spinner-border text-primary" role="status">
|
|
<span class="visually-hidden">Loading...</span>
|
|
</div>
|
|
<p class="mt-2">Loading preview...</p>
|
|
</div>
|
|
`;
|
|
|
|
modal.show();
|
|
|
|
// Fetch file content for preview
|
|
fetch(`/api/files/${fileId}/preview`)
|
|
.then(response => response.json())
|
|
.then(result => {
|
|
if (result.success) {
|
|
const file = result.file;
|
|
let content = '';
|
|
|
|
// Handle different preview types
|
|
if (file.previewType === 'text') {
|
|
// Text-based files - show with syntax highlighting
|
|
content = `
|
|
<div class="mb-3">
|
|
<h6><i class="fas fa-file-alt me-2"></i>${file.originalName}</h6>
|
|
<small class="text-muted">
|
|
Size: ${Math.round(file.size / 1024)} KB |
|
|
Uploaded: ${new Date(file.uploadDate).toLocaleDateString()}
|
|
</small>
|
|
</div>
|
|
<div class="border rounded p-3" style="background-color: #f8f9fa; max-height: 400px; overflow-y: auto;">
|
|
<pre style="margin: 0; white-space: pre-wrap; word-wrap: break-word;"><code>${escapeHtml(file.content)}</code></pre>
|
|
</div>
|
|
`;
|
|
} else if (file.previewType === 'extracted-text') {
|
|
// Successfully extracted text from document
|
|
const extractionInfo = file.extractionInfo || {};
|
|
const infoText = [];
|
|
|
|
if (extractionInfo.pages) infoText.push(`${extractionInfo.pages} pages`);
|
|
if (extractionInfo.sheets) infoText.push(`${extractionInfo.sheets} sheets`);
|
|
if (extractionInfo.totalLength) infoText.push(`${extractionInfo.totalLength} characters extracted`);
|
|
|
|
content = `
|
|
<div class="mb-3">
|
|
<h6><i class="fas fa-file-word me-2"></i>${file.originalName}</h6>
|
|
<small class="text-muted">
|
|
Size: ${Math.round(file.size / 1024)} KB |
|
|
Uploaded: ${new Date(file.uploadDate).toLocaleDateString()}
|
|
${infoText.length > 0 ? ' | ' + infoText.join(', ') : ''}
|
|
</small>
|
|
</div>
|
|
<div class="alert alert-success">
|
|
<i class="fas fa-check-circle me-2"></i>
|
|
${file.message || 'Text successfully extracted from document'}
|
|
</div>
|
|
<div class="border rounded p-3" style="background-color: #f8f9fa; max-height: 400px; overflow-y: auto;">
|
|
<pre style="margin: 0; white-space: pre-wrap; word-wrap: break-word;">${escapeHtml(file.content)}</pre>
|
|
</div>
|
|
${extractionInfo.truncated ? '<small class="text-muted mt-2 d-block"><i class="fas fa-info-circle me-1"></i>Full document content is available for AI processing</small>' : ''}
|
|
`;
|
|
} else if (file.previewType === 'binary') {
|
|
// Binary files - show info message
|
|
content = `
|
|
<div class="mb-3">
|
|
<h6><i class="fas fa-file-pdf me-2"></i>${file.originalName}</h6>
|
|
<small class="text-muted">
|
|
Size: ${Math.round(file.size / 1024)} KB |
|
|
Uploaded: ${new Date(file.uploadDate).toLocaleDateString()}
|
|
</small>
|
|
</div>
|
|
<div class="alert alert-info">
|
|
<i class="fas fa-info-circle me-2"></i>
|
|
${file.message || 'This is a binary file that has been processed for AI use.'}
|
|
</div>
|
|
${file.content && file.content !== 'File preview not available' ? `
|
|
<div class="border rounded p-3" style="background-color: #f8f9fa; max-height: 400px; overflow-y: auto;">
|
|
<small class="text-muted">Extracted content preview:</small>
|
|
<pre style="margin: 0; margin-top: 10px; white-space: pre-wrap; word-wrap: break-word;">${escapeHtml(file.content)}</pre>
|
|
</div>
|
|
` : ''}
|
|
`;
|
|
} else if (file.previewType === 'extraction-failed') {
|
|
// Failed to extract text
|
|
content = `
|
|
<div class="mb-3">
|
|
<h6><i class="fas fa-file-exclamation me-2"></i>${file.originalName}</h6>
|
|
<small class="text-muted">
|
|
Size: ${Math.round(file.size / 1024)} KB |
|
|
Uploaded: ${new Date(file.uploadDate).toLocaleDateString()}
|
|
</small>
|
|
</div>
|
|
<div class="alert alert-warning">
|
|
<i class="fas fa-exclamation-triangle me-2"></i>
|
|
${file.message || 'Could not extract text from this file.'}
|
|
</div>
|
|
`;
|
|
} else if (file.previewType === 'error') {
|
|
// Error reading file
|
|
content = `
|
|
<div class="mb-3">
|
|
<h6><i class="fas fa-file-times me-2"></i>${file.originalName}</h6>
|
|
<small class="text-muted">
|
|
Size: ${Math.round(file.size / 1024)} KB |
|
|
Uploaded: ${new Date(file.uploadDate).toLocaleDateString()}
|
|
</small>
|
|
</div>
|
|
<div class="alert alert-danger">
|
|
<i class="fas fa-exclamation-circle me-2"></i>
|
|
${file.message || 'Error reading file.'}
|
|
</div>
|
|
`;
|
|
} else {
|
|
// Fallback for unknown preview types
|
|
content = `
|
|
<div class="mb-3">
|
|
<h6><i class="fas fa-file me-2"></i>${file.originalName}</h6>
|
|
<small class="text-muted">
|
|
Size: ${Math.round(file.size / 1024)} KB |
|
|
Uploaded: ${new Date(file.uploadDate).toLocaleDateString()}
|
|
</small>
|
|
</div>
|
|
<div class="alert alert-warning">
|
|
<i class="fas fa-exclamation-triangle me-2"></i>
|
|
Preview not available for this file type. File content is available for AI processing.
|
|
</div>
|
|
`;
|
|
}
|
|
|
|
previewContent.innerHTML = content;
|
|
} else {
|
|
previewContent.innerHTML = `
|
|
<div class="alert alert-danger">
|
|
<i class="fas fa-exclamation-circle me-2"></i>
|
|
Error loading preview: ${result.error || 'Unknown error'}
|
|
</div>
|
|
`;
|
|
}
|
|
})
|
|
.catch(error => {
|
|
previewContent.innerHTML = `
|
|
<div class="alert alert-danger">
|
|
<i class="fas fa-exclamation-circle me-2"></i>
|
|
Error loading preview: ${error.message}
|
|
</div>
|
|
`;
|
|
});
|
|
}
|
|
|
|
// Helper function to escape HTML
|
|
function escapeHtml(text) {
|
|
const div = document.createElement('div');
|
|
div.textContent = text;
|
|
return div.innerHTML;
|
|
}
|
|
|
|
function deleteFile(fileId) {
|
|
if (confirm('Are you sure you want to delete this file? This action cannot be undone.')) {
|
|
// Show loading state
|
|
const deleteBtn = document.querySelector(`button[onclick="deleteFile('${fileId}')"]`);
|
|
const originalText = deleteBtn.innerHTML;
|
|
deleteBtn.innerHTML = '<i class="fas fa-spinner fa-spin"></i> Deleting...';
|
|
deleteBtn.disabled = true;
|
|
|
|
fetch(`/api/files/${fileId}`, {
|
|
method: 'DELETE',
|
|
headers: {
|
|
'Content-Type': 'application/json',
|
|
}
|
|
})
|
|
.then(response => {
|
|
if (!response.ok) {
|
|
throw new Error(`HTTP error! status: ${response.status}`);
|
|
}
|
|
return response.json();
|
|
})
|
|
.then(result => {
|
|
if (result.success) {
|
|
// Show success message
|
|
alert('File deleted successfully!');
|
|
location.reload();
|
|
} else {
|
|
alert('Error deleting file: ' + (result.error || 'Unknown error'));
|
|
deleteBtn.innerHTML = originalText;
|
|
deleteBtn.disabled = false;
|
|
}
|
|
})
|
|
.catch(error => {
|
|
console.error('Delete error:', error);
|
|
alert('Error deleting file: ' + error.message);
|
|
deleteBtn.innerHTML = originalText;
|
|
deleteBtn.disabled = false;
|
|
});
|
|
}
|
|
}
|
|
|
|
// Check processing status
|
|
async function checkProcessingStatus(fileId) {
|
|
try {
|
|
const response = await fetch(`/api/files/${fileId}/status`);
|
|
const result = await response.json();
|
|
|
|
if (result.success) {
|
|
// Show status update
|
|
const statusInfo = result.file;
|
|
let message = `Status: ${statusInfo.status}`;
|
|
|
|
if (statusInfo.processingResult) {
|
|
message += `\nChunks processed: ${statusInfo.processingResult.successfulChunks}/${statusInfo.processingResult.totalChunks}`;
|
|
if (statusInfo.processingResult.processedAt) {
|
|
message += `\nProcessed at: ${new Date(statusInfo.processingResult.processedAt).toLocaleString()}`;
|
|
}
|
|
}
|
|
|
|
if (statusInfo.processingError) {
|
|
message += `\nError: ${statusInfo.processingError}`;
|
|
}
|
|
|
|
alert(message);
|
|
|
|
// Reload page if status changed
|
|
if (statusInfo.status !== 'processing') {
|
|
location.reload();
|
|
}
|
|
} else {
|
|
alert('Error checking status: ' + result.error);
|
|
}
|
|
} catch (error) {
|
|
console.error('Error checking processing status:', error);
|
|
alert('Error checking processing status: ' + error.message);
|
|
}
|
|
}
|
|
|
|
// Retry processing
|
|
async function retryProcessing(fileId) {
|
|
if (confirm('Are you sure you want to retry processing this file?')) {
|
|
try {
|
|
const response = await fetch(`/api/files/${fileId}/retry`, {
|
|
method: 'POST',
|
|
headers: {
|
|
'Content-Type': 'application/json',
|
|
}
|
|
});
|
|
|
|
const result = await response.json();
|
|
|
|
if (result.success) {
|
|
alert('Processing retry initiated. Please check back in a few moments.');
|
|
location.reload();
|
|
} else {
|
|
alert('Error retrying processing: ' + result.error);
|
|
}
|
|
} catch (error) {
|
|
console.error('Error retrying processing:', error);
|
|
alert('Error retrying processing: ' + error.message);
|
|
}
|
|
}
|
|
}
|
|
|
|
// View processing details
|
|
async function viewProcessingDetails(fileId) {
|
|
try {
|
|
const modal = new bootstrap.Modal(document.getElementById('processingDetailsModal'));
|
|
const detailsContent = document.getElementById('processing-details-content');
|
|
|
|
detailsContent.innerHTML = `
|
|
<div class="text-center">
|
|
<div class="spinner-border text-primary" role="status">
|
|
<span class="visually-hidden">Loading...</span>
|
|
</div>
|
|
<p class="mt-2">Loading processing details...</p>
|
|
</div>
|
|
`;
|
|
|
|
modal.show();
|
|
|
|
const response = await fetch(`/api/files/${fileId}/status`);
|
|
const result = await response.json();
|
|
|
|
if (result.success) {
|
|
const file = result.file;
|
|
let html = `
|
|
<div class="mb-3">
|
|
<h6><i class="fas fa-file-alt me-2"></i>${escapeHtml(file.originalName)}</h6>
|
|
<small class="text-muted">Uploaded: ${new Date(file.uploadDate).toLocaleString()}</small>
|
|
</div>
|
|
|
|
<div class="row mb-3">
|
|
<div class="col-md-6">
|
|
<strong>Status:</strong>
|
|
<span class="ms-2 badge ${file.status === 'processed' ? 'bg-success' : file.status === 'processing' ? 'bg-warning' : file.status === 'failed' ? 'bg-danger' : 'bg-secondary'}">
|
|
${file.status}
|
|
</span>
|
|
</div>
|
|
</div>
|
|
`;
|
|
|
|
if (file.processingResult) {
|
|
html += `
|
|
<div class="card mb-3">
|
|
<div class="card-header">
|
|
<h6 class="mb-0">Processing Results</h6>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="row">
|
|
<div class="col-md-4">
|
|
<strong>Total Chunks:</strong><br>
|
|
<span class="badge bg-info">${file.processingResult.totalChunks}</span>
|
|
</div>
|
|
<div class="col-md-4">
|
|
<strong>Successful:</strong><br>
|
|
<span class="badge bg-success">${file.processingResult.successfulChunks}</span>
|
|
</div>
|
|
<div class="col-md-4">
|
|
<strong>Failed:</strong><br>
|
|
<span class="badge bg-danger">${file.processingResult.failedChunks}</span>
|
|
</div>
|
|
</div>
|
|
${file.processingResult.processedAt ? `
|
|
<div class="mt-3">
|
|
<strong>Processed At:</strong><br>
|
|
<small class="text-muted">${new Date(file.processingResult.processedAt).toLocaleString()}</small>
|
|
</div>
|
|
` : ''}
|
|
${file.processingResult.documentHash ? `
|
|
<div class="mt-3">
|
|
<strong>Document Hash:</strong><br>
|
|
<small class="text-muted font-monospace">${file.processingResult.documentHash}</small>
|
|
</div>
|
|
` : ''}
|
|
${file.processingResult.contentLength ? `
|
|
<div class="mt-3">
|
|
<strong>Content Length:</strong><br>
|
|
<small class="text-muted">${file.processingResult.contentLength.toLocaleString()} characters</small>
|
|
</div>
|
|
` : ''}
|
|
</div>
|
|
</div>
|
|
`;
|
|
}
|
|
|
|
if (file.processingError) {
|
|
html += `
|
|
<div class="alert alert-danger">
|
|
<h6><i class="fas fa-exclamation-triangle me-2"></i>Processing Error</h6>
|
|
<p class="mb-0">${escapeHtml(file.processingError)}</p>
|
|
</div>
|
|
`;
|
|
}
|
|
|
|
if (file.processingErrors && file.processingErrors.length > 0) {
|
|
html += `
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<h6 class="mb-0">Chunk Errors (${file.processingErrors.length})</h6>
|
|
</div>
|
|
<div class="card-body" style="max-height: 300px; overflow-y: auto;">
|
|
`;
|
|
|
|
file.processingErrors.forEach((error, index) => {
|
|
html += `
|
|
<div class="border-bottom pb-2 mb-2">
|
|
<strong>Chunk ${error.chunkIndex + 1}:</strong><br>
|
|
<small class="text-danger">${escapeHtml(error.error)}</small><br>
|
|
<small class="text-muted">${escapeHtml(error.chunk)}</small>
|
|
</div>
|
|
`;
|
|
});
|
|
|
|
html += `
|
|
</div>
|
|
</div>
|
|
`;
|
|
}
|
|
|
|
detailsContent.innerHTML = html;
|
|
} else {
|
|
detailsContent.innerHTML = `
|
|
<div class="alert alert-danger">
|
|
<i class="fas fa-exclamation-circle me-2"></i>
|
|
Error loading processing details: ${result.error}
|
|
</div>
|
|
`;
|
|
}
|
|
} catch (error) {
|
|
console.error('Error loading processing details:', error);
|
|
document.getElementById('processing-details-content').innerHTML = `
|
|
<div class="alert alert-danger">
|
|
<i class="fas fa-exclamation-circle me-2"></i>
|
|
Error loading processing details: ${error.message}
|
|
</div>
|
|
`;
|
|
}
|
|
}
|
|
|
|
// Progress monitoring for processing files
|
|
let progressMonitoring = {};
|
|
|
|
// Manual refresh function
|
|
async function refreshStatus() {
|
|
const refreshBtn = document.getElementById('refreshBtn');
|
|
const originalHtml = refreshBtn.innerHTML;
|
|
|
|
refreshBtn.innerHTML = '<i class="fas fa-spinner fa-spin me-1"></i>Refreshing...';
|
|
refreshBtn.disabled = true;
|
|
|
|
try {
|
|
const response = await fetch('/api/files/status/all');
|
|
const result = await response.json();
|
|
|
|
if (result.success) {
|
|
console.log('Status refresh successful:', result.summary);
|
|
|
|
// Check if status has changed - if so, reload page to show updates
|
|
const hasProcessingFiles = result.summary.processing > 0;
|
|
const currentProcessingBadges = document.querySelectorAll('.badge').length;
|
|
|
|
if (!hasProcessingFiles || result.summary.processed > 0) {
|
|
console.log('Status changed, reloading page...');
|
|
location.reload();
|
|
} else {
|
|
// Show success feedback
|
|
refreshBtn.innerHTML = '<i class="fas fa-check me-1"></i>Updated';
|
|
setTimeout(() => {
|
|
refreshBtn.innerHTML = originalHtml;
|
|
refreshBtn.disabled = false;
|
|
}, 1500);
|
|
}
|
|
} else {
|
|
throw new Error(result.error || 'Failed to refresh status');
|
|
}
|
|
} catch (error) {
|
|
console.error('Error refreshing status:', error);
|
|
refreshBtn.innerHTML = '<i class="fas fa-exclamation-triangle me-1"></i>Error';
|
|
setTimeout(() => {
|
|
refreshBtn.innerHTML = originalHtml;
|
|
refreshBtn.disabled = false;
|
|
}, 2000);
|
|
}
|
|
}
|
|
|
|
function startProgressMonitoring() {
|
|
// Find all processing files and start monitoring them
|
|
const processingCards = document.querySelectorAll('.card');
|
|
processingCards.forEach(card => {
|
|
const badge = card.querySelector('.badge');
|
|
if (badge && badge.textContent && badge.textContent.includes('Processing')) {
|
|
// Extract file ID from the card's buttons
|
|
const buttons = card.querySelectorAll('button[onclick*="Details"]');
|
|
if (buttons.length > 0) {
|
|
const onclick = buttons[0].getAttribute('onclick');
|
|
const fileIdMatch = onclick.match(/viewProcessingDetails\('([^']+)'\)/);
|
|
if (fileIdMatch) {
|
|
const fileId = fileIdMatch[1];
|
|
startFileProgressMonitoring(fileId);
|
|
}
|
|
}
|
|
}
|
|
});
|
|
}
|
|
|
|
function startFileProgressMonitoring(fileId) {
|
|
if (progressMonitoring[fileId]) {
|
|
clearInterval(progressMonitoring[fileId]);
|
|
}
|
|
|
|
console.log(`Starting progress monitoring for file: ${fileId}`);
|
|
|
|
progressMonitoring[fileId] = setInterval(async () => {
|
|
try {
|
|
const response = await fetch(`/api/files/${fileId}/progress`);
|
|
const result = await response.json();
|
|
|
|
if (result.success) {
|
|
updateProgressDisplay(fileId, result.progress);
|
|
|
|
// Stop monitoring if processing is complete
|
|
if (result.progress.status !== 'processing') {
|
|
console.log(`File ${fileId} finished processing with status: ${result.progress.status}`);
|
|
clearInterval(progressMonitoring[fileId]);
|
|
delete progressMonitoring[fileId];
|
|
|
|
// Reload page immediately to show final status
|
|
console.log('Reloading page to show updated status...');
|
|
location.reload();
|
|
}
|
|
}
|
|
} catch (error) {
|
|
console.error('Error checking progress:', error);
|
|
}
|
|
}, 1000); // Check every 1 second for faster updates
|
|
}
|
|
|
|
function updateProgressDisplay(fileId, progress) {
|
|
console.log('Updating progress for', fileId, progress);
|
|
|
|
// Find the card for this file
|
|
const cards = document.querySelectorAll('.card');
|
|
let targetCard = null;
|
|
|
|
cards.forEach(card => {
|
|
const buttons = card.querySelectorAll('button[onclick*="Details"]');
|
|
if (buttons.length > 0) {
|
|
const onclick = buttons[0].getAttribute('onclick');
|
|
if (onclick.includes(fileId)) {
|
|
targetCard = card;
|
|
}
|
|
}
|
|
});
|
|
|
|
if (!targetCard) {
|
|
console.warn('Target card not found for file:', fileId);
|
|
return;
|
|
}
|
|
|
|
// Update the badge with progress information
|
|
const badge = targetCard.querySelector('.badge');
|
|
if (badge && progress.processingProgress) {
|
|
const { currentChunk, totalChunks, percentage } = progress.processingProgress;
|
|
badge.innerHTML = `
|
|
<i class="fas fa-spinner fa-spin me-1"></i>
|
|
Processing ${currentChunk}/${totalChunks} (${percentage}%)
|
|
`;
|
|
badge.className = 'badge bg-warning text-dark';
|
|
} else if (badge && progress.status === 'processed') {
|
|
badge.innerHTML = `<i class="fas fa-check-circle me-1"></i>Processed`;
|
|
badge.className = 'badge bg-success';
|
|
} else if (badge && progress.status === 'failed') {
|
|
badge.innerHTML = `<i class="fas fa-exclamation-triangle me-1"></i>Failed`;
|
|
badge.className = 'badge bg-danger';
|
|
}
|
|
|
|
// Update or add progress bar
|
|
const cardBody = targetCard.querySelector('.card-body');
|
|
let progressContainer = cardBody.querySelector('.progress-container');
|
|
|
|
if (progress.processingProgress) {
|
|
if (!progressContainer) {
|
|
progressContainer = document.createElement('div');
|
|
progressContainer.className = 'progress-container mt-2';
|
|
cardBody.appendChild(progressContainer);
|
|
}
|
|
|
|
const { currentChunk, totalChunks, percentage } = progress.processingProgress;
|
|
progressContainer.innerHTML = `
|
|
<div class="progress mb-2" style="height: 8px;">
|
|
<div class="progress-bar progress-bar-striped progress-bar-animated"
|
|
role="progressbar"
|
|
style="width: ${percentage}%"
|
|
aria-valuenow="${percentage}"
|
|
aria-valuemin="0"
|
|
aria-valuemax="100">
|
|
</div>
|
|
</div>
|
|
<small class="text-muted">
|
|
<i class="fas fa-puzzle-piece me-1"></i>
|
|
Processing chunk ${currentChunk} of ${totalChunks}
|
|
</small>
|
|
`;
|
|
} else if (progressContainer && (progress.status === 'processed' || progress.status === 'failed')) {
|
|
// Remove progress bar when processing is complete
|
|
progressContainer.remove();
|
|
}
|
|
}
|
|
|
|
function stopAllProgressMonitoring() {
|
|
Object.keys(progressMonitoring).forEach(fileId => {
|
|
clearInterval(progressMonitoring[fileId]);
|
|
delete progressMonitoring[fileId];
|
|
});
|
|
}
|
|
|
|
// Clean up when page unloads
|
|
window.addEventListener('beforeunload', stopAllProgressMonitoring);
|
|
|
|
// Auto-refresh processing status for files that are still processing
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
// Start progress monitoring for processing files
|
|
startProgressMonitoring();
|
|
|
|
// Check if there are processing files by looking for badges with "Processing" text
|
|
const badges = document.querySelectorAll('.badge');
|
|
let hasProcessingFiles = false;
|
|
|
|
badges.forEach(badge => {
|
|
if (badge && badge.textContent && badge.textContent.includes('Processing')) {
|
|
hasProcessingFiles = true;
|
|
}
|
|
});
|
|
|
|
if (hasProcessingFiles) {
|
|
console.log('Found processing files, setting up auto-refresh...');
|
|
|
|
// More frequent checking - every 3 seconds
|
|
const statusCheckInterval = setInterval(async () => {
|
|
console.log('Checking file statuses...');
|
|
|
|
try {
|
|
const response = await fetch('/api/files/status/all');
|
|
const result = await response.json();
|
|
|
|
if (result.success) {
|
|
console.log('Status check result:', result.summary);
|
|
|
|
// If no more processing files, reload page to show final status
|
|
if (result.summary.processing === 0) {
|
|
console.log('No more processing files, reloading page...');
|
|
clearInterval(statusCheckInterval);
|
|
location.reload();
|
|
return;
|
|
}
|
|
}
|
|
} catch (error) {
|
|
console.error('Error in status check:', error);
|
|
}
|
|
|
|
// Also check DOM for processing badges
|
|
const currentBadges = document.querySelectorAll('.badge');
|
|
let stillProcessing = false;
|
|
|
|
currentBadges.forEach(badge => {
|
|
if (badge && badge.textContent && badge.textContent.includes('Processing')) {
|
|
stillProcessing = true;
|
|
}
|
|
});
|
|
|
|
if (!stillProcessing) {
|
|
console.log('No processing badges found, reloading page...');
|
|
clearInterval(statusCheckInterval);
|
|
location.reload();
|
|
}
|
|
}, 3000); // Check every 3 seconds
|
|
|
|
// Also add a manual refresh reminder
|
|
setTimeout(() => {
|
|
const processingBadges = Array.from(document.querySelectorAll('.badge')).filter(badge =>
|
|
badge.textContent && badge.textContent.includes('Processing')
|
|
);
|
|
if (processingBadges.length > 0) {
|
|
console.log('Files still processing after 10 seconds, you can click refresh manually');
|
|
}
|
|
}, 10000);
|
|
}
|
|
});
|
|
|
|
// Preview revised file function
|
|
async function previewRevisedFile(fileId) {
|
|
try {
|
|
// Get file information by making an API call instead of using template data
|
|
const response = await fetch(`/api/revised-files/${fileId}/info`);
|
|
if (!response.ok) {
|
|
throw new Error('Failed to get file info');
|
|
}
|
|
|
|
const fileInfo = await response.json();
|
|
if (!fileInfo.success) {
|
|
throw new Error(fileInfo.error || 'Failed to get file info');
|
|
}
|
|
|
|
const file = fileInfo.file;
|
|
|
|
// Get file content using the new API endpoint
|
|
const contentResponse = await fetch(`/api/revised-files/${fileId}/content`);
|
|
if (!contentResponse.ok) {
|
|
throw new Error('Failed to load file content');
|
|
}
|
|
|
|
const contentResult = await contentResponse.json();
|
|
if (!contentResult.success) {
|
|
throw new Error('Failed to load file content');
|
|
}
|
|
|
|
const content = contentResult.content;
|
|
const modal = new bootstrap.Modal(document.getElementById('previewModal'));
|
|
|
|
// Create preview content with display mode toggle
|
|
document.getElementById('preview-content').innerHTML = `
|
|
<div class="d-flex justify-content-between align-items-center mb-3">
|
|
<div class="alert alert-info mb-0 flex-grow-1 me-3">
|
|
<i class="fas fa-brain me-2"></i>
|
|
<strong>AI-Revised Content</strong> • ${file.revisionType} • From: ${file.originalFileName || 'Unknown'}
|
|
</div>
|
|
<div class="btn-group btn-group-sm" role="group" id="preview-display-mode">
|
|
<input type="radio" class="btn-check" name="previewDisplayMode" id="preview-mode-markdown" value="markdown" checked>
|
|
<label class="btn btn-outline-secondary" for="preview-mode-markdown" title="Show as Markdown">
|
|
<i class="fab fa-markdown"></i>
|
|
</label>
|
|
|
|
<input type="radio" class="btn-check" name="previewDisplayMode" id="preview-mode-html" value="html">
|
|
<label class="btn btn-outline-secondary" for="preview-mode-html" title="Render as HTML">
|
|
<i class="fas fa-code"></i>
|
|
</label>
|
|
</div>
|
|
</div>
|
|
<div id="preview-content-container" class="border p-3 bg-light rounded" style="max-height: 400px; overflow-y: auto;">
|
|
<pre style="white-space: pre-wrap; word-wrap: break-word; margin: 0;">${escapeHtml(content)}</pre>
|
|
</div>
|
|
`;
|
|
|
|
// Add event listeners for display mode toggle
|
|
const modeMarkdown = document.getElementById('preview-mode-markdown');
|
|
const modeHtml = document.getElementById('preview-mode-html');
|
|
const contentContainer = document.getElementById('preview-content-container');
|
|
|
|
async function updatePreviewMode() {
|
|
const selectedMode = document.querySelector('input[name="previewDisplayMode"]:checked').value;
|
|
|
|
try {
|
|
const renderResponse = await fetch('/api/render-revised-content', {
|
|
method: 'POST',
|
|
headers: {
|
|
'Content-Type': 'application/json',
|
|
},
|
|
body: JSON.stringify({
|
|
content: content,
|
|
displayMode: selectedMode,
|
|
autoDetect: true
|
|
})
|
|
});
|
|
|
|
const renderResult = await renderResponse.json();
|
|
|
|
if (renderResult.success) {
|
|
if (selectedMode === 'html') {
|
|
let htmlContent = `<div class="rendered-markdown">${renderResult.renderedContent}</div>`;
|
|
|
|
if (renderResult.isMarkdownContent) {
|
|
htmlContent = `
|
|
<div class="alert alert-info alert-sm mb-2">
|
|
<small><i class="fas fa-info-circle me-1"></i>Markdown formatting detected and rendered</small>
|
|
</div>
|
|
${htmlContent}
|
|
`;
|
|
}
|
|
|
|
contentContainer.innerHTML = htmlContent;
|
|
contentContainer.style.backgroundColor = '#ffffff';
|
|
} else {
|
|
contentContainer.innerHTML = `<pre style="white-space: pre-wrap; word-wrap: break-word; margin: 0;">${escapeHtml(renderResult.renderedContent)}</pre>`;
|
|
contentContainer.style.backgroundColor = '#f8f9fa';
|
|
}
|
|
} else {
|
|
throw new Error(renderResult.error || 'Failed to render content');
|
|
}
|
|
} catch (error) {
|
|
console.error('Error rendering preview:', error);
|
|
// Fallback to escaped text
|
|
contentContainer.innerHTML = `<pre style="white-space: pre-wrap; word-wrap: break-word; margin: 0;">${escapeHtml(content)}</pre>`;
|
|
contentContainer.style.backgroundColor = '#f8f9fa';
|
|
}
|
|
}
|
|
|
|
modeMarkdown.addEventListener('change', updatePreviewMode);
|
|
modeHtml.addEventListener('change', updatePreviewMode);
|
|
|
|
modal.show();
|
|
} catch (error) {
|
|
console.error('Error previewing revised file:', error);
|
|
alert('Failed to preview file: ' + error.message);
|
|
}
|
|
}
|
|
|
|
// Delete revised file function
|
|
async function deleteRevisedFile(fileId) {
|
|
if (!confirm('Are you sure you want to delete this revised file? This action cannot be undone.')) {
|
|
return;
|
|
}
|
|
|
|
try {
|
|
const response = await fetch(`/api/revised-files/${fileId}`, {
|
|
method: 'DELETE'
|
|
});
|
|
|
|
const result = await response.json();
|
|
|
|
if (result.success) {
|
|
// Reload the page to update the file list
|
|
location.reload();
|
|
} else {
|
|
alert('Error deleting file: ' + (result.error || 'Unknown error'));
|
|
}
|
|
} catch (error) {
|
|
console.error('Error deleting revised file:', error);
|
|
alert('Network error: ' + error.message);
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<%- include('partials/footer') %>
|