david/video_upscaler
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Implement local server file browsing and selection to bypass client uploads

Browse Source
This commit is contained in:
david
2026-07-01 10:53:19 -04:00
parent 377e7df297
commit 969af7284e
3 changed files with 403 additions and 47 deletions
Download Patch File Download Diff File Expand all files Collapse all files
static/index.html
+43 -4
View File
@@ -46,10 +46,15 @@
<div id="drop-zone" class="upload-area">
<span class="upload-icon"><i class="fa-solid fa-cloud-arrow-up"></i></span>
<h3>Drag & Drop Video File(s)</h3>
<p>Supports MP4, MKV, AVI, MOV, WEBM (Max 500MB recommended for local upscaling)</p>
<button type="button" class="btn" onclick="document.getElementById('file-input').click()">
<i class="fa-solid fa-folder-open"></i> Browse Files
</button>
<p>Supports MP4, MKV, AVI, MOV, WEBM</p>
<div style="display: flex; gap: 1rem; justify-content: center; margin-top: 1rem; flex-wrap: wrap;">
<button type="button" class="btn" onclick="document.getElementById('file-input').click()">
<i class="fa-solid fa-cloud-arrow-up"></i> Upload From Device
</button>
<button type="button" class="btn btn-secondary" id="browse-server-btn">
<i class="fa-solid fa-server"></i> Choose From Server
</button>
</div>
</div>
</div>
@@ -871,6 +876,40 @@
</div>
</div>
<!-- Server File Browser Modal -->
<div id="file-browser-modal" class="modal-overlay" style="display: none; z-index: 1100;">
<div class="modal-card" style="max-width: 700px; display: flex; flex-direction: column; max-height: 80vh;">
<div class="modal-header">
<h3><i class="fa-solid fa-server"></i> Choose Video Files from Server</h3>
<button type="button" class="close-btn" id="file-browser-modal-close-btn">&times;</button>
</div>
<div class="modal-body" style="overflow-y: hidden; display: flex; flex-direction: column; height: 60vh; padding: 1.5rem; gap: 1rem;">
<div style="display: flex; gap: 0.5rem; align-items: center;">
<button type="button" id="file-browser-up-btn" class="btn btn-secondary btn-small" style="padding: 0.5rem 0.75rem;">
<i class="fa-solid fa-arrow-up"></i> Up
</button>
<input type="text" id="file-browser-current-path" style="flex: 1; padding: 0.5rem; border-radius: 6px; background: var(--bg-card); border: 1px solid var(--border-color); color: var(--text-primary); font-family: monospace; font-size: 0.85rem;" readonly>
</div>
<div id="file-browser-list" style="flex: 1; overflow-y: auto; border: 1px solid var(--border-color); border-radius: 8px; background: rgba(0, 0, 0, 0.2); padding: 0.5rem;">
<!-- File items list -->
</div>
<div id="file-browser-selected-info" style="font-size: 0.88rem; color: var(--text-muted); display: flex; justify-content: space-between; align-items: center;">
<span>Selected: <strong id="file-browser-selected-count" style="color: var(--primary);">0</strong> video file(s)</span>
</div>
<div id="file-browser-modal-status" style="font-size: 0.78rem; color: var(--danger); min-height: 1.2em;"></div>
<div style="display: flex; justify-content: flex-end; gap: 0.75rem; border-top: 1px solid var(--border-color); padding-top: 1rem;">
<button type="button" id="file-browser-cancel-btn" class="btn btn-secondary">Cancel</button>
<button type="button" id="file-browser-select-btn" class="btn btn-primary" disabled>Select File(s)</button>
</div>
</div>
</div>
</div>
<!-- SMB Share Modal -->
<div id="smb-modal" class="modal-overlay" style="display: none; z-index: 1200;">
<div class="modal-card" style="max-width: 500px;">