fix a few things
This commit is contained in:
@@ -15,6 +15,10 @@
|
||||
pointer-events: none;
|
||||
opacity: 0.7;
|
||||
}
|
||||
.media-cleanup-modal-spinner {
|
||||
width: 2.5rem;
|
||||
height: 2.5rem;
|
||||
}
|
||||
</style>
|
||||
{% endblock %}
|
||||
|
||||
@@ -92,6 +96,8 @@
|
||||
name="action"
|
||||
value="preview"
|
||||
class="btn btn-primary"
|
||||
data-loading-title="Previewing unused files"
|
||||
data-loading-message="Scanning media storage for orphaned files."
|
||||
>
|
||||
<i class="bi bi-search me-1"></i> Preview unused files
|
||||
</button>
|
||||
@@ -101,6 +107,8 @@
|
||||
value="cleanup"
|
||||
class="btn btn-danger"
|
||||
hx-confirm="Delete unused media files now? This cannot be undone."
|
||||
data-loading-title="Deleting unused files"
|
||||
data-loading-message="Removing orphaned media and recalculating disk usage."
|
||||
>
|
||||
<i class="bi bi-trash me-1"></i> Delete unused files
|
||||
</button>
|
||||
@@ -118,4 +126,62 @@
|
||||
{% include 'rad/partials/_media_cleanup_result.html' %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="modal fade" id="media-cleanup-loading-modal" tabindex="-1" aria-labelledby="media-cleanup-loading-title" aria-hidden="true" data-bs-backdrop="static" data-bs-keyboard="false">
|
||||
<div class="modal-dialog modal-dialog-centered modal-sm">
|
||||
<div class="modal-content border-0 shadow">
|
||||
<div class="modal-body text-center py-4">
|
||||
<div class="spinner-border text-info media-cleanup-modal-spinner mb-3" role="status" aria-hidden="true"></div>
|
||||
<h5 id="media-cleanup-loading-title" class="mb-1">Working...</h5>
|
||||
<p id="media-cleanup-loading-message" class="text-muted mb-0 small">Please wait while this operation completes.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
(function () {
|
||||
var form = document.getElementById('media-cleanup-form');
|
||||
var modalEl = document.getElementById('media-cleanup-loading-modal');
|
||||
if (!form || !modalEl || typeof bootstrap === 'undefined') {
|
||||
return;
|
||||
}
|
||||
|
||||
var titleEl = document.getElementById('media-cleanup-loading-title');
|
||||
var messageEl = document.getElementById('media-cleanup-loading-message');
|
||||
var loadingModal = bootstrap.Modal.getOrCreateInstance(modalEl);
|
||||
var activeButton = null;
|
||||
|
||||
form.addEventListener('click', function (event) {
|
||||
var btn = event.target.closest('button[type="submit"]');
|
||||
if (!btn || !form.contains(btn)) {
|
||||
return;
|
||||
}
|
||||
activeButton = btn;
|
||||
});
|
||||
|
||||
document.body.addEventListener('htmx:beforeRequest', function (event) {
|
||||
if (event.target !== form) {
|
||||
return;
|
||||
}
|
||||
var title = activeButton ? activeButton.getAttribute('data-loading-title') : null;
|
||||
var message = activeButton ? activeButton.getAttribute('data-loading-message') : null;
|
||||
titleEl.textContent = title || 'Working...';
|
||||
messageEl.textContent = message || 'Please wait while this operation completes.';
|
||||
loadingModal.show();
|
||||
});
|
||||
|
||||
function hideLoadingModal(event) {
|
||||
if (event.target !== form) {
|
||||
return;
|
||||
}
|
||||
loadingModal.hide();
|
||||
activeButton = null;
|
||||
}
|
||||
|
||||
document.body.addEventListener('htmx:afterRequest', hideLoadingModal);
|
||||
document.body.addEventListener('htmx:responseError', hideLoadingModal);
|
||||
document.body.addEventListener('htmx:sendError', hideLoadingModal);
|
||||
})();
|
||||
</script>
|
||||
{% endblock %}
|
||||
|
||||
Reference in New Issue
Block a user