added ability to know something's actually happening on the upload server page.
This commit is contained in:
@@ -182,6 +182,18 @@
|
||||
.upload-section:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
/* Upload feedback styles */
|
||||
.btn:disabled {
|
||||
background-color: #95a5a6;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
.upload-status {
|
||||
margin-top: 10px;
|
||||
font-weight: bold;
|
||||
color: var(--primary-color);
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
@@ -222,6 +234,7 @@
|
||||
|
||||
<div class="form-group">
|
||||
<button type="submit" class="btn" id="upload-button">Upload Files</button>
|
||||
<div id="upload-status" class="upload-status" style="display: none;" aria-live="polite"></div>
|
||||
</div>
|
||||
</form>
|
||||
</section>
|
||||
@@ -245,6 +258,7 @@
|
||||
|
||||
<div class="form-group">
|
||||
<button type="submit" class="btn" id="upload-folder-button">Upload Music Folder</button>
|
||||
<div id="upload-folder-status" class="upload-status" style="display: none;" aria-live="polite"></div>
|
||||
</div>
|
||||
</form>
|
||||
</section>
|
||||
@@ -356,6 +370,34 @@
|
||||
}, false);
|
||||
}
|
||||
|
||||
// Upload progress handling
|
||||
function setupUploadProgress(formSelector, buttonId, statusId) {
|
||||
const form = document.querySelector(formSelector);
|
||||
const button = document.getElementById(buttonId);
|
||||
const status = document.getElementById(statusId);
|
||||
const announcer = document.getElementById('status-announcer');
|
||||
|
||||
form.addEventListener('submit', function(e) {
|
||||
// Disable button and show status
|
||||
button.disabled = true;
|
||||
button.textContent = 'Uploading...';
|
||||
status.style.display = 'block';
|
||||
status.textContent = 'Upload in progress, please wait...';
|
||||
|
||||
// Announce to screen readers
|
||||
announcer.textContent = 'Upload started, please wait while files are being processed';
|
||||
|
||||
// Add a small delay to ensure the status is visible before form submits
|
||||
setTimeout(() => {
|
||||
// Form will submit naturally
|
||||
}, 100);
|
||||
});
|
||||
}
|
||||
|
||||
// Set up progress handling for both forms
|
||||
setupUploadProgress('form[action="/upload"]', 'upload-button', 'upload-status');
|
||||
setupUploadProgress('form[action="/upload_music"]', 'upload-folder-button', 'upload-folder-status');
|
||||
|
||||
// Check if the client is on local network
|
||||
fetch('/check_local')
|
||||
.then(response => {
|
||||
|
||||
Reference in New Issue
Block a user