Spaces:
Running
Running
File size: 3,540 Bytes
c001f24 | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 | {% extends "base.html" %}
{% block title %}Redacting Document{% endblock %}
{% block content %}
<div class="container mt-5">
<div class="card bg-dark text-white">
<div class="card-header">
<h1 class="h3">Redaction in Progress</h1>
</div>
<div class="card-body">
<p>Your document is being automatically redacted. Please wait, this may take a few minutes depending on the document size.</p>
<div class="progress mb-3">
<div id="progress-bar" class="progress-bar progress-bar-striped progress-bar-animated" role="progressbar" style="width: 0%" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100"></div>
</div>
<div id="status-messages">
<div class="alert alert-info">Initializing...</div>
</div>
<div id="download-link-container" class="d-grid gap-2 mt-3" style="display: none;">
<a href="#" id="download-link" class="btn btn-success">Download Redacted PDF</a>
</div>
</div>
</div>
</div>
{% endblock %}
{% block scripts %}
<script>
document.addEventListener('DOMContentLoaded', () => {
const sessionId = '{{ session_id }}';
const progressBar = document.getElementById('progress-bar');
const statusMessages = document.getElementById('status-messages');
const downloadContainer = document.getElementById('download-link-container');
const downloadLink = document.getElementById('download-link');
function addStatus(message, type = 'info') {
const alertClass = `alert-${type}`;
const newStatus = document.createElement('div');
newStatus.className = `alert ${alertClass}`;
newStatus.textContent = message;
statusMessages.appendChild(newStatus);
statusMessages.scrollTop = statusMessages.scrollHeight;
}
addStatus('Connecting to redaction service...');
const eventSource = new EventSource(`/redaction_stream/${sessionId}`);
eventSource.onmessage = function(event) {
const data = JSON.parse(event.data);
if (data.error) {
addStatus(`Error: ${data.error}`, 'danger');
progressBar.classList.add('bg-danger');
progressBar.classList.remove('progress-bar-animated');
eventSource.close();
return;
}
if (data.progress) {
progressBar.style.width = `${data.progress} %`;
progressBar.setAttribute('aria-valuenow', data.progress);
}
if (data.message) {
addStatus(data.message);
}
if (data.complete) {
addStatus('Redaction complete! Your PDF is ready.', 'success');
progressBar.style.width = '100%';
progressBar.classList.remove('progress-bar-animated');
progressBar.classList.add('bg-success');
downloadLink.href = data.download_url;
downloadContainer.style.display = 'block';
eventSource.close();
}
};
eventSource.onerror = function() {
addStatus('Connection to the server was lost. Please try again.', 'danger');
progressBar.classList.add('bg-danger');
progressBar.classList.remove('progress-bar-animated');
eventSource.close();
};
});
</script>
{% endblock %}
|