Fix refinement.

templates/project.html

@@ -5,7 +5,7 @@
     <div>
         <div class="d-flex align-items-center">
             <h1 class="mb-0 me-3">{{ project.name }}</h1>
-            {% if not locked %}
+            {% if not locked and not is_refining %}
             <button class="btn btn-sm btn-outline-secondary" data-bs-toggle="modal" data-bs-target="#editProjectModal"><i class="fas fa-edit"></i></button>
             {% endif %}
             <button class="btn btn-sm btn-outline-info ms-2" data-bs-toggle="modal" data-bs-target="#cloneProjectModal" title="Clone/Fork Project" data-bs-toggle="tooltip">
@@ -234,13 +234,13 @@
                     </p>
                     
                     <div class="d-flex justify-content-between mt-3">
-                        <button class="btn btn-sm btn-outline-primary" data-bs-toggle="modal" data-bs-target="#editBookModal{{ book.book_number }}" title="Edit Details">
+                        <button class="btn btn-sm btn-outline-primary" data-bs-toggle="modal" data-bs-target="#editBookModal{{ book.book_number }}" title="Edit Details" {% if is_refining %}disabled{% endif %}>
                             <i class="fas fa-edit"></i> Edit
                         </button>
                         {% if not locked %}
                         {% if not generated_books.get(book.book_number) %}
                         <form action="/project/{{ project.id }}/delete_book/{{ book.book_number }}" method="POST" onsubmit="return confirm('Remove this book from the plan?');">
-                            <button class="btn btn-sm btn-outline-danger"><i class="fas fa-trash"></i></button>
+                            <button class="btn btn-sm btn-outline-danger" {% if is_refining %}disabled{% endif %}><i class="fas fa-trash"></i></button>
                         </form>
                         {% endif %}
                         {% endif %}
@@ -279,7 +279,7 @@
         {% endfor %}
         
         <!-- Add Book Card -->
-        {% if not locked %}
+        {% if not locked and not is_refining %}
         <div class="col-md-4 col-lg-3" style="min-width: 200px;">
             <div class="card h-100 border-dashed d-flex align-items-center justify-content-center bg-light" style="border: 2px dashed #ccc; cursor: pointer;" data-bs-toggle="modal" data-bs-target="#addBookModal">
                 <div class="text-center text-muted py-5">
@@ -308,7 +308,7 @@
                     <a href="/project/{{ project.id }}/review" class="btn btn-sm btn-outline-info me-1">
                         <i class="fas fa-list-alt me-1"></i> Full Review
                     </a>
-                    {% if not locked %}
+                    {% if not locked and not is_refining %}
                     <button class="btn btn-sm btn-outline-secondary" data-bs-toggle="modal" data-bs-target="#importCharModal" data-bs-toggle="tooltip" title="Import characters from another project to create a shared universe.">
                         <i class="fas fa-link me-1"></i> Link / Import Series
                     </button>
@@ -493,7 +493,7 @@
 <!-- Refine Bible Modal -->
 <div class="modal fade" id="refineBibleModal" tabindex="-1">
     <div class="modal-dialog">
-        <form class="modal-content" action="/project/{{ project.id }}/refine_bible" method="POST">
+        <form class="modal-content" onsubmit="submitRefineModal(event); return false;" action="javascript:void(0);">
             <div class="modal-header">
                 <h5 class="modal-title">Refine Bible with AI</h5>
                 <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
@@ -604,5 +604,61 @@
     {% if active_run %}
     fetchLog();
     {% endif %}
+
+    function submitRefineModal(event) {
+        event.preventDefault();
+        const form = event.target;
+        const btn = form.querySelector('button[type="submit"]');
+        const originalText = btn.innerHTML;
+        
+        btn.disabled = true;
+        btn.innerHTML = '<span class="spinner-border spinner-border-sm me-2"></span>Queueing...';
+        
+        const instruction = form.querySelector('textarea[name="instruction"]').value;
+        
+        fetch(`/project/{{ project.id }}/refine_bible`, {
+            method: 'POST',
+            headers: {'Content-Type': 'application/json'},
+            body: JSON.stringify({ instruction: instruction, source: 'original' })
+        })
+        .then(res => res.json())
+        .then(data => {
+            if (data.task_id) {
+                const inputModalEl = document.getElementById('refineBibleModal');
+                const inputModal = bootstrap.Modal.getInstance(inputModalEl);
+                inputModal.hide();
+                
+                const modalHtml = `
+                <div class="modal fade" id="refineProgressModal" tabindex="-1" data-bs-backdrop="static">
+                    <div class="modal-dialog modal-dialog-centered"><div class="modal-content"><div class="modal-body text-center p-4">
+                        <div class="spinner-border text-warning mb-3" style="width: 3rem; height: 3rem;"></div>
+                        <h4>Refining Bible...</h4><p class="text-muted">The AI is processing your changes.</p>
+                    </div></div></div>
+                </div>`;
+                document.body.insertAdjacentHTML('beforeend', modalHtml);
+                const progressModal = new bootstrap.Modal(document.getElementById('refineProgressModal'));
+                progressModal.show();
+                
+                const pollInterval = setInterval(() => {
+                    fetch(`/task_status/${data.task_id}`).then(r => r.json()).then(status => {
+                        if (status.status === 'completed') {
+                            clearInterval(pollInterval);
+                            if (status.success) {
+                                window.location.reload();
+                            } else {
+                                alert("Refinement failed. Please check the logs.");
+                                window.location.reload();
+                            }
+                        }
+                    });
+                }, 2000);
+            }
+        })
+        .catch(err => {
+            alert("Error: " + err);
+            btn.disabled = false;
+            btn.innerHTML = originalText;
+        });
+    }
 </script>
 {% endblock %}