storm/gaming-image-files
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

added ability to know something's actually happening on the upload server page.

Browse Source
This commit is contained in:
Storm Dragon
2025-07-18 23:01:01 -04:00
parent b0533ffaaa
commit a57ff6ac77
1 changed files with 42 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
home/stormux/.local/upload_server/templates/index.html
+42
View File
@@ -182,6 +182,18 @@
.upload-section:last-child { .upload-section:last-child {
border-bottom: none; 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> </style>
</head> </head>
<body> <body>
@@ -222,6 +234,7 @@
<div class="form-group"> <div class="form-group">
<button type="submit" class="btn" id="upload-button">Upload Files</button> <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> </div>
</form> </form>
</section> </section>
@@ -245,6 +258,7 @@
<div class="form-group"> <div class="form-group">
<button type="submit" class="btn" id="upload-folder-button">Upload Music Folder</button> <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> </div>
</form> </form>
</section> </section>
@@ -356,6 +370,34 @@
}, false); }, 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 // Check if the client is on local network
fetch('/check_local') fetch('/check_local')
.then(response => { .then(response => {